You need to enable JavaScript to run this app.
最新活动
大模型
产品
解决方案
定价
生态与合作
支持与服务
开发者
了解我们

Android开发:如何修改应用标签及标签标题背景颜色?

在Java环境下修改Android应用标题栏与标签栏背景色

嘿,我来帮你搞定这个问题!要把默认蓝色的标题栏(ActionBar/Toolbar)和标签栏(TabLayout)改成白色,其实分两种核心场景来处理就行,下面给你一步步讲清楚:

一、把标题栏背景改成白色

现在Android里主流的标题栏实现有两种:传统的ActionBar,和更灵活的Toolbar。我都给你讲一下:

1. 针对ActionBar的设置

静态配置(推荐,更稳定)

直接在res/values/styles.xml里修改你的App主题,把标题栏背景和文字颜色一起调整,避免白色背景下文字看不清:

<style name="AppTheme" parent="Theme.AppCompat.Light.DarkActionBar">
    <!-- 设置标题栏背景为白色 -->
    <item name="colorPrimary">@android:color/white</item>
    <!-- 把标题文字改成黑色,不然白色背景下看不到 -->
    <item name="android:textColorPrimary">@android:color/black</item>
    <!-- 也可以直接指定ActionBar的样式 -->
    <item name="actionBarStyle">@style/CustomActionBar</item>
</style>

<style name="CustomActionBar" parent="@style/Widget.AppCompat.ActionBar">
    <item name="background">@android:color/white</item>
</style>

动态修改(适合需要根据场景切换颜色的情况)

如果要在Java代码里动态调整,用下面的代码:

ActionBar actionBar = getSupportActionBar();
if (actionBar != null) {
    // 设置标题栏背景为白色
    actionBar.setBackgroundDrawable(new ColorDrawable(Color.WHITE));
    // 同时修改标题文字颜色为黑色
    actionBar.setTitle(Html.fromHtml("<font color='#000000'>你的应用标题</font>"));
}

2. 针对Toolbar的设置(现在更推荐用这个)

如果你的项目用的是Toolbar替代ActionBar,操作更灵活:

静态配置(布局文件里直接设置)

<androidx.appcompat.widget.Toolbar
    android:id="@+id/toolbar"
    android:layout_width="match_parent"
    android:layout_height="?attr/actionBarSize"
    <!-- 直接设置背景为白色 -->
    android:background="@android:color/white"
    <!-- 标题文字设为黑色 -->
    app:titleTextColor="@android:color/black"/>

动态修改(Java代码里调整)

Toolbar toolbar = findViewById(R.id.toolbar);
setSupportActionBar(toolbar);

// 动态设置Toolbar背景为白色
toolbar.setBackgroundColor(Color.WHITE);
// 设置标题文字颜色
toolbar.setTitleTextColor(Color.BLACK);

二、把标签栏(TabLayout)改成白色背景

现在主流的标签栏是用Material Design的TabLayout,修改方式同样分静态和动态:

1. 静态配置(布局文件)

直接在布局里设置背景、文字颜色和指示器颜色(白色背景下,指示器用黑色更醒目):

<com.google.android.material.tabs.TabLayout
    android:id="@+id/tabLayout"
    android:layout_width="match_parent"
    android:layout_height="wrap_content"
    <!-- 标签栏背景设为白色 -->
    android:background="@android:color/white"
    <!-- 未选中的标签文字颜色 -->
    app:tabTextColor="@android:color/darkgray"
    <!-- 选中的标签文字颜色 -->
    app:tabSelectedTextColor="@android:color/black"
    <!-- 标签底部的指示器颜色 -->
    app:tabIndicatorColor="@android:color/black"/>

2. 动态修改(Java代码)

如果需要在运行时调整颜色,用下面的代码:

TabLayout tabLayout = findViewById(R.id.tabLayout);

// 设置标签栏背景为白色
tabLayout.setBackgroundColor(Color.WHITE);
// 设置未选中标签的文字颜色
tabLayout.setTabTextColor(Color.DKGRAY);
// 设置选中标签的文字颜色
tabLayout.setSelectedTabIndicatorColor(Color.BLACK);
// 可选:调整指示器的高度,让它更明显
tabLayout.setSelectedTabIndicatorHeight((int) TypedValue.applyDimension(
    TypedValue.COMPLEX_UNIT_DIP, 
    2, 
    getResources().getDisplayMetrics()
));

补充:旧版ActionBar.Tab的处理(不推荐,但兼容老项目)

如果你的项目还在用旧的ActionBar.Tab,可以用下面的方式修改背景:

ActionBar actionBar = getActionBar();
if (actionBar != null) {
    actionBar.setNavigationMode(ActionBar.NAVIGATION_MODE_TABS);
    // 添加标签
    ActionBar.Tab tab1 = actionBar.newTab().setText("标签1");
    actionBar.addTab(tab1);
    
    // 遍历修改每个Tab的背景
    for (int i = 0; i < actionBar.getTabCount(); i++) {
        View tabView = ((ViewGroup) actionBar.getTabAt(i).getCustomView()).getChildAt(0);
        if (tabView != null) {
            tabView.setBackgroundColor(Color.WHITE);
        }
    }
}

不过还是建议尽快迁移到TabLayout,功能更全也更符合Material Design规范。

按照上面的步骤操作,就能实现你想要的白色标题栏+白色标签栏的效果啦!

内容的提问来源于stack exchange,提问作者LolloBeruhig

火山引擎 最新活动