2021年12月31日金曜日

Menuの文字に色を付ける

 AndroidでToolbarを使いMenu表示させると、

以下のように文字が見えず空欄のMenuが表示されてしまう。



これはMenuの文字色が白、背景色も白であることが原因だった。

なのでMenuの文字色を調整する方法を記載する。


styleで色を調整する

Theme.xmlに以下の追加設定を加える。

19行目MenuのItemのstyleを適応する設定

23-25行目style定義で、MenuItemを定義。文字色を任意の色に変える

<resources xmlns:tools="http://schemas.android.com/tools">
    <!-- Base application theme. -->
    <style name="Theme.MyApplication"  parent="Theme.MaterialComponents.DayNight.DarkActionBar">
        <item name="colorPrimary">@color/app_color_light</item>
        <item name="colorPrimaryVariant">@color/app_color</item>
        <item name="colorOnPrimary">@color/black</item>

        <item name="actionMenuTextColor">@color/black</item>
        <item name="colorSecondary">@color/teal_200</item>
        <item name="colorSecondaryVariant">@color/teal_700</item>
        <item name="colorOnSecondary">@color/black</item>
        <item name="android:statusBarColor" tools:targetApi="l">?attr/colorPrimaryVariant</item>
        
        <!-- ToolBar使うためActionBar削除 -->
        <item name="windowActionBar">false</item>
        <item name="windowNoTitle">true</item>
        
        <!-- MenuItemのstyleを設定 -->
        <item name="android:itemTextAppearance">@style/MenuTextAppearance</item>
    </style>

    <!-- 上で設定したMenuItemのstyleを定義(文字色のみ設定) -->
    <style name="MenuTextAppearance" parent="@android:style/TextAppearance.Widget.IconMenu.Item">
        <item name="android:textColor">@color/teal_200</item>
    </style>
</resources>

結果こんな感じ




余談

ちなみにToolBarではなく、ActionBarを使ってメニュー表示させると

style調整せずにMenuの色はデフォルトで黒色が割りあったっているので、

ActionBarを使うことを検討してみてもいいと思う。

※ActionBarを使っても、今回のstyle設定をすると文字色は変わるので
 色を付けたいときは参考になると思う。


0 件のコメント:

コメントを投稿