文章目录
- MaterialSearchBar:Android 上的 Material Design 搜索栏
- 1、 这玩意儿是干嘛的
- 2、 它能做什么
- 3、 怎么用
- 4、 样式怎么调
- 5、 几个细节
- 6、 适合哪些人用
MaterialSearchBar:Android 上的 Material Design 搜索栏
MaterialSearchBar 在 GitHub 上已经拿到 2.0K Star。
这是 mancj 个人维护的一个 Android 库,干的事很专注:把 Lollipop 风格的 Material Design SearchView 塞进你的项目里。可定制、带语音输入、能记住搜索历史,构造好的搜索栏几行布局就能跑起来。
1、 这玩意儿是干嘛的
就一件事:给 Android App 提供一个符合 Material Design 规范的搜索栏组件。
Android 原生搜索框样式杂、交互碎,自己写一个要处理焦点、动画、历史记录、语音按钮、菜单、返回箭头,整套下来上百行样板代码。MaterialSearchBar 把这些都打包好了,开箱即用,样式统一。
支持jitpack 一行依赖引入,布局里 add 一个 view,activity 里 setListener,搜索框就能用。
2、 它能做什么
核心能力分几块:
- 搜索框基础交互。点击展开、输入关键字、点关闭收起,状态切换有 Material 风格的过渡动画。
- 语音输入模式。把麦克风图标替换掉搜索图标,调用系统语音识别。
- 搜索历史。自动保存用户输入过的查询,下拉显示建议列表,可设最大保存数。
- 菜单支持。可以 inflate 一个 menu,挂右上角,做筛选或设置入口。
- 返回箭头。搜索栏展开时左侧出现返回箭头,配合nav 抽屉很顺手。
- 自定义建议适配器。默认建议列表不够用,可以塞自己的 adapter,做带头像、带分类的建议项。
- 几十个 xml 属性。颜色、图标、形状、tint、光标颜色、提示文字、占位符,全可调。
3、 怎么用
集成走 jitpack。先在项目级 build.gradle 加 maven 仓库:
allprojects{repositories{maven{url"https://jitpack.io"}}}模块级 build.gradle 加依赖:
implementation'com.github.mancj:MaterialSearchBar:X.X.X'布局里像普通控件一样加进去:
<com.mancj.materialsearchbar.MaterialSearchBarstyle="@style/MaterialSearchBarLight"app:mt_speechMode="true"app:mt_hint="Custom hint"app:mt_maxSuggestionsCount="10"android:layout_width="match_parent"android:layout_height="wrap_content"android:id="@+id/searchBar"/>activity 里 setOnSearchActionListener 接收回调:
searchBar.setOnSearchActionListener(this);searchBar.setLastSuggestions(loadSearchSuggestionFromDisk());点确认搜索时 onSearchConfirmed 触发。退出页面时 getLastSuggestions 拿到历史列表存本地,下次进来 setLastSuggestions 恢复。
4、 样式怎么调
库自带 MaterialSearchBarLight 和 MaterialSearchBarDark 两套主题。改颜色有两条路。
一条走 styles.xml。parent 选一套内置主题,override 掉 mt_ 开头的属性,比如 mt_searchBarColor、mt_dividerColor、mt_navIconTint。每条属性对应搜索栏的一个视觉元素,搜索栏主色、分隔线、左右两侧图标 tint、文字颜色、光标颜色、占位符颜色都独立可调。
另一条走 colors.xml。库内置了一套色值 key,把对应颜色改掉全局生效。Light 主题用 #3a3a3a 做图标色、#FFFFFF 做底色;Dark 主题用 #00a1ff 做图标色、#303030 做底色。改两三个色值就能切换品牌色。
5、 几个细节
mt_maxSuggestionsCount 设大设小有讲究。设太小用户输入几次就被截断,设太大下拉列表会很长,10 是个比较顺手的默认值。建议历史只在内存里,不会自动落盘,要持久化得自己 saveSearchSuggestionToDisk。
mt_speechMode 开了之后图标换成麦克风,点的瞬间库会调起 ACTION_RECOGNIZE_SPEECH,没装语音引擎的设备会跳空。线上项目最好先测一下意向是否可解析。
mt_roundedSearchBarEnabled 在 v21 以上是胶囊形搜索栏,21 以下回退老版样式。如果整套 App 用 Material 风格,开这个视觉会更顺。
6、 适合哪些人用
- 做 Android App、需要在多个页面加 Material 风格搜索栏的开发者
- 老项目想给搜索框换 Material Design 皮、不想自己写一堆过渡动画的人
- 想要带搜索历史和语音输入、又不想从零撸一个控件的小团队
- 维护已有项目、预算有限想用现成开源库替代自研控件的工程师
terial Design 皮、不想自己写一堆过渡动画的人
- 想要带搜索历史和语音输入、又不想从零撸一个控件的小团队
- 维护已有项目、预算有限想用现成开源库替代自研控件的工程师