Question

我正在制作一个网络浏览器，并且要使该URL的搜索视图与新的Google Chrome浏览器（该应用仅供个人使用）相同：

我知道可以使用SearchView元素来实现此目的。但是我不知道该怎么做。

我这样使用EditText：

    <android.support.v7.widget.Toolbar
        android:id="@+id/toolbar"
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:background="@color/colorPrimary"
        android:theme="@style/ThemeOverlay.MyApp.ActionBar">

        <EditText
            android:layout_width="match_parent"
            android:layout_height="35dp"
            android:paddingStart="15dp"
            android:paddingEnd="5dp"
            android:layout_marginEnd="15dp"
            android:background="@drawable/round_et"
            android:textColor="#ffffff"
            android:textColorHint="#ffffff"
            android:fontFamily="@font/google_sans"
            android:cursorVisible="false"
            android:hint="@string/search"
            android:includeFontPadding="true"
            android:inputType="textWebEditText"
            android:singleLine="true"/>

    </android.support.v7.widget.Toolbar>

round_et.xml文件：

    <?xml version="1.0" encoding="utf-8"?>
    <shape 
        xmlns:android="http://schemas.android.com/apk/res/android"
        android:shape="rectangle" 
        android:padding="10dp">
        <solid android:color="#003458"/>
        <corners
            android:bottomRightRadius="1000dp"
            android:bottomLeftRadius="1000dp"
            android:topLeftRadius="1000dp"
            android:topRightRadius="1000dp"/>
     </shape>

但是我无法实现我想要的。这就是我得到的（键入时我想添加十字按钮）：

当我输入内容时：

我想创建一个搜索视图，例如Google Chrome。

Answer 1

您的xml文件应如下所示：

<RelativeLayout
    android:layout_width="fill_parent"
    android:layout_height="wrap_content"
    android:orientation="horizontal">

    <android.support.v7.widget.SearchView
        android:id="@+id/search"
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:clickable="true" />
  //this listview is optional according to your requirement. if you want to show a 
//list of predefined data when user taps on searchview then keep this, otherwise not.
    <ListView
        android:id="@+id/list_view"
        android:layout_width="fill_parent"
        android:layout_height="wrap_content"
        android:layout_alignParentLeft="true"
        android:layout_alignParentStart="true"
        android:layout_below="@+id/search" />

</RelativeLayout>

对于Java文件，您可以使用以下代码：

public class MainActivity extends AppCompatActivity {

ActivityMainBinding activityMainBinding;
ListAdapter adapter;

List<String> arrayList= new ArrayList<>();

@Override
protected void onCreate(Bundle savedInstanceState) {
    super.onCreate(savedInstanceState);
    activityMainBinding = DataBindingUtil.setContentView(this, R.layout.activity_main);

    arrayList.add("data1");
    arrayList.add("data2");

    adapter= new ListAdapter(arrayList);
    activityMainBinding.listView.setAdapter(adapter);

    activityMainBinding.search.setActivated(true);
    activityMainBinding.search.setQueryHint("Type your keyword here");
    activityMainBinding.search.onActionViewExpanded();
    activityMainBinding.search.setIconified(false);
    activityMainBinding.search.clearFocus();

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

        @Override
        public boolean onQueryTextChange(String newText) {

            adapter.getFilter().filter(newText);

            return false;
        }
    });
}
}

注意：该代码并非您想要的，但我认为您可以阅读此代码并根据您的要求实施！希望这会有所帮助。

Answer 2

在editText的右端放置一个十字按钮，并使其可见性消失。此后，使用文本更改后的editText侦听器，然后在onTextChanged方法中检查editText文本是否为空（如果为空），然后隐藏十字按钮显示十字按钮。

Chrome如何制作搜索视图

2 个答案: