Material 风格的搜索框MaterialSearchView的使用

大多数App中都有搜索的功能，虽然国内实实在在的遵循Google material design设计语言来设计的App实在不多，但个人感觉MD真的是非常值得研究，这次给大家介绍的是 Material 风格的搜索框MaterialSearchView。

MaterialSearchView Github地址:https://github.com/MiguelCatalan/MaterialSearchView ,强烈建议大家学习学习，虽然只是简单的使用，但是还是整理了一下画了个简单的思维导图。

自己也写了下简单的Demo，下面主要就是围绕怎么实现下面效果记录

1：在module的gradle中添加依赖

 compile 'com.miguelcatalan:materialsearchview:1.4.0'

2：将MaterialSearchView与Toolbar一起添加到布局文件中

     <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/theme_primary" />

         <com.miguelcatalan.materialsearchview.MaterialSearchView
             android:id="@+id/search_view"
             android:layout_width="match_parent"
             android:layout_height="wrap_content" />
     </FrameLayout>

3：在menu文件夹下新建菜单文件，将搜索项添加到菜单文件中

     <item
         android:id="@+id/action_search"
         android:icon="@drawable/ic_action_action_search"
         android:orderInCategory="100"
         android:title="@string/abc_search_hint"
         app:showAsAction="always" />

4：在Activity的onCreateOptionsMenu中定义菜单

 @Override
     public boolean onCreateOptionsMenu(Menu menu) {
         getMenuInflater().inflate(R.menu.menu_main, menu);

         MenuItem item = menu.findItem(R.id.action_search);
         searchView.setMenuItem(item);

         return true;
     }

5：设置监听，编辑过滤条件

 searchView.setOnQueryTextListener(new MaterialSearchView.OnQueryTextListener() {
             @Override
             public boolean onQueryTextSubmit(String query) {
                 //Do some magic
                 return false;
             }

             @Override
             public boolean onQueryTextChange(String newText) {
                 filter(newText);
                 return true;
             }
         });

         searchView.setOnSearchViewListener(new MaterialSearchView.SearchViewListener() {
             @Override
             public void onSearchViewShown() {
                 //Do some magic
             }

             @Override
             public void onSearchViewClosed() {
                 //Do some magic
             }
         });

6：设置back按钮来关闭搜索视图

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

MaterialSearchView的使用步骤如上，咱们看看第五点的过滤条件的代码

  private void filter(String query) {
         try {
             List<Person> filterDateList = new ArrayList<Person>();
             //当输入框的内容为空时显示全部列表
             if (TextUtils.isEmpty(query)) {
                 filterDateList = datas;
             } else {
                 //清空
                 filterDateList.clear();
                 //遍历列表
                 for (Person person : datas) {
                     if (person.getName().contains(query.toString())
                             || person.getCareer().contains(query.toString())
                             ) {
                         filterDateList.add(person);
                     }
                 }
             }
             adapter.update(filterDateList);
         } catch (Exception e) {
             e.printStackTrace();
         }
     }

我们在RecycleView 的适配器Adapter中添加了一个方法Update.

     public void update(List<Person> list) {
         this.datas = list;
         notifyDataSetChanged();
     }