ViewPager 和 FrameLayout 在一起

Question

我找不到关于那件事的明智信息，所以也许我做的完全错了？

我正在尝试使用 Navigation Drawer 和 FrameLayout 来显示 fragments。

但是，当我点击抽屉中的一个项目时，我想显示一个 TabLayout 有 3 个片段

那么我需要使用什么架构？

Activity 是否应该为抽屉布局添加 ViewPager 和 FrameLayout？

因此，例如，单击抽屉上的设置 FrameLayout 会显示一个设置片段，但是当点击事件时，FrameLayout?[=20= 中会出现一个带有 3 个显示不同事件的选项卡的片段]

或者我应该以某种方式隐藏框架布局并在 Activity 中显示 ViewPager？

主要activityxml:

<?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_layout"
android:layout_width="match_parent"
android:layout_height="match_parent">
<android.support.design.widget.CoordinatorLayout
    android:id="@+id/coordinatorLayout"
    android:layout_width="match_parent"
    android:layout_height="match_parent">
    <android.support.design.widget.AppBarLayout
        android:id="@+id/appBarLayout"
        android:layout_width="match_parent"
        android:layout_height="wrap_content">

        <include layout="@layout/toolbar"/>
        <android.support.design.widget.TabLayout
            android:id="@+id/tabLayout"
            android:layout_width="match_parent"
            android:layout_height="?attr/actionBarSize"
            app:tabMode="fixed"
            app:tabGravity="fill"
            app:tabTextAppearance="@style/TabCapsFalse"
            android:background="@color/teal"
            app:tabTextColor="@color/iron"

            app:tabSelectedTextColor="@color/tealfifty"
            app:tabIndicatorColor="@color/purple600"
            app:tabIndicatorHeight="3dp"
            />
    </android.support.design.widget.AppBarLayout>
    <android.support.v4.view.ViewPager
        android:id="@+id/pager"
        android:layout_width="match_parent"
        android:layout_height="match_parent"
        app:layout_behavior="@string/appbar_scrolling_view_behavior">

    </android.support.v4.view.ViewPager>

    <FrameLayout
        android:layout_width="match_parent"
        android:layout_height="match_parent"
        android:id="@+id/content_frame"/>
</android.support.design.widget.CoordinatorLayout>
<android.support.design.widget.NavigationView
    android:id="@+id/nvView"
    android:layout_width="wrap_content"
    android:layout_height="match_parent"
    android:layout_gravity="start"
    android:background="@color/tealfifty"
    app:itemBackground="@drawable/drawer_item"
    app:itemTextColor="@color/drawer_item"
    app:itemIconTint="@color/drawer_item"
    app:headerLayout="@layout/drawer_header"
    app:menu="@menu/navigation_view_items" />

Answer 1

您希望 Drawer 中的每个部分导航到新的 Fragment。由于 TabLayout 只会出现在其中一个屏幕上，因此它将出现在您的 Activity 调用的 Fragments 之一中。例如，从 activity_main.xml 中删除 TabLayout 和 ViewPager，然后将它们放在新的片段中。将 Fragment 添加到 content_frame，一切就绪。

<?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_layout"
    android:layout_width="match_parent"
    android:layout_height="match_parent">

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

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

            <include layout="@layout/toolbar"/>

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

        <FrameLayout
            android:layout_width="match_parent"
            android:layout_height="match_parent"
            android:id="@+id/content_frame"/>

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

    <android.support.design.widget.NavigationView
        android:id="@+id/nvView"
        android:layout_width="wrap_content"
        android:layout_height="match_parent"
        android:layout_gravity="start"
        android:background="@color/tealfifty"
        app:itemBackground="@drawable/drawer_item"
        app:itemTextColor="@color/drawer_item"
        app:itemIconTint="@color/drawer_item"
        app:headerLayout="@layout/drawer_header"
        app:menu="@menu/navigation_view_items" />

Answer 2

我最终得到了一个带有 DrawerLayout 和 FrameLayout 的 MainActivity 来显示片段。其中一个片段是我要显示的 3 个 TabLayout 片段的 HostFragment。 ViewPager 作为单个元素位于 HostFragment 布局中。 ViewPager 和 TabLayout 的设置也在 HostFragment 中完成。

这是我的 DrawerLayout:

<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"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:fitsSystemWindows="true">

<include
    layout="@layout/appbar_content"
    android:layout_width="match_parent"
    android:layout_height="match_parent" />

    <android.support.design.widget.NavigationView
        android:fitsSystemWindows="true"
        android:id="@+id/nvView"
        android:layout_width="wrap_content"
        android:layout_height="match_parent"
        android:layout_gravity="start"
        android:background="@color/tealfifty"
        app:itemBackground="@drawable/drawer_item"
        app:itemTextColor="@color/drawer_item"
        app:itemIconTint="@color/drawer_item"
        app:headerLayout="@layout/drawer_header"
        app:menu="@menu/navigation_view_items" />
</android.support.v4.widget.DrawerLayout>

appbar_content.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"
xmlns:tools="http://schemas.android.com/tools"
android:layout_width="match_parent"
android:layout_height="match_parent"
tools:context=".MainActivity">

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

    <include layout="@layout/toolbar" />

    <android.support.design.widget.TabLayout
        android:visibility="visible"
        android:id="@+id/tabLayout"
        android:layout_width="match_parent"
        android:layout_height="?attr/actionBarSize"
        android:background="@color/teal"
        app:tabGravity="fill"
        app:tabIndicatorColor="@color/purple800"
        app:tabIndicatorHeight="4dp"
        app:itemIconTint="@color/tabicons"
        app:tabMode="fixed"
        app:tabSelectedTextColor="@color/tealfifty"
        app:tabTextAppearance="@style/TabCapsFalse"
        app:tabTextColor="@color/iron" />
</android.support.design.widget.AppBarLayout>



<FrameLayout android:id="@+id/content_main_frame"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    xmlns:android="http://schemas.android.com/apk/res/android"
    app:layout_behavior="@string/appbar_scrolling_view_behavior"
    xmlns:app="http://schemas.android.com/apk/res-auto"
    tools:showIn="@layout/appbar_content"
    xmlns:tools="http://schemas.android.com/tools">
    <android.support.v4.widget.NestedScrollView
        android:id="@+id/scroll_content"
        android:layout_width="match_parent"
        android:layout_height="match_parent"/>
</FrameLayout>


<android.support.design.widget.FloatingActionButton
    android:id="@+id/fab"
    android:visibility="invisible"
    android:layout_width="wrap_content"
    android:layout_height="wrap_content"
    android:layout_margin="16dp"
    android:clickable="true"
    android:src="@drawable/addico"
    app:layout_anchor="@id/content_main_frame"
    app:layout_anchorGravity="bottom|end" />

我的主要问题之一是我只使用了 FrameLayout，或者只是 NestedScrollView。既然我把后者放在 FrameLayout 里面，我给 FrameLayout 一个 scroll_behaviour，我想 ScrollView 继承了它，一切都很好用！我花了很长时间才得出结论如何设置它！

ViewPager 和 FrameLayout 在一起

ViewPager and FrameLayout together

android

android-fragments

android-viewpager

android-framelayout