Android中的tabview是否使用Fragments?

时间:2016-03-05 18:21:16

标签: android android-fragments

我在Android上有一个普遍的问题。例如,如果我在Android中使用标签 - >是用Fragments处理的。同样,如果我使用导航抽屉也是一个很好的例子吗?我想我完全没有在那里得到碎片的概念。

例如,我要构建以下屏幕:

enter image description here

xml模板包含所有内容。根据我的猜测,它将有一个标签视图,然后是列表视图和制造按钮。那么在这种情况下我会使用一个片段吗?

1 个答案:

答案 0 :(得分:1)

要构建此类布局,您必须使用CoordinatorLayout作为父布局,并且AppBarLayout应使用CollapsingToolbarLayout

然后使用TabLayout,您必须在屏幕底部使用ViewPager显示这些标签

或者您可以使用简单的FrameLayout,您可以在每个标签上添加片段。

<?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"
        android:id="@+id/main_content"
        android:layout_width="match_parent"
        android:layout_height="match_parent"
        android:fitsSystemWindows="true">

        <android.support.design.widget.AppBarLayout
            android:id="@+id/appbar"
            android:layout_width="match_parent"
            android:layout_height="260dp"
            android:fitsSystemWindows="true"
            android:theme="@style/ThemeOverlay.AppCompat.Dark.ActionBar">

            <android.support.design.widget.CollapsingToolbarLayout
                android:id="@+id/collapsing_toolbar"
                android:layout_width="match_parent"
                android:layout_height="match_parent"
                android:fitsSystemWindows="true"
                app:contentScrim="?attr/colorAccent"
                app:expandedTitleMarginEnd="64dp"
                app:expandedTitleMarginStart="48dp"
                app:layout_scrollFlags="scroll|exitUntilCollapsed">

                <!-- Your Header layout goes Here -->

                <LinearLayout
                    android:layout_width="match_parent"
                    android:layout_height="match_parent"
                    android:background="?attr/colorAccent"
                    android:gravity="center"
                    android:minHeight="160dp"
                    android:orientation="vertical"
                    app:layout_collapseMode="parallax">

                    <!-- Content inside your header layout just like image ot other info -->

                </LinearLayout>

                <android.support.v7.widget.Toolbar xmlns:android="http://schemas.android.com/apk/res/android"
                    xmlns:local="http://schemas.android.com/apk/res-auto"
                    android:id="@+id/toolbar"
                    android:layout_width="match_parent"
                    android:layout_height="?attr/actionBarSize"
                    android:minHeight="?attr/actionBarSize"
                    local:popupTheme="@style/ThemeOverlay.AppCompat.Light"
                    local:theme="@style/ThemeOverlay.AppCompat.Dark.ActionBar"
                    app:layout_collapseMode="pin"/>

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

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

        <!-- Your Tablayout goes here-->
        <android.support.design.widget.TabLayout
            android:id="@+id/tabs"
            android:layout_width="match_parent"
            android:layout_height="wrap_content"
            android:background="?attr/colorAccent"
            app:tabGravity="fill"
            app:tabIndicatorColor="#5be5ad"
            app:tabIndicatorHeight="4dp"
            app:tabMode="fixed" />
        <!-- Your Viewpager goes here-->
        <android.support.v4.view.ViewPager
        android:id="@+id/viewpager"
        android:layout_width="match_parent"
        android:layout_height="match_parent"
        app:layout_behavior="@string/appbar_scrolling_view_behavior" />

     <!-- your FAB goes here-->
      <android.support.design.widget.FloatingActionButton
          android:id="@+id/fab"
          android:layout_width="wrap_content"
          android:layout_height="wrap_content"
          android:layout_gravity="bottom|end"
          app:elevation="6dp"
          app:backgroundTint="@color/colorAccent"
          app:pressedTranslationZ="12dp"
          android:layout_margin="@dimen/fab_margin"
          android:src="@drawable/ic_add" />

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

希望它会对你有所帮助。