一个协调器布局上的多个应用栏布局

Question

我想要一个像 Telegram 一样的聊天个人资料屏幕。但有些部分我看不懂。对于那些可能不知道的人来说，它有一个可折叠工具栏，后面有一个滚动内容区域，然后是一个 TabLayot，当到达屏幕顶部时它将被固定所以这就是我目前拥有的：

 <com.google.android.material.appbar.AppBarLayout
    >
    <com.google.android.material.appbar.CollapsingToolbarLayout
        app:layout_scrollFlags="scroll|exitUntilCollapsed"
        >
           <ImageView
            android:id="@+id/main.backdrop"
            app:layout_collapseMode="parallax"
            />

        <androidx.appcompat.widget.Toolbar
            app:layout_collapseMode="pin"
            />
    </com.google.android.material.appbar.CollapsingToolbarLayout>

    <com.google.android.material.tabs.TabLayout/>

</com.google.android.material.appbar.AppBarLayout>

<androidx.viewpager2.widget.ViewPager2
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    app:layout_behavior="@string/appbar_scrolling_view_behavior" />

</androidx.coordinatorlayout.widget.CoordinatorLayout>

现在效果很好，唯一的问题是，我不知道将滚动内容放在哪里（基本上应该位于工具栏和选项卡布局之间）。滚动的顺序是这样的：

1. 可折叠工具栏首先滚动直至折叠
2. 其他内容（工具栏下方和选项卡布局上方）将滚动出
3. tabout 到达屏幕顶部并停留在那里
4. viewpager 内容向上滚动

谢谢！

Answer 1

要通过可折叠工具栏、滚动内容和固定在顶部的 TabLayout 实现所需的布局，您可以按如下方式构建布局：

<androidx.coordinatorlayout.widget.CoordinatorLayout
    android:layout_width="match_parent"
    android:layout_height="match_parent">

    <com.google.android.material.appbar.AppBarLayout
        android:layout_width="match_parent"
        android:layout_height="wrap_content">

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

            <!-- Your ImageView for the CollapsingToolbarLayout -->
            <ImageView
                android:id="@+id/main_backdrop"
                android:layout_width="match_parent"
                android:layout_height="wrap_content"
                app:layout_collapseMode="parallax" />

            <!-- Your Toolbar -->
            <androidx.appcompat.widget.Toolbar
                android:id="@+id/toolbar"
                android:layout_width="match_parent"
                android:layout_height="?attr/actionBarSize"
                app:layout_collapseMode="pin" />

        </com.google.android.material.appbar.CollapsingToolbarLayout>
    </com.google.android.material.appbar.AppBarLayout>

    <!-- Your scrolling content -->
    <androidx.core.widget.NestedScrollView
        android:layout_width="match_parent"
        android:layout_height="match_parent"
        app:layout_behavior="@string/appbar_scrolling_view_behavior">

        <!-- Your content goes here -->

    </androidx.core.widget.NestedScrollView>

    <!-- Your TabLayout -->
    <com.google.android.material.tabs.TabLayout
        android:id="@+id/tab_layout"
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:layout_gravity="top"
        app:tabGravity="fill"
        app:tabMode="fixed" />

    <!-- Your ViewPager -->
    <androidx.viewpager2.widget.ViewPager2
        android:id="@+id/view_pager"
        android:layout_width="match_parent"
        android:layout_height="match_parent"
        app:layout_behavior="@string/appbar_scrolling_view_behavior" />

</androidx.coordinatorlayout.widget.CoordinatorLayout>

这种结构允许可折叠工具栏首先滚动，然后是滚动内容，最后是 TabLayout 和 ViewPager。根据您的具体要求相应调整属性和内容。