搜索功能在用户使用体验上是非常重要的，让用户能够快速地找到自己需要的内容。基于 Material Design 风格的 SearchView 自定义控件可以提供给用户更加美观、友好的搜索体验。在本文中，我们将详细介绍如何使用 Material Design 风格的 SearchView 自定义控件。
Material Design 简介
Material Design 是 Google 在 Android 5.0 系统中推出的一种全新设计语言，旨在打造出更加美观、自然且具有层次感的用户界面。Material Design 的设计理念借鉴了现实世界的虚实交互特点，同时采用了平面化设计风格、具有光影效果的立体感，使得整个界面更加生动丰富，注重多元素之间的视觉和空间关系。
SearchView 控件简介
SearchView 控件是为 Android 系统提供的一个搜索框控件，通常情况下，在 ActionBar 中是通过点击搜索图标打开，默认情况下，搜索图标会右对齐。
SearchView 控件的局限性
默认情况下，SearchView 的样式比较简单，且不具有美观感，不能很好地满足 Material Design 的设计标准。在满足实用功能的同时，我们也要注重 UI 设计。
下面，我们来介绍如何基于 Material Design 风格的 SearchView 自定义控件。我们将会实现如下图所示的效果。
可以发现，我们设计的 SearchView 自定义控件具有以下特点：
- 界面风格统一
- 输入框背景颜色美观
- 动态图标
自定义控件代码实现
首先，在项目中创建一个名称为 MaterialDesignSearchView.kt 文件。
布局文件
在 res/layout 目录下，新建一个布局文件 material_design_searchview.xml，代码如下：
-- -------------------- ---- -------
----- ------------- ------------------
------------------------------------------------------ ----------------------------------------------------------
---------------------------------------------------
-----------------------------------
-----------------------------------
------------------------------------
-------------------------------------
------------------------
-----------------------------------------
------------------------------
------------------------
--------------------------------------------------------
--------------------------------------
-----------------------------------
------------------------------------
-----------------------------------------------
-----------------------------
---------------------------------------
-------------------- --
--------------------------------------------------------这里我们使用了 TextInputLayout 和 TextInputEditText，分别用于控制背景颜色、图标和输入框的样式。
自定义控件类
接着我们创建 MaterialDesignSearchView.kt 类文件，并将自定义控件的代码实现如下：
-- -------------------- ---- -------
------ -----------------------
------ ----------------------
------ ---------------------------
------ -------------------------
------ -----------------
------ -----------------------
------ ----------------------------
------ -----------------------------------
------ -----------------------------------------------------
----- ------------------------ - --------------- -
------- --- --------- -------- - --------------------------
-------------------- -------- - -------------- -
----------
-
-------------------- -------- ------ ------------- - -------------- ------ -
----------
-
-------------------- -------- ------ ------------- ------------- ---- - -------------- ------ ------------- -
----------
-
------- --- ---------- -
------------- - -----
-----------------
--------------------------------- - -- -------- -- ---------------------------- -
------------------
-
------- --- ---------------------------- -------- -
------------
---------- - ---------
-
------- --- ------------------ -
------------------------------------------------------------------ --------------------- -------------------------
-------------------------------------------------- ---------------
------------------ - -----------
----------- - ---------------
--------------- - ---------------------------------- ---------------------
--------------- - ------------------------
----------- - ------------------------------- --------------
-
--- ----------------- ------ ---- --------- ------- -
----------------------------------------------------- -------
--------------------------------------------------------- -------
------------- - --------
-
-MaterialDesignSearchView类继承自TextInputLayout，实现了TextInputLayout的全部功能，增加了自定义控件特色的代码。initView()方法在初始化控件时，设置isHintEnabled为false，从而屏蔽了默认的提示文字。- 增加了
handleFocusChanged()方法，用于处理焦点变化事件，当输入框失去焦点时，隐藏控件。 - 使用
setTextColor()方法设置输入框内文字颜色，使用setHintTextColor()方法设置提示文字颜色。 - 使用
endIconMode和endIconDrawable属性设置动态图标，使用boxBackgroundColor设置输入框背景颜色。
自定义控件使用
接下来，我们在项目中使用自定义控件。
-- -------------------- ---- -------
------------------------------------------------
-----------------------------
-----------------------------------
----------------------------
------------------------
-----------------------------------------
------------------------------
-----------------------
-------------------------------------
-------------------------------------
-----------------------------------------
-------------------------------------------
-----------------------------------------------在项目布局文件中，我们将自定义控件作为一个 View 使用，并赋予一定的宽高约束条件。
通过 app:endIconDrawable 属性设置动态图标，使用 app:hintTextColor 设置提示文字颜色。
在 Activity 中使用自定义控件，示例代码如下：
-- -------------------- ---- -------
----- ------------ - ------------------- -
------- -------- --- ----------- ------------------------
-------- --- ---------------------------- -------- -
----------------------------------
--------------------------------------
---------- - ------------------------------
-------------------------------------- -------------------------------------
-
-在 Activity 中，我们通过 findViewById() 方法绑定视图控件，并使用 setHint() 方法设置输入提示文字和颜色。
结语
本文主要介绍了如何基于 Material Design 风格开发 SearchView 自定义控件。通过这个例子，我们了解到如何实现自定义控件，并且学习了如何使用 Material Design 风格制定界面元素。希望读者们能够通过本文，对 Android 自定义控件功能有所了解，更好地应用到实际开发当中。
Source: FunTeaLearn,Please indicate the source for reprints https://funteas.com/post/6794e09f504e4ea9bd9bf4c4