Help us understand the problem. What is going on with this article?

StatusBar や AppBar を透過にする

More than 1 year has passed since last update.

StatusBar や AppBar を透過したいなと思ったときに毎回調べてはハマったりしているので自分用にメモとして残したいと思います。


~.NoActionBar を継承したスタイルはどこかで設定して自前で ActionBar を実装している前提です。


AndroidManifest にある該当の Activity の theme に以下を設定します。

<style name="TranslucentStatusBar">
    <item name="android:statusBarColor">@android:color/transparent</item>

v23 以降はコレを設定します。

<style name="TranslucentStatusBar">
    <item name="android:statusBarColor">@android:color/transparent</item>
    <item name="android:windowLightStatusBar">true</item>

Y.A.M の 雑記帳: StatusBar 透明化の正しい方法 にとても詳しく書かれています。ちゃんと理解したい人はみてください。


AppBarLayouttheme として以下を設定します。

<style name="TranslucentAppBar">
    <item name="colorPrimary">@android:color/transparent</item>
    <item name="android:windowActionBarOverlay">true</item>
    <item name="windowActionBarOverlay">true</item>

おそらく elevation が残るので、レイアウトに直接 app:elevaiton="0dp" を設定します。


Toolbar に以下を theme として設定します。もしかしたら他にいい方法あるかもしれないので知っている人は教えてください :pray:

<style name="ToolBar">
    <item name="navigationIcon">@drawable/ic_close_white</item>
Why not register and get more from Qiita?
  1. We will deliver articles that match you
    By following users and tags, you can catch up information on technical fields that you are interested in as a whole
  2. you can read useful information later efficiently
    By "stocking" the articles you like, you can search right away