🍰

How to change color of arrow back button

2022/07/02に公開

Issue

アクションバーのテキストの色(ActionBarと書かれている部分)は黒に変更できたのですが、戻るボタンの色(赤枠部分)が黒に変わらない!

と思って色々調べましたが、私と環境が違ったのかなかなか思うように反映されませんでした。

Set text color on ActionBar

テキストの色の変更については以下の行をthemes.xmlに追加してください。

<!-- set text color on actionbar -->
<item name="titleTextColor">@color/black</item>

Set color of arrow back button

  1. drawable->New->Vector Assetを選択
  2. Clip Artから任意のアイコンを選択した後、Colorで同様に任意の色を選択
  3. 表示したいActivityに以下のコードを追加
// set title of actionbar
supportActionBar?.setTitle("ActionBar")
// display arrow back button
supportActionBar?.setDisplayHomeAsUpEnabled(true)
// set icon from assets to change color of arrow back button
supportActionBar?.setHomeAsUpIndicator(R.drawable.ic_baseline_arrow_back_24)

Result

うれしー!やったー!

Discussion