TabLayout 修行之路——小红点和自定义样式攻略

小红点的意义

小红点是一个小小的圆点，通常放置在图标或标签上，用于指示需要用户注意的未读消息或事件。在TabLayout中，小红点被广泛应用于通信类应用，如消息、通知等。

实现小红点的步骤

1. 添加依赖项： 在 build.gradle 中添加 TabLayout 依赖项。
2. 设置红点位置： 通过 addDotToTab() 方法将小红点添加到指定的 Tab 上。
3. 设置红点大小和颜色： 使用 setDotSize() 和 setDotColor() 方法定制小红点的尺寸和颜色。

自定义 TabLayout 样式

除了小红点，TabLayout 还提供了丰富的自定义选项，让开发者可以根据应用的主题和需求定制其外观。

1. 设置指示器样式： 通过 setSelectedTabIndicator() 方法设置指示器的颜色、高度和形状。
2. 设置标签样式： 使用 setTabTextColors() 和 setTabTextFont() 方法定制标签的文本颜色和字体。
3. 设置背景颜色： 通过 setBackgroundColor() 方法设置 TabLayout 的背景颜色。
4. 添加圆角： 使用 setTabCornerRadii() 方法为 TabLayout 添加圆角，提升视觉美感。

示例代码

val tabLayout = findViewById<TabLayout>(R.id.tabLayout)

// 添加小红点
tabLayout.addDotToTab(0)

// 设置小红点大小和颜色
tabLayout.setDotSize(10f)
tabLayout.setDotColor(Color.RED)

// 设置指示器样式
tabLayout.setSelectedTabIndicatorColor(Color.BLUE)
tabLayout.setSelectedTabIndicatorHeight(5f)

// 设置标签样式
tabLayout.setTabTextColors(Color.BLACK, Color.WHITE)
tabLayout.setTabTextFont(Typeface.DEFAULT_BOLD)

// 设置背景颜色
tabLayout.setBackgroundColor(Color.GRAY)

// 添加圆角
tabLayout.setTabCornerRadii(10f)

总结

TabLayout 作为 Android 开发中的重要 UI 组件，其小红点功能和自定义样式为开发者提供了丰富的功能和灵活性。通过本篇文章的深入解析和示例代码，开发者可以轻松上手，打造符合自身应用需求的 TabLayout，提升用户体验。