ToolBar的样式设置

最新推荐文章于 2025-06-10 15:36:28 发布

yichang666

最新推荐文章于 2025-06-10 15:36:28 发布

阅读量5.1k

点赞数

CC 4.0 BY-SA版权

分类专栏： android笔记

本文链接：https://blog.csdn.net/yichang666/article/details/52671269

android笔记专栏收录该内容

3 篇文章

订阅专栏

本文介绍了在项目中使用ToolBar代替ActionBar时遇到的问题及其解决方案，包括标题居中、Menu位置调整、popupTheme颜色设置、menuItem文字颜色改变以及如何在menu中同时显示文字和图标。

摘要生成于 C知道，由 DeepSeek-R1 满血版支持，前往体验 >

由于新的项目开始了，原来一直使用ActionBar，但是存在各种问题，后来了解google又推出了ToolBar这个替代品，可以很好的解决一些以前ActionBar的问题,本来以为是比较简单的控件，结果在使用的过程中间出现了不少的问题，这里列出自己遇到的一些问题和解决方法。

导入依赖库：

compile 'com.android.support:appcompat-v7:23.4.0'

1.标题居中的问题

在toolbar中可以通过setTitle来设置标题文字内容，但是标题默认位置是靠左的，也没提供可以设置的属性。通过查看ToolBar源码可以看出其本身是一个ViewGroup，所以可以通过setTitle("")让其默认的title为空，同时在toolbar中添加一个textView,让其在toolbar中布局居中，然后通过该textView来设置title内容。

2.弹出的Menu位置设置

如图所示，toolbar默认设置的menu弹出的位置顶部是与toolbar的顶部对齐的，这样是不合理的，需要设置成如下

这样搜索按钮就不会被覆盖，实现的方式如下：

<style name="OverflowMenuStyle" parent="Widget.AppCompat.Light.PopupMenu.Overflow">
        <item name="overlapAnchor">false</item>
    </style>
    <!-- toolbar菜单样式 -->
    <style name="ToolbarTheme" parent="@style/ThemeOverlay.AppCompat.ActionBar">
        <item name="actionOverflowMenuStyle">@style/OverflowMenuStyle</item>
    </style>

3.修改menu的三个点图标修改

<!-- 设置图标-->
<style name="ActionButton.Overflow.toolbar" parent="android:style/Widget.Holo.Light.ActionButton.Overflow">
    <item name="android:src">@android:drawable/ic_menu_add</item>
</style>

<!-- toolbar菜单样式 -->
<style name="ToolbarTheme" parent="@style/ThemeOverlay.AppCompat.ActionBar">
    <item name="actionOverflowButtonStyle">@style/ActionButton.Overflow.toolbar</item>
    <item name="actionOverflowMenuStyle">@style/OverflowMenuStyle</item>
</style>

4.弹出菜单的背景颜色设置

默认的背景是白色的，一般都是需要设置别的颜色，只需要修改popupTheme,如下：

<!-- toolbar弹出菜单样式 -->
    <style name="ToolbarPopupTheme" parent="@style/ThemeOverlay.AppCompat">
        <item name="android:colorBackground">#212121</item>
    </style>

另外不要忘记在xml中配置

app:popupTheme="@style/ToolbarPopupTheme"

其中colorBackground就是设置的背景颜色

5.设置弹出窗menuItem中文字的颜色

toolbar中默认的menu中文字为黑色，更改文字颜色有两种方式，但是一般都是设置

<!-- toolbar菜单样式 -->
<style name="ToolbarTheme" parent="@style/ThemeOverlay.AppCompat.ActionBar">
    <item name="actionOverflowButtonStyle">@style/ActionButton.Overflow.toolbar</item>
    <item name="actionOverflowMenuStyle">@style/OverflowMenuStyle</item>
    <item name="android:actionMenuTextColor">@color/color_fafafa</item>
</style>

增加actionMenuTextColor这个item就可以设置文字的颜色，但是有时却不行，需要设置如下item

<item name="android:textColor">#ffffff</item>

6.menu同时显示文字和图标

先生成布局文件

<?xml version="1.0" encoding="utf-8"?>
<TextView xmlns:android="http://schemas.android.com/apk/res/android"
    android:layout_width="wrap_content"
    android:layout_height="wrap_content"
    android:paddingLeft="10dip"
    android:paddingRight="10dip"
    android:gravity="center"
    android:text="@string/app_edit"
    android:drawableLeft="@drawable/ic_delete_photo"
    android:textColor="@color/color_fafafa"
    android:clickable="true" />

将该布局menu_edit.xml引入菜单menu中

  <item
        android:id="@+id/action_item2"
        android:title=""
        android:orderInCategory="82"
        app:actionLayout="@layout/menu_edit"
        app:showAsAction="always" />

这样就可以让图标和文字同时存在，不过需要注意的是showAsAction属性不能设置为never,不然无法显示出来。
ToolBar还是很好用的，比ActionBar要好的多，不过很多人并不是用actionBar或者toolbar，而是自己自定义的标题栏，其实也挺好，就看大家的使用习惯了。