CollapsingToolbarLayout 包含 ViewPager 和其中的搜索框。如何防止搜索框只折叠，而ViewPager折叠

Question

我在片段中使用 CollapsingToolbarLayout。它包含一个 RelativeLayout，由一个 ViewPager 和一个 EditText 组成，在 ViewPager 的顶部对齐。当用户向下滚动时，工具栏会折叠。我想要的是当它折叠时我只想让 ViewPager 折叠但编辑文本保持未折叠。

这是我的 XML 文件：

<?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"
    android:id="@+id/main_content"
    android:orientation="vertical"
    android:layout_marginBottom="10dp"
    android:layout_width="match_parent"
    android:layout_height="match_parent">

    <android.support.design.widget.AppBarLayout
        android:id="@+id/appbar"
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:fitsSystemWindows="true">

            <android.support.design.widget.CollapsingToolbarLayout
                android:id="@+id/collapsing_toolbar"
                android:layout_width="match_parent"
                android:layout_height="match_parent"
                android:layout_gravity="center"
                android:theme="@style/ThemeOverlay.AppCompat.Dark.ActionBar"
                android:fitsSystemWindows="true"
                app:contentScrim="@color/colorPrimaryDark"
                app:layout_scrollFlags="scroll|exitUntilCollapsed">

                <RelativeLayout
                    android:layout_width="match_parent"
                    android:layout_height="180dp">

                    <android.support.v4.view.ViewPager
                        android:id="@+id/view_pager"
                        android:layout_width="match_parent"
                        android:layout_height="180dp"
                        android:layout_gravity="top"
                        android:scaleType="centerCrop"
                        android:background="@drawable/loading_image"
                        android:fitsSystemWindows="true"
                        app:layout_collapseMode="pin" />

                    <TextView
                        android:layout_width="match_parent"
                        android:layout_height="wrap_content"
                        android:id="@+id/user"
                        android:text=""
                        android:gravity="center"
                        android:layout_centerInParent="true"
                        android:textSize="16sp"
                        android:textColor="#ff0000"/>
               <RelativeLayout
                    android:layout_width="fill_parent"
                    android:layout_height="wrap_content"
                    android:background="@android:color/transparent"
                    android:layout_below="@+id/user"
                    android:layout_marginLeft="15dp"
                    android:layout_marginRight="15dp">

                    <EditText
                        android:layout_width="fill_parent"
                        android:layout_height="wrap_content"
                        android:hint="Search here"
                        android:padding="10dp"
                        android:id="@+id/srch"
                        android:textColor="#000"
                        android:maxLines="1"
                               android:background="@drawable/search_border_grey"/>

                    <ImageButton
                        android:id="@+id/button1"
                        android:layout_width="wrap_content"
                        android:layout_height="wrap_content"
                        android:layout_alignParentRight="true"
                        android:src="@drawable/search_24"
                        android:layout_centerVertical="true"
                        android:background="#fff"
                        android:layout_margin="5dp"
                        android:text="Button"/>
                </RelativeLayout> 



                    <LinearLayout
                        android:id="@+id/layoutDots"
                        android:layout_width="match_parent"
                        android:layout_height="30dp"
                        android:layout_alignParentBottom="true"
                        android:layout_marginBottom="10dp"
                        android:layout_marginTop="5dp"
                        android:gravity="center"
                        android:orientation="horizontal"></LinearLayout>
                </RelativeLayout>
                <android.support.v7.widget.Toolbar
                    android:id="@+id/collapsing_toolbar2"
                    android:layout_width="match_parent"
                    android:layout_height="?attr/actionBarSize"
                    app:layout_collapseMode="pin">

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



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

    <RelativeLayout
        android:orientation="vertical"
        android:layout_width="match_parent"
        android:id="@+id/root_layout"
        android:layout_height="wrap_content"
        app:layout_behavior="@string/appbar_scrolling_view_behavior">

        <GridView
            android:id="@+id/customgrid"
            android:layout_width="match_parent"
            android:layout_height="wrap_content"
            android:layout_gravity="center"
            android:layout_margin="10dp"
            android:paddingBottom="10dp"
            android:gravity="center"
            android:horizontalSpacing="10dp"
            android:numColumns="2"
            android:verticalSpacing="3dp"
            app:layout_behavior="@string/appbar_scrolling_view_behavior" />
    </RelativeLayout>
</android.support.design.widget.CoordinatorLayout>

我尝试在 AppBarLayout 下方添加一个新布局并使其在折叠 Toolbar 时可见，但它的用户体验很差，因为它会导致 ui 闪烁。我的要求uirement 有解决方案吗？感谢您的所有回复。

Answer 1

When the user scrolls down the toolbar collapses. What i want is when it collapses I want to make only the ViewPager collapse but Edit Text remain un collapsed.

您在 CollapsingToolbarLayout 中添加了 "scroll|exitUntilCollapsed"，这意味着它会 close-exit 折叠时的视图。

为了让 EditText（搜索）留在那儿，我建议在 CoordinatorLayout 中添加 EditText，因为它是 child 然后锚定它到 AppBarLayout。就像我们将 Fab 锚定在 CoordinatorLayout.

中一样

app:layout_anchor="@id/appbar"
app:layout_anchorGravity="bottom|center" // change it for your own porpuse

我建议的另一种方法（未测试）是添加：

app:layout_collapseMode="pin"

到您的 View（EditText 或容器）或者，将标志更改为：

app:layout_scrollFlags="scroll|snap"

在CollapsingToolbarLayout.

然而，可以通过处理 AppBarLayout 行为来检测它何时折叠或展开：

@Override
public void onOffsetChanged(AppBarLayout appBarLayout, int offset)
{
    if (offset == 0)
    {
        // Fully expanded
        // make your view visible or not collapsible here maybe?
    }
    else
    {
        // Not fully expanded or collapsed
    }
}

检查：

CollapsingToolbarLayout 包含 ViewPager 和其中的搜索框。如何防止搜索框只折叠，而ViewPager折叠

CollapsingToolbarLayout contains ViewPager and a search box in it. How to prevent the search box only from collapsing,while ViewPager collapses

android

android-collapsingtoolbarlayout

android-appbarlayout