ViewPager和FrameLayout在一起

时间:2016-02-18 15:31:07

标签: android android-fragments android-viewpager android-framelayout

我无法找到有关此事的明智信息,所以也许我完全错了?

我正在尝试使用Navigation DrawerFrameLayout来显示fragments

但是,当点击抽屉上的其中一个项目时,我想显示一个包含3个片段的TabLayout

那么我需要使用哪种架构?

如果活动对drawerlayout的影响是否会导致ViewPagerFrameLayout

因此,点击抽屉上的“设置”,例如FrameLayout会显示设置片段,但在点击“事件”时,FrameLayout内会显示一个包含3个标签的片段,显示不同的事件?

或者我应该以某种方式隐藏framelayout并在Activity中显示ViewPager

主要活动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_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" />

2 个答案:

答案 0 :(得分:0)

您希望Drawer中的每个部分都导航到新的Fragment。由于TabLayout只会出现在其中一个屏幕上,因此它会进入Fragments调用的Activity之一。例如,从activity_main.xml中删除TabLayoutViewPager,然后将它们放入新的片段中。将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" />

答案 1 :(得分:0)

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

这是我的DrawerLayout

for (i=0; i< 15; i++) {

<强> appbar_content.xml

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

我的一个主要问题是我只使用<?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继承了它,一切都像魅力一样!我花了很长时间才得出如何设置它的结论!