Posted at

ToolBarの背景色やオプションメニューの色を変更する方法

More than 3 years have passed since last update.

AppCompat v21ToolBarを使う場合に、テーマの色設定がToolBarのどこに影響を与えるかのメモです。

AppCompat v21のドキュメントにあるように、res/values/themes.xmlの中に共通テーマを作ってそれを適用しています。


res/values/themes.xml

<?xml version="1.0" encoding="utf-8"?>

<resources>

<style name="NoActionBarTheme" parent="Theme.AppCompat.Light.NoActionBar">
<!-- ToolBarの背景色 -->
<item name="colorPrimary">@color/cyan500</item>
<item name="colorPrimaryDark">@color/cyan600</item>
<!-- ToolBarのタイトルテキスト色 -->
<item name="android:textColorPrimary">@color/white</item>
<!-- ToolBarのオプションメニューのOverflowアイコンの色 -->
<item name="android:textColorSecondary">@color/white</item>
<item name="windowActionModeOverlay">true</item>
<item name="android:windowBackground">@null</item>
</style>

</resources>



androidManifest.xml

<application

android:allowBackup="true"
android:hardwareAccelerated="true"
android:icon="@drawable/ic_launcher"
android:label="@string/app_name"
android:largeHeap="true"
android:theme="@style/NoActionBarTheme">

<!--略-->

</application>



layouts/activity_main.xml

<!-- app:popupThemeで、オプションメニューのOverflowアイコンを押したときのポップアップメニューのテキスト色や背景色を設定 -->

<android.support.v7.widget.Toolbar
android:id="@+id/toolbar"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:background="?attr/colorPrimary"
android:minHeight="?attr/actionBarSize"
app:popupTheme="@style/Theme.AppCompat.Light" />