Android TabLayout 自定义指示器示例
以下是一个使用 TabLayout 实现自定义指示条的示例代码:
<com.google.android.material.tabs.TabLayout
android:id="@+id/tab_layout"
android:layout_width="match_parent"
android:layout_height="wrap_content"
app:tabIndicator="@drawable/custom_tab_indicator"
app:tabIndicatorHeight="4dp"
app:tabMode="fixed"
app:tabSelectedTextColor="@color/selected_tab_text_color"
app:tabTextColor="@color/tab_text_color" />
在布局文件中,我们可以通过设置 app:tabIndicator 属性来指定自定义的指示器。在这个属性中,我们可以使用一个 drawable 资源来定义自己的指示器。
例如,我们可以创建一个名为 custom_tab_indicator.xml 的 drawable 资源,其中包含一个带有自定义背景颜色的矩形和一个具有自定义颜色的三角形。以下是一个 custom_tab_indicator.xml 文件的示例代码:
<layer-list xmlns:android="http://schemas.android.com/apk/res/android">
<item android:width="100dp" android:height="4dp">
<shape android:shape="rectangle">
<solid android:color="@color/custom_indicator_background_color" />
<corners android:radius="2dp" />
</shape>
</item>
<item android:top="4dp" android:left="50dp" android:right="50dp">
<shape android:shape="triangle">
<solid android:color="@color/custom_indicator_triangle_color" />
</shape>
</item>
</layer-list>
在这个 drawable 资源中,我们使用了 <layer-list> 标签来定义多个层次结构。第一个层次结构是一个矩形,用于表示指示器的背景颜色。第二个层次结构是一个三角形,用于表示指示器的箭头。
然后,我们可以在 TabLayout 中使用这个 drawable 资源作为指示器。我们还可以通过 app:tabIndicatorHeight 属性来设置指示器的高度,并通过 app:tabSelectedTextColor 和 app:tabTextColor 属性来设置选中和未选中的标签文字颜色。
最后,我们可以在代码中设置 TabLayout 的标签和监听器。例如:
TabLayout tabLayout = findViewById(R.id.tab_layout);
tabLayout.addTab(tabLayout.newTab().setText('Tab 1'));
tabLayout.addTab(tabLayout.newTab().setText('Tab 2'));
tabLayout.addTab(tabLayout.newTab().setText('Tab 3'));
tabLayout.addOnTabSelectedListener(new TabLayout.OnTabSelectedListener() {
@Override
public void onTabSelected(TabLayout.Tab tab) {
// 处理标签选中事件
}
@Override
public void onTabUnselected(TabLayout.Tab tab) {
// 处理标签取消选中事件
}
@Override
public void onTabReselected(TabLayout.Tab tab) {
// 处理标签重复选中事件
}
});
原文地址: https://www.cveoy.top/t/topic/oV3U 著作权归作者所有。请勿转载和采集!