TabLayout配合ViewPager

最新推荐文章于 2021-02-22 03:48:22 发布

星空同学

最新推荐文章于 2021-02-22 03:48:22 发布

阅读量405

点赞数

分类专栏： MDesign 文章标签： Tablayout

本文链接：https://blog.csdn.net/u013597998/article/details/54970124

版权

MDesign 专栏收录该内容

2 篇文章 0 订阅

订阅专栏

之前都习惯用RadioGroup配合ViewPager做页面切换，官方是我TabLayout倒是用的很少，记录下使用。

布局：

<LinearLayout
    xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:app="http://schemas.android.com/apk/res-auto"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:orientation="vertical">

    <android.support.v7.widget.Toolbar
        android:id="@+id/toolbar"
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:background="?attr/colorPrimary"
        app:navigationIcon="@mipmap/back_ib"
        app:subtitleTextColor="@color/white"
        app:title="Palette"
        app:titleTextColor="@color/white"
        >
    </android.support.v7.widget.Toolbar>

    <android.support.design.widget.TabLayout
        android:id="@+id/toolbar_tab"
        android:layout_width="match_parent"
        android:layout_height="?attr/actionBarSize"
        android:background="@color/colorPrimaryDark"
        android:fillViewport="false"
        app:layout_scrollFlags="scroll"
        app:tabIndicatorColor="#0835f8"
        app:tabIndicatorHeight="2.0dp"
        app:tabSelectedTextColor="@color/white"
        app:tabTextColor="#090e21">

        <android.support.design.widget.TabItem
            android:layout_width="match_parent"
            android:layout_height="match_parent"
            android:text="主页"/>

        <android.support.design.widget.TabItem
            android:layout_width="match_parent"
            android:layout_height="match_parent"
            android:text="分享"/>

        <android.support.design.widget.TabItem
            android:layout_width="match_parent"
            android:layout_height="match_parent"
            android:text="收藏"/>

        <android.support.design.widget.TabItem
            android:layout_width="match_parent"
            android:layout_height="match_parent"
            android:text="关注"/>

        <android.support.design.widget.TabItem
            android:layout_width="match_parent"
            android:layout_height="match_parent"
            android:text="微博"/>


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

    <android.support.v4.view.ViewPager
        android:id="@+id/main_vp_container"
        android:layout_width="match_parent"
        android:layout_height="match_parent"
        app:layout_behavior="@string/appbar_scrolling_view_behavior"/>

</LinearLayout>

app:tabIndicatorColor=”#0835f8” //该属性下方滚动条颜色
app:tabIndicatorHeight=”2.0dp” //滚动条高度

viewpager中我们使用已经定义的behavior来关联Tablayout
app:layout_behavior=”@string/appbar_scrolling_view_behavior”

<string name="appbar_scrolling_view_behavior" translatable="false">android.support.design.widget.AppBarLayout$ScrollingViewBehavior</string>

代码中：

 toolbar_tab = (TabLayout) findViewById(R.id.toolbar_tab);
        main_vp_container = (ViewPager) findViewById(R.id.main_vp_container);

        PaletteViewPagerAdapter vpAdapter = new PaletteViewPagerAdapter(getSupportFragmentManager(), this);
        main_vp_container.setAdapter(vpAdapter);
        toolbar_tab.setupWithViewPager(main_vp_container);//关联

效果图：
这里写图片描述