如何在 Android 中自定义扩展的 SearchView inside 操作栏?
How to customize expanded SearchView inside action bar in Android?
在 ActionBar 中展开时的默认 SearchView 如下图所示:
我想自定义扩展的 SearchView 类似于此图片 :
我是 Android 开发的新手。如果有人能帮助我,我将不胜感激。
SearchView for Androidx 包由一个 EditText 和一些 AppCompatImageView 喜欢关闭图标和搜索图标
要对其进行自定义,您必须访问我已经谈到的这些视图
例如,要像您显示的图像那样更改背景,您需要创建如下图所示的形状:
<?xml version="1.0" encoding="utf-8"?>
<shape xmlns:android="http://schemas.android.com/apk/res/android">
<solid android:color="#02B15D" />
<corners android:radius="15dp" />
<stroke
android:width="2dp"
android:color="#1A40FF" />
</shape>
这是它的形状:
上面的形状必须添加到EditText
的背景中
要获得这个 EditText 很简单,只需在你身上使用这个 onCreateOptionMenu
:
@Override
public boolean onCreateOptionsMenu(Menu menu) {
getMenuInflater().inflate(R.menu.toolbar_menu, menu);
SearchView searchView = (SearchView) menu.findItem(R.id.search).getActionView();
EditText editText = (searchView.findViewById(androidx.appcompat.R.id.search_src_text)); // get the EditText from it
editText.setBackgroundResource(R.drawable.round_search); // set the background to searchView
// you can do more with the editText like textColor hint color .....
return super.onCreateOptionsMenu(menu);
}
要自定义搜索图标,请使用此
AppCompatImageView searchIcon = searchView.findViewById(androidx.appcompat.R.id.search_mag_icon);
对于显示在工具栏上的搜索按钮,请使用:
AppCompatImageView search_button = searchView.findViewById(androidx.appcompat.R.id.search_button);
最后关闭按钮使用这个:
AppCompatImageView search_close_btn = searchView.findViewById(androidx.appcompat.R.id.search_close_btn);
结果是这样的:
更新
要使搜索图标在 SearchView 的左侧可见,您可以使用以下方法将图标添加到 EditText:
editText.setCompoundDrawablesWithIntrinsicBounds(android.R.drawable.ic_menu_search,0,0,0);
如果您使用:
AppCompatImageView searchIcon = searchView.findViewById(androidx.appcompat.R.id.search_mag_icon); searchIcon.setImageResource(android.R.drawable.ic_menu_search);
您必须添加 searchView.setIconifiedByDefault(false);
但图标在形状外可见,请参见下图:
所以如果你想要形状内的图标使用第一种方法
在 ActionBar 中展开时的默认 SearchView 如下图所示:
我想自定义扩展的 SearchView 类似于此图片 :
我是 Android 开发的新手。如果有人能帮助我,我将不胜感激。
SearchView for Androidx 包由一个 EditText 和一些 AppCompatImageView 喜欢关闭图标和搜索图标
要对其进行自定义,您必须访问我已经谈到的这些视图
例如,要像您显示的图像那样更改背景,您需要创建如下图所示的形状:
<?xml version="1.0" encoding="utf-8"?>
<shape xmlns:android="http://schemas.android.com/apk/res/android">
<solid android:color="#02B15D" />
<corners android:radius="15dp" />
<stroke
android:width="2dp"
android:color="#1A40FF" />
</shape>
这是它的形状:
上面的形状必须添加到EditText
的背景中要获得这个 EditText 很简单,只需在你身上使用这个 onCreateOptionMenu
:
@Override
public boolean onCreateOptionsMenu(Menu menu) {
getMenuInflater().inflate(R.menu.toolbar_menu, menu);
SearchView searchView = (SearchView) menu.findItem(R.id.search).getActionView();
EditText editText = (searchView.findViewById(androidx.appcompat.R.id.search_src_text)); // get the EditText from it
editText.setBackgroundResource(R.drawable.round_search); // set the background to searchView
// you can do more with the editText like textColor hint color .....
return super.onCreateOptionsMenu(menu);
}
要自定义搜索图标,请使用此
AppCompatImageView searchIcon = searchView.findViewById(androidx.appcompat.R.id.search_mag_icon);
对于显示在工具栏上的搜索按钮,请使用:
AppCompatImageView search_button = searchView.findViewById(androidx.appcompat.R.id.search_button);
最后关闭按钮使用这个:
AppCompatImageView search_close_btn = searchView.findViewById(androidx.appcompat.R.id.search_close_btn);
结果是这样的:
更新
要使搜索图标在 SearchView 的左侧可见,您可以使用以下方法将图标添加到 EditText:
editText.setCompoundDrawablesWithIntrinsicBounds(android.R.drawable.ic_menu_search,0,0,0);
如果您使用:
AppCompatImageView searchIcon = searchView.findViewById(androidx.appcompat.R.id.search_mag_icon); searchIcon.setImageResource(android.R.drawable.ic_menu_search);
您必须添加 searchView.setIconifiedByDefault(false);
但图标在形状外可见,请参见下图:
所以如果你想要形状内的图标使用第一种方法