Saturday 31 December 2016

Material Search View in andorid (SearchView in action bar with search suggestions same as Google Play Store in android )

FULL VIDEO HERE:-

FULL CODE HERE:-

Material Search View (like google play store search bar)
 

Step1add this dependency to your build.gradle and rebuild the project.
                             Build.gradle
dependencies {
    implementation fileTree(dir:'libs',include: ['*.jar'])
      implementation'com.miguelcatalan:materialsearchview:1.4.0'
}

STEP2: ADD menu file menu_dash.XML (res/menu/menu_dash.xml )
       1.Res/menu/menu_dash.xml
                 
                        menu_dash.XML

<menu xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:app="http://schemas.android.com/apk/res-auto"
xmlns:tools="http://schemas.android.com/tools">
<item
    android:id="@+id/action_search"
    android:orderInCategory="100"
    android:icon="@drawable/ic_search_white_24dp"
    app:showAsAction="ifRoom"
    android:title="search" />
</menu>
  

STEP 3: Create the layout activity_search.xml :
`1.res/layout/activity_search.xml
                    activity_search.XML

<FrameLayout
android:id="@+id/toolbar_container"
android:layout_width="match_parent"
android:layout_height="wrap_content">
<android.support.v7.widget.Toolbar
android:id="@+id/toolbar"
android:layout_width="match_parent"
android:layout_height="?attr/actionBarSize"
android:background="@color/appcolor"
android:elevation="4dp"
android:fitsSystemWindows="true"
android:minHeight="?attr/actionBarSize"
android:theme="@style/AppTheme.AppBarOverlay" />
<com.miguelcatalan.materialsearchview.MaterialSearchView
android:id="@+id/search_view"
android:layout_width="match_parent"
android:layout_height="wrap_content" />
</FrameLayout

STEP 4: Add this in String.xml in values folder
    1. Res/value/string.xml
                                         String.xml   

<string-array name="query_suggestions">
<item>Furniture</item>
<item>Women Fashion</item>
<item>Hotels</item>
<item>Man Fashion</item>
<item>Electronics Appliances</item>
</string-array>

STEP5: create Search.Java class under (src/Search.java )
1.src/search.java
                                               Search.Java


 package com.example.amitrawat.imageanimation;
         import android.support.v7.app.AppCompatActivity;
         import android.os.Bundle;
         import android.support.v7.widget.Toolbar;
         import android.view.Menu;
         import android.view.MenuItem;
         import android.view.Window;
         import android.widget.Toast;
         import com.miguelcatalan.materialsearchview.MaterialSearchView;

public class MainActivity extends AppCompatActivity {
    MaterialSearchView searchView;
    Toolbar toolbar;

    @Override
    protected void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        setContentView(R.layout.activity_main);
        toolbar = (Toolbar) findViewById(R.id.toolbar);
        setSupportActionBar(toolbar);
        searchViewCode();
    }

    private void searchViewCode() {
        searchView = (MaterialSearchView) findViewById(R.id.search_view);
        searchView.setSuggestions(getResources().getStringArray(R.array.query_suggestions));
        searchView.setEllipsize(true);
        searchView.setOnQueryTextListener(new MaterialSearchView.OnQueryTextListener() {
            @Override
            public boolean onQueryTextSubmit(String query) {
                Toast.makeText(getApplicationContext(), query, Toast.LENGTH_SHORT).show();
                return false;
            }

            @Override
            public boolean onQueryTextChange(String newText) {
                return false;
            }
        });
        searchView.setOnSearchViewListener(new MaterialSearchView.SearchViewListener() {
            @Override
            public void onSearchViewShown() {
            }

            @Override
            public void onSearchViewClosed() {
            }
        });
    }    /*click alt+insert key */

    @Override
    public boolean onCreateOptionsMenu(Menu menu) {
        getMenuInflater().inflate(R.menu.material_search_menu, menu);
        MenuItem item = menu.findItem(R.id.action_search);
        searchView.setMenuItem(item);
        return true;
    }

    @Override
    public boolean onOptionsItemSelected(MenuItem item) {
        switch (item.getItemId()) {
            case R.id.action_search:
                return true;
            default:
                return super.onOptionsItemSelected(item);
        }
    }

    @Override
    public void onBackPressed() {
        if (searchView.isSearchOpen()) {
            searchView.closeSearch();
        } else {
            super.onBackPressed();
        }
    }
}