TabWidget 当前选项卡底线颜色

Posted

技术标签:

【中文标题】TabWidget 当前选项卡底线颜色【英文标题】:TabWidget current tab bottom line color 【发布时间】:2013-01-21 06:32:23 【问题描述】:

我有一个 TabWidget,我已为其启用并设置了 stripLeftstripRight...

mTabHost.getTabWidget().setStripEnabled(true);
mTabHost.getTabWidget().setRightStripDrawable(R.drawable.redline);
mTabHost.getTabWidget().setLeftStripDrawable(R.drawable.redline);

如下图所示,这不会更改当前选定选项卡(TAB 2)的底线颜色。

如何更改当前默认为蓝色的当前选定选项卡的底线颜色? (我猜蓝色是在styles.xml 的默认AppTheme 样式中设置的。)

我查看了this 的答案,但没有说明如何更改颜色...

【问题讨论】:

【参考方案1】:

选项卡指示器的颜色由可绘制的选择器设置,可在here 找到,如下所示:

<!-- AOSP copyright notice can be found at the above link -->
<selector xmlns:android="http://schemas.android.com/apk/res/android">
    <!-- Non focused states -->
    <item android:state_focused="false" android:state_selected="false" android:state_pressed="false" android:drawable="@drawable/tab_unselected_holo" />
    <item android:state_focused="false" android:state_selected="true"  android:state_pressed="false" android:drawable="@drawable/tab_selected_holo" />

    <!-- Focused states -->
    <item android:state_focused="true" android:state_selected="false" android:state_pressed="false" android:drawable="@drawable/tab_unselected_focused_holo" />
    <item android:state_focused="true" android:state_selected="true"  android:state_pressed="false" android:drawable="@drawable/tab_selected_focused_holo" />

    <!-- Pressed -->
    <!--    Non focused states -->
    <item android:state_focused="false" android:state_selected="false" android:state_pressed="true" android:drawable="@drawable/tab_unselected_pressed_holo" />
    <item android:state_focused="false" android:state_selected="true"  android:state_pressed="true" android:drawable="@drawable/tab_selected_pressed_holo" />

    <!--    Focused states -->
    <item android:state_focused="true" android:state_selected="false" android:state_pressed="true" android:drawable="@drawable/tab_unselected_pressed_holo" />
    <item android:state_focused="true" android:state_selected="true"  android:state_pressed="true" android:drawable="@drawable/tab_selected_pressed_holo" />
</selector>

选择器使用的可绘制对象都以浅蓝色着色。您可以用自己重新着色的版本替换这些可绘制对象。原件看起来像这样(原件很小,包括链接):

tab_unselected_holo tab_selected_holo tab_unselected_focused_holo tab_selected_focused_holo tab_unselected_pressed_holo tab_selected_pressed_holo

您需要将上述选择器与可绘制对象一起复制到您自己的项目中。然后,您需要将可绘制对象重新着色为您想要的任何颜色。然后,您需要将选择器设置为选项卡指示器的背景。您可以这样做(设置标签后):

TabHost host = (TabHost)view.findViewById(R.id.tab_host);
TabWidget widget = host.getTabWidget();
for(int i = 0; i < widget.getChildCount(); i++) 
    View v = widget.getChildAt(i);

    // Look for the title view to ensure this is an indicator and not a divider.
    TextView tv = (TextView)v.findViewById(android.R.id.title);
    if(tv == null) 
        continue;
    
    v.setBackgroundResource(R.drawable.your_tab_selector_drawable);

通过使用背景选择器设置您自己的客户指示器布局可能有更简单的方法,但这对我来说最简单。

【讨论】:

嘿@MCeley 谢谢你的回答。我现在也在尝试完成这项工作,并且与 tab_unselected_holo、tab_selected_holo 等有关,它们都是 png,所以要替换它们,我必须喜欢用不同的颜色制作我自己的,但我不知道默认的png,不知道好不好用。 只需下载我帖子中链接的图片并使其与这些尺寸相匹配。 回滚到原来的答案。虽然android-holo-colors.com 是一个有用的网站,可用于创建整个主题,也会更改标签颜色,但这个问题与创建主题无关。 你可以不用drawables,而是用颜色来做这个吗?我觉得如果我愿意,编辑主题会更容易,还是我错过了什么? 这太疯狂了,它只是指示器的颜色和这么多的工作【参考方案2】:

您可以为此目的使用 app:tabIndicatorColor。它将根据您的要求更改选定的选项卡指示线颜色。

<android.support.design.widget.TabLayout
                    android:id="@+id/tabs"
                    android:layout_
                    android:layout_
                    app:tabIndicatorColor="@android:color/white"
                    app:tabMode="fixed" />

【讨论】:

我认为他使用的是 TabHost 和 TabWidget,而不是 TabLayout。【参考方案3】:

这就是我更改标签的方式,

private void changetabs(TabWidget tabWidget) 
    // Change background
    for(int i=0; i < tabWidget.getChildCount(); i++)
        tabWidget.getChildAt(i).setBackgroundResource(R.drawable.tab_selector);

还有我的 tab_selector.xml

<selector xmlns:android="http://schemas.android.com/apk/res/android">
<!-- Non focused states -->
<item android:state_focused="false" android:state_selected="false" android:state_pressed="false" android:drawable="@drawable/tab_unselected_holo" />
<item android:state_focused="false" android:state_selected="true"  android:state_pressed="false" android:drawable="@drawable/tab_selected_holo" />

<!-- Focused states -->
<item android:state_focused="true" android:state_selected="false" android:state_pressed="false" android:drawable="@drawable/tab_unselected_focused_holo" />
<item android:state_focused="true" android:state_selected="true"  android:state_pressed="false" android:drawable="@drawable/tab_selected_focused_holo" />

<!-- Pressed -->
<!--    Non focused states -->
<item android:state_focused="false" android:state_selected="false" android:state_pressed="true" android:drawable="@drawable/tab_unselected_pressed_holo" />
<item android:state_focused="false" android:state_selected="true"  android:state_pressed="true" android:drawable="@drawable/tab_selected_pressed_holo" />

<!--    Focused states -->
<item android:state_focused="true" android:state_selected="false" android:state_pressed="true" android:drawable="@drawable/tab_unselected_pressed_holo" />
<item android:state_focused="true" android:state_selected="true"  android:state_pressed="true" android:drawable="@drawable/tab_selected_pressed_holo" />

希望对某人有所帮助。

【讨论】:

什么时候会调用'changetabs'??【参考方案4】:

如果有人偶然发现它,有一个在线工具可以快速构建选项卡的可绘制对象(9 个补丁)。只需选择颜色并按下按钮 就可以了...

感谢杰夫·吉尔费尔特


Android 操作栏样式生成器可让您轻松地为您的 Android 应用程序创建简单、有吸引力且无缝的自定义操作栏样式。它将生成所有必需的九个补丁资源以及相关的 XML 可绘制对象和样式,您可以将它们直接复制到您的项目中。

http://jgilfelt.github.io/android-actionbarstylegenerator/

【讨论】:

这是迄今为止最简单的方法。谢谢你杰夫! :D 太棒了!更改 tabwidget 底线颜色的真正简单方法。 尝试使用它,但它不会改变标签颜色,只会改变标签栏颜色;有什么建议吗? 是的,我累了添加它,但它只会更改选项卡指示器的颜色,而不是选项卡栏和选项卡指示器的颜色(选项卡栏颜色默认为透明)【参考方案5】:

您可以使用过滤器, 这将应用于不透明的区域

tabHost.getTabWidget().getChildAt(tabHost.getCurrentTab()).getBackground().setColorFilter(Color.RED, PorterDuff.Mode.MULTIPLY);

一行代码 - 无需更改状态。

【讨论】:

很好,但是如何更改 TextColor ? ater setIndicator("TAB_A") 你刚刚拯救了我的一天。我不明白为什么这没有被标记为正确答案。【参考方案6】:

默认使用强调色作为活动标签颜色。 您可以在style.xml 文件中设置/更改它:

<style name="AppBaseTheme" parent="Theme.AppCompat.Light">

    <item name="colorAccent">@color/myAccentColor</item>

</style>

【讨论】:

真的很简单,不需要添加任何额外的XML【参考方案7】:

我解决这个问题的方法是使用 setBackgroundResource。 首先,您必须创建完全相同的背景

line_label_1_pressed.xml

<item android:top="-6dp" android:left="-6dp" android:right="-6dp">
    <shape>
        <size android:/>
        <solid android:color="@android:color/transparent"/>
        <stroke android:color="@color/myColor" android:/>
    </shape>
</item>

line_label_1.xml

<item>
    <shape>
        <solid android:color="@android:color/transparent" />
    </shape>
</item>

然后如下创建tab_selector.xml

<selector xmlns:android="http://schemas.android.com/apk/res/android">
<item android:drawable="@drawable/line_label_1_pressed" android:state_selected="true"/>
<item android:drawable="@drawable/line_label_1"/>

然后使用 tab_selector.xml 设置背景资源

<TextView xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_
android:layout_
android:background="@drawable/tab_selector"
android:gravity="center_horizontal|center_vertical" />

【讨论】:

【参考方案8】:

我找到了其他解决方案,打开 styles.xml 并更改一行:

res -> 值 -> styles.xml

<!-- Base application theme. -->
<style name="AppTheme" parent="Theme.AppCompat.Light.DarkActionBar">
    <!-- Customize your theme here. -->
    <item name="colorPrimary">@color/colorPrimary</item>
    <item name="colorPrimaryDark">@color/colorPrimaryDark</item>
    <item name="colorAccent">@android:color/holo_orange_light</item> <!-- set the color in this line -->
    <item name="windowNoTitle">true</item>
</style>

【讨论】:

【参考方案9】:

只需使用类似的东西

tabHost.setSelectedTabIndicatorColor(Color.WHITE);

【讨论】:

以上是关于TabWidget 当前选项卡底线颜色的主要内容,如果未能解决你的问题,请参考以下文章

android之TabWidget选项卡

pyqt5 tabwidget 垂直制表符 水平文本左对齐

如何禁用 QTabWidget 中的一个选项卡?

在 QTabWidget 中查找选项卡的索引

QTabBar中的Qt4扩展选项卡

动态更改 qt5 选项卡名称