android TabLayout 简单使用

最新推荐文章于 2025-06-11 16:35:14 发布

anymyna

最新推荐文章于 2025-06-11 16:35:14 发布

阅读量556

点赞数

CC 4.0 BY-SA版权

分类专栏： Android

本文链接：https://blog.csdn.net/anymyna/article/details/98368615

Android 专栏收录该内容

68 篇文章

订阅专栏

本文详细介绍了如何在安卓应用中使用TabLayout与ViewPager组件，包括导入design库、布局设置、效果配置及关联ViewPager的方法。通过具体XML代码示例，帮助开发者快速掌握TabLayout的使用技巧。

摘要生成于 C知道，由 DeepSeek-R1 满血版支持，前往体验 >

demo： https://github.com/anymyna/ui
效果：
在这里插入图片描述

步骤：

1、TabLayout是安卓6.0之后出现的，导入design库。

implementation 'com.android.support:design:28.0.0'

2、布局中加入TabLayout控件

<android.support.design.widget.TabLayout
    android:id="@+id/tab"
    android:layout_width="match_parent"
    android:layout_height="48dp"
    android:background="@color/blue"
    app:tabIndicatorColor="@color/colorAccent"
    app:tabMode="fixed"
    app:tabSelectedTextColor="@color/colorPrimary"
    app:tabTextColor="@android:color/black"
    app:tabIndicatorHeight="3dp"
    >
</android.support.design.widget.TabLayout>


<android.support.v4.view.ViewPager
    android:id="@+id/viewpager_content"
    android:layout_width="match_parent"
    android:layout_height="match_parent">
</android.support.v4.view.ViewPager>

3、TabLayout效果设置

xml和代码都可以进行设置

    app:tabIndicatorColor="@color/colorAccent"
    app:tabMode="fixed"
    app:tabSelectedTextColor="@color/colorPrimary"
    app:tabTextColor="@android:color/black"
    app:tabIndicatorHeight="3dp"

app:tabMode=“scrollable” 设置tabMode属性为可以滚动
tabIndicatorColor：下划线指示器横线的颜色
tabIndicatorHeight：下划线指示器横线的高度
tabSelectedTextColor ：菜单被选中之后的颜色
tabTextColor : 菜单正常的颜色
app:tabTextAppearance : 添加样式
、

4、关联ViewPager

    tabLayout.setupWithViewPager(viewPager);