如何在滚动tablayout android时滚动整个活动

Question

如何在滚动标签布局时滚动整个活动？

例如 - 当我滚动我的 tabLayout 时 - 整个活动应该滚动......而不仅仅是 tablayout 的 viewpager 部分......

Activity 应该只在 tablayout 被缩放时滚动。

这就是我想要的……（注意整个活动如何滚动……当 tablayout 滚动时）

这就是我所拥有的......（注意当 tablayout 滚动时只有 tablayout 片段部分如何滚动）

这是我尝试过的……正如我所读到的……

1. 将 ScrollView 添加到包含 tablayout 的布局活动中

2 将 NestedScrollView 添加到片段布局中。

photo_activity.xml - 包含 tablayout 和 viewpager 的 Activity

<ScrollView 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"
android:fillViewport="true">

    <RelativeLayout
    android:layout_width="match_parent"
    android:layout_height="wrap_content">

       <com.google.android.material.tabs.TabLayout
            android:layout_width="match_parent"
            android:layout_height="wrap_content"
            android:id="@+id/yearTabLayout"
            app:tabIndicatorColor="@android:color/black">

            <com.google.android.material.tabs.TabItem
                android:layout_width="wrap_content"
                android:layout_height="wrap_content"
                android:id="@+id/top"
                android:text="@string/top"/>

            <com.google.android.material.tabs.TabItem
                android:layout_width="wrap_content"
                android:layout_height="wrap_content"
                android:id="@+id/recent"
                android:text="@string/recent"/>

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

        <androidx.viewpager2.widget.ViewPager2
            android:layout_width="match_parent"
            android:layout_height="match_parent"
            android:layout_below="@+id/yearTabLayout"
            android:id="@+id/year_view_pager" />

    </RelativeLayout>

 </ScrollView>  

fragment_photos.xml - 选项卡布局中当前选定选项卡的片段。

<layout 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">

<data class="TopPhotosActivityBinding" />

   <androidx.core.widget.NestedScrollView
     android:layout_width="match_parent"
     android:layout_height="match_parent"
     android:fillViewport="true">

     <RelativeLayout
        android:layout_width="match_parent"
        android:layout_height="wrap_content">

        <ProgressBar
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:layout_centerInParent="true"
            android:id="@+id/progressBar"/>

        <androidx.swiperefreshlayout.widget.SwipeRefreshLayout
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:id="@+id/swipeRefreshTopPhotos">


            <androidx.recyclerview.widget.RecyclerView
                android:layout_width="wrap_content"
                android:layout_height="wrap_content"
                android:id="@+id/topPhotosRecyclerView"
                tools:listitem="@layout/top_photos_year">
            </androidx.recyclerview.widget.RecyclerView>

        </androidx.swiperefreshlayout.widget.SwipeRefreshLayout>

    </RelativeLayout>

   </androidx.core.widget.NestedScrollView>
</layout>

Answer 1

你可以用CollapsingToolbarLayout做这样的事情

<?xml version="1.0" encoding="utf-8"?>
<androidx.coordinatorlayout.widget.CoordinatorLayout xmlns:android="http://schemas.android.com/apk/res/android"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    app:layout_behavior="com.google.android.material.appbar.AppBarLayout$Behavior"
    xmlns:app="http://schemas.android.com/apk/res-auto">

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

       <com.google.android.material.appbar.CollapsingToolbarLayout
           android:id="@+id/collapsingToolbar"
           android:layout_width="match_parent"
           android:layout_height="match_parent"
           android:fitsSystemWindows="true"
           app:contentScrim="?attr/colorPrimary"
           app:expandedTitleMarginEnd="56dp"
           app:expandedTitleMarginStart="40dp"
           app:layout_scrollFlags="scroll|exitUntilCollapsed"
           app:title="Hello MindOrks!"
           >

           <!-- Put your top content here -->

           <LinearLayout
               android:id="@+id/toolbarImage"
               android:layout_width="match_parent"
               android:layout_height="match_parent"
               android:fitsSystemWindows="true"
               android:scaleType="centerCrop"
               android:src="@drawable/ic_android_black_24dp"
               app:layout_collapseMode="pin" >

               <TextView
                   android:layout_width="match_parent"
                   android:gravity="center"
                   android:text="Sample Top Content"
                   android:layout_gravity="center"
                   android:textSize="25dp"
                   android:textColor="@color/white"
                   android:layout_height="wrap_content"/>

           </LinearLayout>


       </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"
        app:layout_behavior="com.google.android.material.appbar.AppBarLayout$ScrollingViewBehavior">

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


            <com.google.android.material.tabs.TabLayout
                android:layout_width="match_parent"
                android:fitsSystemWindows="true"
                android:layout_height="wrap_content"
                android:id="@+id/yearTabLayout"
                app:tabIndicatorColor="@android:color/black">

                <com.google.android.material.tabs.TabItem
                    android:layout_width="wrap_content"
                    android:layout_height="wrap_content"
                    android:id="@+id/top"
                    android:text="Top"/>

                <com.google.android.material.tabs.TabItem
                    android:layout_width="wrap_content"
                    android:layout_height="wrap_content"
                    android:id="@+id/recent"
                    android:text="Recent"/>

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

            <androidx.viewpager2.widget.ViewPager2
                android:layout_width="match_parent"
                android:layout_height="match_parent"
                android:layout_below="@+id/yearTabLayout"
                android:id="@+id/year_view_pager" />

        </LinearLayout>

    </androidx.core.widget.NestedScrollView>


</androidx.coordinatorlayout.widget.CoordinatorLayout>

它看起来像这样：