如何在Android中以编程方式更改TabLayout背景

时间:2017-03-22 10:25:15

标签: android android-tablayout android-coordinatorlayout android-appbarlayout

我正在做的是尝试更改ToolbarStatusBarTablayout颜色,而不是默认的theme颜色,我能够成功地更改所有widgets的颜色,但在Tablayout中获取应用主题的主要颜色的某种边界不知道为什么?任何人都可以告诉我如何删除它?是否有任何默认样式定义为Tablayout的边也不是矩形。

屏幕:

here green color visible at boundaries of Tablayout is the apps theme color

xml:

<?xml version="1.0" encoding="utf-8"?>
<android.support.design.widget.CoordinatorLayout
xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:app="http://schemas.android.com/apk/res-auto"
xmlns:tools="http://schemas.android.com/tools"
android:id="@+id/app_bar_container"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:fitsSystemWindows="true"
tools:context=".mainFlow.MainActivity">

<android.support.design.widget.AppBarLayout
    android:id="@+id/appbar_main"
    android:layout_width="match_parent"
    android:layout_height="wrap_content"
    android:theme="@style/AppTheme.AppBarOverlay">

    <android.support.v7.widget.Toolbar
        android:id="@+id/toolbar"
        android:layout_width="match_parent"
        android:layout_height="?attr/actionBarSize"
        android:background="?attr/colorPrimary"
        app:popupTheme="@style/AppTheme.PopupOverlay"/>

    <android.support.design.widget.TabLayout
        android:id="@+id/tabs"
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        app:tabGravity="fill"
        android:background="@color/colorPrimaryDark"
        app:tabIndicatorHeight="2dp"
        app:tabMode="fixed"
        app:tabIndicatorColor="@color/white"/>

</android.support.design.widget.AppBarLayout>


<android.support.v4.view.ViewPager
    android:id="@+id/viewpager"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    app:layout_behavior="@string/appbar_scrolling_view_behavior"/>

</android.support.design.widget.CoordinatorLayout>

4 个答案:

答案 0 :(得分:1)

试试这个:

你的xml:

<android.support.design.widget.TabLayout
    ....
    app:tabBackground="@drawable/tab_color_selector"
    ...
    />

和选择器 RES /抽拉/ tab_color_selector.xml:

<?xml version="1.0" encoding="utf-8"?>
<selector xmlns:android="http://schemas.android.com/apk/res/android">
    <item android:drawable="@color/tab_background_selected" android:state_selected="true"/>
    <item android:drawable="@color/tab_background_unselected"/>
</selector>

或以编程方式:

tabLayout.setBackground(ContextCompat.getDrawable(context, R.drawable.tab_color_selector));

答案 1 :(得分:1)

我有完全相同的问题。我想更改整个选项卡布局,不仅是更改所选的选项卡,因为我将其用于日/夜模式。我通过在onCreate中设置内容视图之前检查为夜晚主题设置的布尔值来解决此问题。

@Override
protected void onCreate(Bundle savedInstanceState) {
    super.onCreate(savedInstanceState);

    SharedPreferences nightModeSwitchState = getSharedPreferences("NightModeSwitchState", 0);
    mNightModeSwitchState = nightModeSwitchState.getBoolean("NightModeSwitchState", false);

    if (mNightModeSwitchState) {
        setContentView(R.layout.activity_book_night);
    } else {
        setContentView(R.layout.activity_book);
    }

我有两个布局都包含了tabLayouts。其中之一引用了tabLayout的样式文件,将其设置为具有深色背景的夜间模式颜色,而布局引用了设置为TabLayout的常规颜色的样式文件。

<style name="CategoryTab" parent="Widget.Design.TabLayout">
    <item name="tabIndicatorColor">@android:color/white</item>
    <item name="tabSelectedTextColor">@android:color/white</item>
    <item name="tabTextAppearance">@style/CategoryTabTextAppearance</item>
    <item name="tabBackground">@drawable/tab_regular_theme</item>
    <item name="android:textColorSecondary">@android:color/white</item>
</style>

<style name="CategoryTabNight" parent="Widget.Design.TabLayout">
    <item name="tabIndicatorColor">@android:color/white</item>
    <item name="tabSelectedTextColor">@android:color/white</item>
    <item name="tabTextAppearance">@style/CategoryTabTextAppearance</item>
    <item name="tabBackground">@drawable/tab_layout_dark_mode</item>
    <item name="android:textColorSecondary">@android:color/white</item>
</style>

样式文件引用了可控制背景颜色的不同可绘制对象,如您在上面看到的。这是可绘制对象...

这是夜间模式可绘制的内容:

<?xml version="1.0" encoding="utf-8"?>
<selector xmlns:android="http://schemas.android.com/apk/res/android">
<item android:drawable="@color/dark_grey" android:state_selected="true"/>
<item android:drawable="@color/dark_grey"/>
</selector>

这是可绘制的常规模式:

<?xml version="1.0" encoding="utf-8"?>
<selector xmlns:android="http://schemas.android.com/apk/res/android">
<item android:drawable="@color/app_bar" android:state_selected="true"/>
<item android:drawable="@color/app_bar"/>
</selector>

其他所有布局都是相同的,只是为了改变布局的样式文件而不会弄乱任何东西。我希望这是有道理的。我测试了它,对我有用。我尝试了很多其他事情,但没有任何效果。在检查布尔值之前,调用Shared Preference以获得值很重要。我希望这对某人有帮助。

答案 2 :(得分:0)

就我而言,我已将标签的背景色设置为透明:

<com.google.android.material.tabs.TabLayout
        android:id="@+id/tabs"
        android:layout_width="0dp"
        android:layout_height="wrap_content"
        app:layout_constraintEnd_toEndOf="parent"
        app:layout_constraintStart_toStartOf="parent"
        app:layout_constraintTop_toBottomOf="@id/toolbar"
        app:tabBackground="@android:color/transparent"/>

然后我在代码中设置TabLayout背景颜色:

tabs.setBackgroundColor()

答案 3 :(得分:-1)

您可以为TabLayout设置主题。

<style name="MyTabLayout" parent="android:Widget">
      <item name="tabBackground">@drawable/tab_background</item> 
</style>

并将此主题设置为TabLayout。