将搜索添加到扩展工具栏

时间:2017-08-26 07:15:08

标签: android

我想要一个像这样的搜索栏......

enter image description here

我只有没有搜索的蓝色工具栏

<android.support.v7.widget.Toolbar
android:id="@+id/toolbar"
android:title="Messages"
android:titleTextColor="@color/bg_screen3"
android:background="@color/bg_screen3"
android:layout_width="match_parent"
android:layout_height="112dp"
android:gravity="center" />

如何添加放置在该位置的搜索。?

2 个答案:

答案 0 :(得分:0)

我建议你可以使用Material Searchview

<!— Must be last for right layering display —>
    <FrameLayout
        android:id="@+id/toolbar_container"
        android:layout_width="match_parent"
        android:layout_height="wrap_content">

        <android.support.v7.widget.Toolbar
            android:id="@+id/toolbar"
            android:layout_width="match_parent"
            android:layout_height="?attr/actionBarSize"
            android:background="@color/theme_primary" />

        <com.miguelcatalan.materialsearchview.MaterialSearchView
            android:id="@+id/search_view"
            android:layout_width="match_parent"
            android:layout_height="wrap_content" />
    </FrameLayout>

https://github.com/MiguelCatalan/MaterialSearchView

答案 1 :(得分:0)

您可以使用以下代码获得所需的设计:

<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout
xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:tools="http://schemas.android.com/tools"
xmlns:app="http://schemas.android.com/apk/res-auto"
android:layout_width="match_parent"
android:layout_height="match_parent">

<android.support.v7.widget.Toolbar
    android:id="@+id/my_toolbar"
    android:layout_width="wrap_content"
    android:layout_height="?attr/actionBarSize"
    android:background="?attr/colorPrimary"
    android:elevation="4dp"
    android:theme="@style/ThemeOverlay.AppCompat.ActionBar"
    app:popupTheme="@style/ThemeOverlay.AppCompat.Light">

<com.arlib.floatingsearchview.FloatingSearchView
    android:id="@+id/floating_search_view"
    android:layout_width="wrap_content"
    android:layout_height="wrap_content"
    android:gravity="center"
    app:floatingSearch_leftActionMode="showSearch"
    app:floatingSearch_searchHint="Search..."
    android:layout_alignParentTop="true"
    android:layout_alignParentEnd="true"
    android:layout_marginEnd="10dp" />

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

</RelativeLayout>

最终结果是这样的。我使用FloatingSearchView库来获取持久搜索视图。

enter image description here

您还可以声明工具栏的高度,使其从默认高度延伸。高度为128dp(Android规格中定义为56dp + 72dp),结果如下: enter image description here