it-swarm.com.ru

Цвет нижней строки текущей вкладки TabWidget

У меня есть TabWidget, для которого я включил и установил stripLeft и stripRight...

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

Как вы можете видеть на изображении ниже, это не меняет цвет нижней строки текущей выбранной вкладки (TAB 2).

enter image description here

Как я могу изменить цвет нижней строки текущей выбранной вкладки, которая по умолчанию имеет синий цвет в данный момент? (Я предполагаю, что синий цвет устанавливается в стиле AppTheme по умолчанию в styles.xml.)

Я посмотрел на это ответ, но там не сказано, как изменить цвет ...

62
neo108

Цвет индикатора вкладки устанавливается с помощью селектора, который можно найти здесь и выглядит так:

<!-- 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>

Все элементы рисования, которые использует селектор, окрашены в светло-голубой цвет. Вы можете заменить эти рисунки на свои собственные перекрашенные версии. Оригиналы выглядят так (оригиналы маленькие, ссылки включены):

Вы захотите скопировать вышеупомянутый селектор в свой собственный проект вместе с рисованными объектами. Затем вы захотите перекрасить рисунки в любой цвет, какой хотите. Затем вы захотите установить селектор в качестве фона для индикаторов вкладок. Вы можете сделать это следующим образом (после настройки вкладок):

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);
}

Возможно, существует более простой способ сделать это, настроив собственный макет индикатора клиента с помощью селектора фона, но это то, что мне сработало проще всего.

75
Michael Celey

Вы можете использовать app: tabIndicatorColor для этой цели. Он изменит цвет линии индикатора выбранной вкладки в соответствии с вашими требованиями.

<Android.support.design.widget.TabLayout
                    Android:id="@+id/tabs"
                    Android:layout_width="match_parent"
                    Android:layout_height="wrap_content"
                    app:tabIndicatorColor="@Android:color/white"
                    app:tabMode="fixed" />
12
Nidhi

Вот как я изменил свои вкладки,

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" />

Надеюсь, это поможет кому-нибудь.

12
Basim Sherif

Если кто-то спотыкается об этом, есть онлайн-инструмент для быстрого создания отрисовок (9 патчей) для вкладок. Просто выберите цвет и нажмите на кнопку.

Благодаря Джеффу Гилфелту


Генератор стилей панели действий Android позволяет легко создавать простой, привлекательный и удобный стиль панели действий для приложения Android. Он сгенерирует все девять необходимых исправлений, а также соответствующие XML-элементы и стили, которые вы можете скопировать прямо в ваш проект.

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

10
Ash

Вы можете использовать фильтр,
Это будет применяться к региону, который не является прозрачным

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

Одна строка кода - не нужно менять состояния.

5
Alexey O.

Цвет акцента используется по умолчанию в качестве активного цвета вкладки. Вы можете установить/изменить его в файле style.xml:

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

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

</style>
4
dzikovskyy

Мой способ решить эту проблему - использовать setBackgroundResource. Во-первых, вы должны создать точно такой же фон

line_label_1_pressed.xml

<item Android:top="-6dp" Android:left="-6dp" Android:right="-6dp">
    <shape>
        <size Android:height="50dp"/>
        <solid Android:color="@Android:color/transparent"/>
        <stroke Android:color="@color/myColor" Android:width="6dp"/>
    </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"/>

затем setbackgroudResource с использованием tab_selector.xml

<TextView xmlns:Android="http://schemas.Android.com/apk/res/Android"
Android:layout_width="match_parent"
Android:layout_height="match_parent"
Android:background="@drawable/tab_selector"
Android:gravity="center_horizontal|center_vertical" />
2
Ted_Liang

Я нашел другое решение, откройте styles.xml и измените одну строку:

res -> values ​​-> 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>
0
skajar