Android使ViewPager滚动父活动布局

Question

我有一个 android 应用程序，我正在尝试在其中创建以下布局 -

<android.support.v4.widget.DrawerLayout xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:app="http://schemas.android.com/apk/res-auto"
    android:id="@+id/drawer_view"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:fitsSystemWindows="true">
<android.support.design.widget.CoordinatorLayout
        android:id="@+id/cl_root_view"
        android:layout_width="match_parent"
        android:layout_height="match_parent"
        android:clipChildren="false">

        <LinearLayout
            android:id="@+id/activity_main"
            android:layout_width="match_parent"
            android:layout_height="match_parent"
            android:orientation="vertical">

            <android.support.design.widget.AppBarLayout
                android:layout_width="match_parent"
                android:background="@color/tab_primary_background"
                android:layout_height="wrap_content"
                app:elevation="5dp">

                <android.support.v7.widget.Toolbar
                    android:id="@+id/toolbar"
                    style="@style/Toolbar"
                    app:subtitleTextColor="@color/white"
                    app:title="@string/app_name"
                    app:titleTextAppearance="@style/Toolbar.TitleText"
                    app:titleTextColor="@color/white" />

            </android.support.design.widget.AppBarLayout>
            <ScrollView
                android:layout_width="match_parent"
                android:layout_weight="1"
                android:fillViewport="true"
                android:layout_height="0dp">
                <LinearLayout
                    android:layout_width="match_parent"
                    android:orientation="vertical"
                    android:layout_height="wrap_content">
                    <LinearLayout
                        android:layout_width="match_parent"
                        android:orientation="vertical"
                        android:paddingStart="15dp"
                        android:paddingEnd="15dp"
                        android:paddingLeft="15dp"
                        android:paddingRight="15dp"
                        android:layout_marginTop="15dp"
                        android:layout_height="wrap_content">
                        <ImageView
                            android:layout_width="60dp"
                            android:src="@drawable/teacher_onboarding_step2"
                            android:layout_height="60dp"
                            android:layout_gravity="center"
                            android:textAlignment="center"
                            android:contentDescription="@string/take_test" />
                        <TextView
                            android:layout_width="match_parent"
                            android:id="@+id/tat_title_placeholder"
                            style="@style/TextAppearance.Text.Light"
                            android:textSize="14sp"
                            android:textAlignment="center"
                            android:padding="15dp"
                            android:text="@string/tat_title_placeholder"
                            android:layout_height="wrap_content" />
                        <com.mindorks.placeholderview.PlaceHolderView
                            android:layout_width="match_parent"
                            android:id="@+id/fixed_test_placeholder"
                            android:layout_height="wrap_content" />

                    </LinearLayout>
                    <android.support.design.widget.TabLayout
                        android:layout_width="match_parent"
                        android:id="@+id/tat_tab_layout"
                        app:tabIndicatorColor="@color/white"
                        app:tabSelectedTextColor="@color/white"
                        app:tabBackground="@color/tab_primary_background"
                        android:layout_height="wrap_content" />

                    <android.support.v4.view.ViewPager
                        android:id="@+id/tat_viewpager"
                        android:layout_width="match_parent"
                        android:layout_weight="1"
                        android:layout_height="0dp" />
                </LinearLayout>
            </ScrollView>
        </LinearLayout>
    </android.support.design.widget.CoordinatorLayout>
<android.support.design.widget.NavigationView
        android:id="@+id/navigation_view"
        style="@style/Widget.Design.NavigationView"
        android:layout_width="wrap_content"
        android:layout_height="match_parent"
        android:layout_gravity="start"
        android:background="@color/white"
        app:headerLayout="@layout/drawer_header"
        app:itemBackground="@color/white"
        app:itemIconTint="@color/black_effective"
        app:itemTextColor="@color/black_effective"
        app:menu="@menu/drawer">

        <TextView
            android:id="@+id/tv_app_version"
            style="@style/TextStyle.Title.Sub"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:layout_gravity="bottom|end"
            android:padding="5dp" />
    </android.support.design.widget.NavigationView>
</android.support.v4.widget.DrawerLayout>

所以，在这个布局中，如您所见，我想在一些视图下方添加一个 TabLayout 和一个 ViewPager。现在我面临的问题是我的 ViewPager 被限制在屏幕底部的可用空间中，所以只有 viewpager 是可滚动的，而不是完整的活动布局。这在底部留下了非常小的空间来查看 viewpager 内容。

所以，我想让 appbar 下面的整个布局可以从顶部滚动，这样 viewpager 中的片段就可以轻松方便地看到。

------------更新--------- 我尝试按照建议使用嵌套滚动视图、setFillViewPort 和折叠布局，但仍然得到相同的结果。 使用 Collapsing ToolbarLayout 更新布局 xml -

<?xml version="1.0" encoding="utf-8"?>
<android.support.v4.widget.DrawerLayout xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:app="http://schemas.android.com/apk/res-auto"
    android:id="@+id/drawer_view"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:fitsSystemWindows="true">

    <android.support.design.widget.CoordinatorLayout
        android:id="@+id/cl_root_view"
        android:layout_width="match_parent"
        android:layout_height="match_parent">
        <com.urtutors.students.mvp.utils.MyNestedScrollView
            android:layout_width="match_parent"
            app:layout_behavior="@string/appbar_scrolling_view_behavior"
            android:layout_height="match_parent">
            <LinearLayout
                android:layout_width="match_parent"
                android:orientation="vertical"
                android:layout_height="wrap_content">
                <com.urtutors.students.mvp.utils.WrapContentHeightViewPager
                    android:id="@+id/tat_viewpager"
                    android:layout_width="match_parent"
                    android:layout_height="wrap_content" />
            </LinearLayout>
        </com.urtutors.students.mvp.utils.MyNestedScrollView>
        <android.support.design.widget.AppBarLayout
            android:layout_width="match_parent"
            android:background="@color/tab_primary_background"
            android:layout_height="wrap_content"
            app:elevation="5dp">

            <android.support.design.widget.CollapsingToolbarLayout
                android:layout_width="match_parent"
                android:fitsSystemWindows="true"
                app:layout_scrollFlags="scroll|exitUntilCollapsed"
                android:layout_height="match_parent">

                <LinearLayout
                    android:layout_width="match_parent"
                    android:orientation="vertical"
                    android:paddingStart="15dp"
                    app:layout_collapseMode="parallax"
                    android:paddingEnd="15dp"
                    android:paddingLeft="15dp"
                    android:paddingRight="15dp"
                    android:layout_marginTop="15dp"
                    android:layout_height="wrap_content">
                    <ImageView
                        android:layout_width="60dp"
                        android:src="@drawable/teacher_onboarding_step2"
                        android:layout_height="60dp"
                        android:layout_gravity="center"
                        android:textAlignment="center"
                        android:contentDescription="@string/take_test" />
                    <TextView
                        android:layout_width="match_parent"
                        android:id="@+id/tat_title_placeholder"
                        style="@style/TextAppearance.Text.Light"
                        android:textSize="14sp"
                        android:textAlignment="center"
                        android:padding="15dp"
                        android:text="@string/tat_title_placeholder"
                        android:layout_height="wrap_content" />
                    <com.mindorks.placeholderview.PlaceHolderView
                        android:layout_width="match_parent"
                        android:id="@+id/fixed_test_placeholder"
                        android:layout_height="wrap_content" />

                </LinearLayout>

                <android.support.v7.widget.Toolbar
                    android:id="@+id/toolbar"
                    style="@style/Toolbar"
                    app:layout_collapseMode="pin"
                    app:subtitleTextColor="@color/white"
                    app:title="@string/app_name"
                    app:titleTextAppearance="@style/Toolbar.TitleText"
                    app:titleTextColor="@color/white" />
            </android.support.design.widget.CollapsingToolbarLayout>
            <android.support.design.widget.TabLayout
                android:layout_width="match_parent"
                android:id="@+id/tat_tab_layout"
                app:tabIndicatorColor="@color/white"
                app:tabSelectedTextColor="@color/white"
                app:tabBackground="@color/tab_primary_background"
                android:layout_height="wrap_content" />
        </android.support.design.widget.AppBarLayout>
    </android.support.design.widget.CoordinatorLayout>

    <android.support.design.widget.NavigationView
        android:id="@+id/navigation_view"
        style="@style/Widget.Design.NavigationView"
        android:layout_width="wrap_content"
        android:layout_height="match_parent"
        android:layout_gravity="start"
        android:background="@color/white"
        app:headerLayout="@layout/drawer_header"
        app:itemBackground="@color/white"
        app:itemIconTint="@color/black_effective"
        app:itemTextColor="@color/black_effective"
        app:menu="@menu/drawer">

        <TextView
            android:id="@+id/tv_app_version"
            style="@style/TextStyle.Title.Sub"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:layout_gravity="bottom|end"
            android:padding="5dp" />
    </android.support.design.widget.NavigationView>
</android.support.v4.widget.DrawerLayout>

我复制的嵌套滚动视图 - https://github.com/TheLittleNaruto/SupportDesignExample/tree/master/app/src/main/java/com/thelittlenaruto/supportdesignexample/customview

现在，viewpager 正在滚动，但我的操作栏标题不再可见。

有人可以建议对此布局进行任何更改以解决此问题吗？

Answer 1

我已经尝试改进你的代码，如果我没记错你希望它可以滚动，你可以试试下面的代码。

    <?xml version="1.0" encoding="utf-8"?>
<android.support.v4.widget.DrawerLayout xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:app="http://schemas.android.com/apk/res-auto"
    android:id="@+id/drawer_view"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:fitsSystemWindows="true">

    <android.support.design.widget.CoordinatorLayout
        android:id="@+id/cl_root_view"
        android:layout_width="match_parent"
        android:layout_height="match_parent"
        android:clipChildren="false">

        <LinearLayout
            android:id="@+id/activity_main"
            android:layout_width="match_parent"
            android:layout_height="match_parent"
            android:orientation="vertical">

            <android.support.design.widget.AppBarLayout
                android:layout_width="match_parent"
                android:layout_height="wrap_content"
                android:background="@color/colorPrimary"
                app:elevation="5dp">

                <android.support.v7.widget.Toolbar
                    android:id="@+id/toolbar"
                    android:layout_width="match_parent"
                    android:layout_height="?actionBarSize"
                    app:subtitleTextColor="@android:color/white"
                    app:title="@string/app_name"
                    app:titleTextColor="@android:color/white" />

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

            <ScrollView
                android:layout_width="match_parent"
                android:layout_height="match_parent">

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

                    <LinearLayout
                        android:layout_width="match_parent"
                        android:layout_height="wrap_content"
                        android:layout_marginTop="15dp"
                        android:orientation="vertical"
                        android:paddingEnd="15dp"
                        android:paddingLeft="15dp"
                        android:paddingRight="15dp"
                        android:paddingStart="15dp">

                        <ImageView
                            android:layout_width="60dp"
                            android:layout_height="60dp"
                            android:layout_gravity="center"
                            android:contentDescription="@string/take_test"
                            android:src="@mipmap/ic_launcher"
                            android:textAlignment="center" />

                        <TextView
                            android:id="@+id/tat_title_placeholder"
                            style="@android:style/TextAppearance.Medium"
                            android:layout_width="match_parent"
                            android:layout_height="wrap_content"
                            android:padding="15dp"
                            android:text="@string/tat_title_placeholder"
                            android:textAlignment="center"
                            android:textSize="14sp" />

                        <View
                            android:id="@+id/fixed_test_placeholder"
                            android:layout_width="match_parent"
                            android:background="@color/colorAccent"
                            android:layout_height="400dp" />

                    </LinearLayout>
                    <LinearLayout
                        android:layout_width="match_parent"
                        android:layout_height="500dp"
                        android:orientation="vertical">
                        <android.support.design.widget.TabLayout
                            android:id="@+id/tat_tab_layout"
                            android:layout_width="match_parent"
                            android:layout_height="wrap_content"
                            app:tabMode="scrollable"
                            app:tabPadding="@dimen/s_padding"
                            app:tabBackground="@color/colorPrimaryDark"
                            app:tabIndicatorColor="@android:color/white"
                            app:tabSelectedTextColor="@android:color/white" />

                        <android.support.v4.view.ViewPager
                            android:id="@+id/tat_viewpager"
                            android:layout_width="match_parent"
                            android:background="@color/colorPrimaryDark"
                            android:layout_height="wrap_content" />


                    </LinearLayout>

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

    <android.support.design.widget.NavigationView
        android:id="@+id/navigation_view"
        style="@style/Widget.Design.NavigationView"
        android:layout_width="wrap_content"
        android:layout_height="match_parent"
        android:layout_gravity="start"
        android:background="@android:color/white"
        app:headerLayout="@layout/nav_header_nav"
        app:itemBackground="@android:color/white"
        app:itemIconTint="@android:color/black"
        app:itemTextColor="@android:color/black"
        app:menu="@menu/activity_nav_drawer">

        <TextView
            android:id="@+id/tv_app_version"
            style="@style/TextAppearance.AppCompat"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:layout_gravity="bottom|end"
            android:padding="5dp" />
    </android.support.design.widget.NavigationView>
</android.support.v4.widget.DrawerLayout>

我做了一些小改动。

1. 在使用 scrollView 时尽量不要使用权重。因为它们不起作用 相处融洽。
2. 我已将选项卡布局包装在线性布局中 并赋予它静态高度（可以轻松更换）。

希望对你有帮助。