带有菜单的搜索视图圆形背景

searchview rounded background with menu

我正在尝试输入 a rounded rectangle for my search view bar,但我不知道如何输入。 我已经测试了许多我可以在 Whosebug 上找到的其他代码,但是由于我使用的是一个带有项目的菜单,没有使用其他代码,所以很难弄清楚。

这是我的 java 代码:

    @Override
    public boolean onCreateOptionsMenu(Menu menu) {
        MenuInflater inflater = getMenuInflater();
        inflater.inflate(R.menu.example_menu, menu);

        MenuItem searchItem = menu.findItem(R.id.action_search);
        SearchView searchView = (SearchView) searchItem.getActionView();

        searchView.setImeOptions(EditorInfo.IME_ACTION_DONE);

        searchView.setOnQueryTextListener(new SearchView.OnQueryTextListener() {
            @Override
            public boolean onQueryTextSubmit(String query) {
                return false;
            }

            @Override
            public boolean onQueryTextChange(String newText) {
                adapter.getFilter().filter(newText);
                return false;
            }
        });
        return true;
    }

这是我的 XML 代码:

<?xml version="1.0" encoding="utf-8"?>
<menu xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:app="http://schemas.android.com/apk/res-auto"
    android:id="@+id/search_view_menu">

    <item
        android:id="@+id/action_search"
        android:icon="@drawable/ic_search"
        android:title="Search"
        app:actionViewClass="androidx.appcompat.widget.SearchView"
        app:showAsAction="ifRoom|collapseActionView"/>

</menu>

您必须访问 searchview 中的 edittext child 并改为更改该视图的背景资源。我使用了您的 xml 文件,并像这样更改了您的 onCreateOptionsMenu 函数:

@Override
    public boolean onCreateOptionsMenu(Menu menu) {
        MenuInflater inflater = getMenuInflater();
        inflater.inflate(R.menu.main_menu, menu);

        MenuItem searchItem = menu.findItem(R.id.action_search);
        SearchView searchView = (SearchView) searchItem.getActionView();
        searchView.setImeOptions(EditorInfo.IME_ACTION_DONE);

        //This is where you find the edittext and set its background resource
        View searchPlate = searchView.findViewById(androidx.appcompat.R.id.search_src_text);
        searchPlate.setBackgroundResource(R.drawable.rounded_search);

        searchView.setOnQueryTextListener(new SearchView.OnQueryTextListener() {
            @Override
            public boolean onQueryTextSubmit(String query) {
                return false;
            }

            @Override
            public boolean onQueryTextChange(String newText) {
                Log.d("Text changed", newText);
                return false;
            }
        });
        return true;
    }

这是您正在使用的背景资源的额外 xml 可绘制对象:

<?xml version="1.0" encoding="utf-8"?>
<shape xmlns:android="http://schemas.android.com/apk/res/android">
    <solid android:color="#ffffff"/>
    <corners android:radius="8dp"/>
</shape>

改变半径值会改变拐角的圆度。

这是您问题的解决方案。

  1. 在可绘制文件夹中为您的 Edittext 创建一个弯曲的背景
  2. 将弯曲的背景添加到 Edittext

解决方案代码:

在 Drawable 文件夹

中创建一个名为 curve_edittext_bg 的文件
    <?xml version="1.0" encoding="utf-8"?>
<selector xmlns:android="http://schemas.android.com/apk/res/android">
    <item>
        <shape android:shape="rectangle">
            <solid android:color="#ffffff"/>
            <corners android:radius="6dp" />
            <stroke
                android:width="1dp"
                android:color="#27000000"
                />
        </shape>
    </item>
</selector> 

现在将 curve_edittext_bg 添加到 Edittext

    <TextView
                android:layout_width="match_parent"
                android:layout_height="50dp"
                android:drawableStart="@drawable/ic_location_blast_blue"
                android:drawableEnd="@drawable/search"
                android:drawablePadding="10dp"
                android:background="@drawable/curve_edittext_bg"
                android:ellipsize="end"
                android:layout_margin="10dp"
                android:layout_alignParentTop="true"
                android:gravity="start|center_vertical"
                android:padding="16dp"
                android:text="Search location"
                android:textColor="@color/quantum_grey600" /> 

我们完成了

示例输出

Output Image