Question

我正在创建一个应用程序，其中搜索框位于Toolbar下方，工具栏可滚动。当Toolbar未向上滚动EditText时，边距区域将是原色，当向上滚动时，边距区域将是透明的。

我正在使用此代码..

<android.support.design.widget.AppBarLayout
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:id="@+id/myAppBar"
        app:elevation="0dp"
        android:theme="@style/AppTheme.AppBarOverlay">
        <android.support.v7.widget.Toolbar
            android:id="@+id/toolbar"
            android:layout_width="match_parent"
            android:layout_height="?attr/actionBarSize"
            android:background="?attr/colorPrimary"
            app:layout_scrollFlags="scroll|enterAlways"
            app:contentInsetStart="0dp"
            app:popupTheme="@style/AppTheme.PopupOverlay">
            <LinearLayout
                android:layout_width="wrap_content"
                android:layout_height="match_parent"
                android:orientation="vertical"
                android:gravity="center_vertical">
                <TextView
                    android:id="@+id/text"
                    android:layout_width="wrap_content"
                    android:layout_height="wrap_content"
                    android:textColor="#FFFFFF"
                    android:layout_marginTop="2dp"
                    android:textSize="10sp"
                    android:gravity="bottom"
                    android:text="Current location"/>
                <TextView
                    android:id="@+id/current_location"
                    android:layout_width="wrap_content"
                    android:layout_height="wrap_content"
                    android:textColor="#FFFFFF"
                    android:textSize="13sp"
                    android:gravity="top"
                    android:text="Fetching \nCurrent Location"/>
            </LinearLayout>
        </android.support.v7.widget.Toolbar>
        <EditText
            android:layout_width="match_parent"
            android:layout_height="wrap_content"
            android:padding="10dp"
            android:background="@color/white"
            android:hint="Search Places"
            android:textColorHint="@color/textColorSecondary"
            android:drawablePadding="10dp"
            android:drawableLeft="@drawable/search_black_24dp"
            android:drawableStart="@drawable/search_black_24dp"
            android:layout_margin="8dp"/>
</android.support.design.widget.AppBarLayout>

预期结果

实际结果

Answer 1

请使用CollapsingToolbarLayout，如下例所示：

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

    <android.support.design.widget.AppBarLayout
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:id="@+id/appbar"
        android:theme="@style/AppTheme.AppBarOverlay">

        <android.support.design.widget.CollapsingToolbarLayout
            android:id="@+id/collapsing_toolbar"
            android:layout_width="match_parent"
            android:layout_height="wrap_content"
            app:titleEnabled="false"
            app:layout_scrollFlags="scroll">


            <android.support.v7.widget.Toolbar
                android:id="@+id/toolbar"
                android:layout_width="match_parent"
                android:layout_height="?attr/actionBarSize"
                app:contentInsetLeft="0dp"
                app:contentInsetStart="0dp"
                app:contentInsetStartWithNavigation="0dp"
                app:popupTheme="@style/AppTheme.PopupOverlay" />
        </android.support.design.widget.CollapsingToolbarLayout>

    </android.support.design.widget.AppBarLayout>

    <include layout="@layout/content_main" />


</android.support.design.widget.CoordinatorLayout>

如何通过搜索实现这种类型的toobar

1 个答案: