如何实现具有两个固定视图的“双”折叠工具栏

bal*_*ekg 7 android android-layout android-collapsingtoolbarlayout android-nestedscrollview

我正在尝试实现如图所示的布局。
这就是我希望它工作的方式
所以我希望在用户滚动到某个点后有两个固定在屏幕顶部的视图。其他视图应该折叠起来,直到完全隐藏为止(视图 3 除外,它基本上是布局的主视图。到目前为止,我已经尝试了几种方法。其中一种比较
有效,是将折叠工具栏与可固定视图 1 和Pinnable View 2 锚定到其他视图(我附上了代码片段,这样你就知道我实现了什么)。这种方法的问题是,因为这些可固定视图不在nestedScrollView内部,所以当用户使用时不可能滚动从这两个视图开始滚动,
所以我的问题是,使用我当前的方法是否可以达到预期的效果,或者是否有其他方法可以做到这一点?

<?xml version="1.0" encoding="utf-8"?>
<androidx.coordinatorlayout.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">

    <com.google.android.material.appbar.AppBarLayout
        android:id="@+id/app_bar_layout_view"
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:background="@null">

        <com.google.android.material.appbar.CollapsingToolbarLayout
            android:layout_width="match_parent"
            android:layout_height="wrap_content"
            android:fitsSystemWindows="true"
            app:layout_scrollFlags="scroll|exitUntilCollapsed|snap">

            <View
                android:id="@+id/view_1"
                android:layout_width="match_parent"
                android:layout_marginBottom="32dp"
                android:layout_height="200dp"
                android:background="#0071BD"
                app:layout_collapseMode="parallax">
            </View>
        </com.google.android.material.appbar.CollapsingToolbarLayout>
    </com.google.android.material.appbar.AppBarLayout>

    <androidx.core.widget.NestedScrollView
        android:layout_width="match_parent"
        android:layout_height="match_parent"
        android:fillViewport="true"
        android:layout_marginTop="32dp"
        app:layout_behavior="@string/appbar_scrolling_view_behavior"
        tools:context=".ScrollingActivity">

        <LinearLayout
            android:layout_width="match_parent"
            android:layout_height="match_parent"
            android:orientation="vertical">

            <View
                android:id="@+id/view_2"
                android:layout_width="wrap_content"
                android:background="#5495BD"
                android:layout_height="300dp"/>

            <View
                android:id="@+id/pinnable_view_2_anchor_view"
                android:layout_width="match_parent"
                android:layout_height="41dp"
                android:background="@null" />

            <View
                android:id="@+id/view_3"
                android:layout_width="match_parent"
                android:background="#57B1BC"
                android:layout_height="1000dp" />
        </LinearLayout>
    </androidx.core.widget.NestedScrollView>

    <View
        android:id="@+id/pinnable_view_1"
        android:layout_width="match_parent"
        android:layout_height="64dp"
        android:background="#00015E"
        android:nestedScrollingEnabled="true"
        app:layout_anchor="@id/app_bar_layout_view"
        app:layout_anchorGravity="bottom">
    </View>

    <View
        android:id="@+id/pinnable_view_2"
        android:layout_width="match_parent"
        android:background="#000002"
        android:layout_height="40dp"
        android:layout_marginTop="64dp"
        app:layout_anchor="@id/pinnable_view_2_anchor_view"
        app:layout_anchorGravity="center">
    </View>
</androidx.coordinatorlayout.widget.CoordinatorLayout>
Run Code Online (Sandbox Code Playgroud)

Yur*_*rii 2

也许已经太晚了,无论如何,从这里检查代码https://github.com/YEP/DoubleCollapsingToolbar,也许它会帮助其他面临同样问题的开发人员。我准备了两个如何使用它的示例,您可以在您的项目中随意使用此代码。这是下面的结果。

在此输入图像描述

享受!