带有边框和文本的 SearchView

Question

我想让我的 SearchView 像这样：

如何在 Java 中实施？

Answer 1

首先在布局文件中创建搜索视图

        <SearchView
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:background="@drawable/bg_round"/>

然后 make drawable 并将其命名为 bg_round 并将下面的代码放入该 drawable

<?xml version="1.0" encoding="utf-8"?>
    <shape
           xmlns:android="http://schemas.android.com/apk/res/android"
           android:shape="rectangle">
      <solid android:color="#fff"/> // this the the inner background color
      <stroke android:width="5dp" //this is for the stroke of the border
      android:color="@android:color/black"/> //this is the stroke color
      <corners android:radius="4cdp" /> //this is the corner radius
    </shape>

Answer 2

您在图像中看到的是 Material TextInput 和 OutLined 样式。您可以在官方文档 here.

中阅读更多关于 Filled 样式的信息

此外，请不要忘记为此需要 material 库。为此，做

implementation 'com.google.android.material:material:1.2.0-alpha06'

现在，你可以用它做的是通过添加 startDrawable 和 CornerRadius:

使它像上面那样

如下所示创建 XML 小部件并放置 startIcon.

<com.google.android.material.textfield.TextInputLayout
    android:id="@+id/editTextLayout"
    style="@style/TextInputLayoutAppearanceOutLined"
    android:layout_width="0dp"
    android:layout_height="wrap_content"
    android:hint="Search View"
    app:hintEnabled="true"
    app:startIconDrawable=" *** Your ICON *** ">

      <com.google.android.material.textfield.TextInputEditText
         android:id="@+id/edittext"
         android:layout_width="match_parent"
         android:layout_height="wrap_content"
         android:inputType="text"
         android:textSize="12sp" />

     </com.google.android.material.textfield.TextInputLayout>

那么，就是这个样式TextInputLayoutAppearanceOutLined，把它放在你的style.xml文件中：

<style name="TextInputLayoutAppearanceOutLined" parent="Widget.MaterialComponents.TextInputLayout.OutlinedBox">
<item name="hintTextAppearance">@style/HintText</item>
<item name="helperTextTextAppearance">@style/HintText</item>

<item name="android:textColor">@color/dark_grey</item>
<item name="android:textColorHint">@color/colorAccent</item>
<item name="hintTextColor">@color/colorAccent</item>
<item name="boxStrokeColor">@color/colorAccent</item>
<item name="startIconTint">@color/colorAccent</item>
<item name="boxBackgroundColor">@color/white</item>

<item name="boxCornerRadiusBottomEnd">@dimen/_26sdp</item>
<item name="boxCornerRadiusBottomStart">@dimen/_26sdp</item>
<item name="boxCornerRadiusTopEnd">@dimen/_26sdp</item>
<item name="boxCornerRadiusTopStart">@dimen/_26sdp</item>

<item name="boxStrokeWidthFocused">1dp</item>


<item name="hintEnabled">true</item>
<item name="hintAnimationEnabled">true</item>

<item name="colorControlNormal">@color/colorAccent</item>
<item name="colorControlActivated">@color/colorPrimary</item>

显然，您也可以在 XML 中进行设置，但样式让您可以更好地控制您的应用程序，通过一次编辑即可更改所有位置的元素。

现在，您将拥有您想要的 SearchView 外观，但要进一步使其表现得像 SearchView，您需要为 ListAdapter 设置过滤让它发挥作用。

为此，您可以查看 here。

带有边框和文本的 SearchView

SearchView with border and text

java

android

searchview