1 page.title=Hiding the Status Bar 2 3 trainingnavtop=true 4 5 @jd:body 6 7 <div id="tb-wrapper"> 8 <div id="tb"> 9 10 <!-- table of contents --> 11 <h2>This lesson teaches you to</h2> 12 <ol> 13 <li><a href="#40">Hide the Status Bar on Android 4.0 and Lower</a></li> 14 <li><a href="#41">Hide the Status Bar on Android 4.1 and Higher</a></li> 15 16 <li><a href="#behind">Make Content Appear Behind the Status Bar</a></li> 17 <li><a href="#action-bar">Synchronize the Status Bar with Action Bar Transition</a></li> 18 </ol> 19 20 <!-- other docs (NOT javadocs) --> 21 <h2>You should also read</h2> 22 23 <ul> 24 <li> 25 <a href="{@docRoot}guide/topics/ui/actionbar.html">Action Bar</a> API Guide 26 </li> 27 <li> 28 <a href="{@docRoot}design/index.html"> 29 Android Design Guide 30 </a> 31 </li> 32 </ul> 33 34 35 </div> 36 </div> 37 38 <p> 39 This lesson describes how to hide the status bar on different versions of 40 Android. Hiding the status bar (and optionally, the navigation bar) lets the 41 content use more of the display space, thereby providing a more immersive user experience. 42 43 </p> 44 45 <p> 46 Figure 1 shows an app with a visible status bar: 47 </p> 48 49 <img src="{@docRoot}images/training/status_bar_show.png" 50 alt="system bars"> 51 <p class="img-caption"><strong>Figure 1.</strong> Visible status bar.</p> 52 53 <p> 54 Figure 2 shows an app with a hidden status bar. Note that the action bar is hidden too. 55 You should never show the action bar without the status bar. 56 </p> 57 58 <img src="{@docRoot}images/training/status_bar_hide.png" 59 alt="system bars"> 60 <p class="img-caption"><strong>Figure 2.</strong> Hidden status bar.</p> 61 62 <h2 id="40">Hide the Status Bar on Android 4.0 and Lower</h2> 63 64 <p>You can hide the status bar on Android 4.0 (API level 14) and lower by setting 65 {@link android.view.WindowManager} flags. You can do this programmatically or by 66 setting an activity theme in your app's manifest file. Setting an activity theme in your app's 67 manifest file is the preferred approach if the status bar should always remain 68 hidden in your app (though strictly speaking, you could programmatically override the 69 theme if you wanted to). For example:</p> 70 71 <pre> 72 <application 73 ... 74 android:theme="@android:style/Theme.Holo.NoActionBar.Fullscreen" > 75 ... 76 </application> 77 </pre> 78 79 <p>The advantages of using an activity theme are as follows:</p> 80 81 <ul> 82 <li>It's easier to maintain and less error-prone than setting a flag programmatically.</li> 83 <li>It results in smoother UI transitions, because the system has the information it needs 84 to render your UI before instantiating your app's main activity.</li> 85 </ul> 86 87 <p> 88 Alternatively, you can programmatically set {@link android.view.WindowManager} flags. 89 This approach makes it easier to hide and show the status bar as the user interacts with 90 your app:</p> 91 92 <pre>public class MainActivity extends Activity { 93 94 @Override 95 protected void onCreate(Bundle savedInstanceState) { 96 super.onCreate(savedInstanceState); 97 // If the Android version is lower than Jellybean, use this call to hide 98 // the status bar. 99 if (Build.VERSION.SDK_INT < 16) { 100 getWindow().setFlags(WindowManager.LayoutParams.FLAG_FULLSCREEN, 101 WindowManager.LayoutParams.FLAG_FULLSCREEN); 102 } 103 setContentView(R.layout.activity_main); 104 } 105 ... 106 } 107 </pre> 108 109 <p>When you set {@link android.view.WindowManager} flags (whether through an activity theme or 110 programmatically), the flags remain in effect unless your app clears them.</p> 111 112 <p>You can use 113 {@link android.view.WindowManager.LayoutParams#FLAG_LAYOUT_IN_SCREEN} 114 to set your activity layout to use the same screen area that's available when you've enabled 115 {@link android.view.WindowManager.LayoutParams#FLAG_FULLSCREEN}. This prevents your 116 content from resizing when the status bar hides and shows.</p> 117 118 119 <h2 id="41">Hide the Status Bar on Android 4.1 and Higher</h2> 120 121 <p>You can hide the status bar on Android 4.1 (API level 16) and higher by 122 using {@link android.view.View#setSystemUiVisibility setSystemUiVisibility()}. 123 {@link android.view.View#setSystemUiVisibility setSystemUiVisibility()} sets UI flags at 124 the individual view level; these settings are aggregated to the window level. Using 125 {@link android.view.View#setSystemUiVisibility setSystemUiVisibility()} to set UI flags 126 gives you more granular control over the system bars than using 127 {@link android.view.WindowManager} flags. This snippet hides the status bar:</p> 128 129 <pre>View decorView = getWindow().getDecorView(); 130 // Hide the status bar. 131 int uiOptions = View.SYSTEM_UI_FLAG_FULLSCREEN; 132 decorView.setSystemUiVisibility(uiOptions); 133 // Remember that you should never show the action bar if the 134 // status bar is hidden, so hide that too if necessary. 135 ActionBar actionBar = getActionBar(); 136 actionBar.hide(); 137 </pre> 138 139 <p>Note the following:</p> 140 141 <ul> 142 <li>Once UI flags have been cleared (for example, by navigating away from the 143 activity), your app needs to reset them if you want to hide the bars again. 144 See <a href="visibility.html">Responding to UI Visibility Changes</a> for a 145 discussion of how to listen for UI visibility changes so that your app can 146 respond accordingly.</li> 147 148 <li>Where you set the UI flags makes a difference. If you hide the system bars in your activity's 149 {@link android.app.Activity#onCreate onCreate()} method and the user presses Home, the system bars will 150 reappear. When the user reopens the activity, {@link android.app.Activity#onCreate onCreate()} 151 won't get called, so the system bars will remain visible. If you want system UI changes to 152 persist as the user navigates in and out of your activity, set UI flags in 153 {@link android.app.Activity#onResume onResume()} 154 or {@link android.view.Window.Callback#onWindowFocusChanged onWindowFocusChanged()}.</li> 155 156 <li>The method {@link android.view.View#setSystemUiVisibility setSystemUiVisibility()} 157 only has an effect if the view you call it from is visible.</li> 158 159 <li>Navigating away from the view causes flags 160 set with {@link android.view.View#setSystemUiVisibility setSystemUiVisibility()} 161 to be cleared.</li> 162 </ul> 163 164 165 </p> 166 167 <h2 id="behind">Make Content Appear Behind the Status Bar</h2> 168 <p>On Android 4.1 and higher, you can set your application's content to appear behind 169 the status bar, so that the content doesn't resize as the status bar hides and shows. 170 To do this, use 171 {@link android.view.View#setSystemUiVisibility setSystemuiVisibility(SYSTEM_UI_FLAG_LAYOUT_FULLSCREEN)}. 172 You may also need to use 173 {@link android.view.View#SYSTEM_UI_FLAG_LAYOUT_STABLE} to help your app maintain a 174 stable layout.</p> 175 176 <p>When you use this approach, it becomes your responsibility to ensure that critical parts 177 of your app's UI (for example, the built-in controls in a Maps application) don't end up 178 getting covered by system bars. This could make your app unusable. In most cases you can 179 handle this by adding the {@code android:fitsSystemWindows} attribute to your XML layout file, set to 180 {@code true}. This adjusts the padding of the parent {@link android.view.ViewGroup} 181 to leave space for the system windows. This is sufficient for most applications.</p> 182 183 <p>In some cases, however, you may need to modify the default padding to get the desired 184 layout for your app. To directly manipulate how your 185 content lays out relative to the system bars (which occupy a space known as the window's 186 "content insets"), override {@link android.view.View#fitSystemWindows fitSystemWindows(Rect insets)}. 187 The {@link android.view.View#fitSystemWindows fitSystemWindows()} method is called by the 188 view hierarchy when the content insets for a window have changed, to allow the window to 189 adjust its content accordingly. By overriding this method you can handle the 190 insets (and hence your app's layout) however you want. </p> 191 192 <h2 id="action-bar">Synchronize the Status Bar with Action Bar Transition</h2> 193 194 <p>On Android 4.1 and higher, to avoid resizing your layout when the action bar hides and 195 shows, you can enable overlay mode for the <a href="{@docRoot}guide/topics/ui/actionbar.html">action bar</a>. 196 When in overlay mode, your activity layout uses all the 197 space available as if the action bar is not there and the system draws the action bar in 198 front of your layout. This obscures some of the layout at the top, but now when the 199 action bar hides or appears, the system does not need to resize your layout and the 200 transition is seamless.</p> 201 202 <p>To enable overlay mode for the action bar, you need to create a custom theme that 203 extends an existing theme with an action bar and set the 204 {@code android:windowActionBarOverlay} attribute 205 to {@code true}. For more discussion of this topic, see 206 <a href="{@docRoot}training/basics/actionbar/overlaying.html#EnableOverlay"> 207 Overlaying the Action Bar</a> in the <a href="{@docRoot}training/basics/actionbar/index.html"> 208 Adding the Action Bar</a> class.</p> 209 210 211 <p>Then use 212 {@link android.view.View#setSystemUiVisibility setSystemuiVisibility(SYSTEM_UI_FLAG_LAYOUT_FULLSCREEN)}, 213 as described above, 214 to set your activity layout to use the same screen area that's available when you've enabled 215 {@link android.view.View#SYSTEM_UI_FLAG_FULLSCREEN}. 216 217 When you want to hide the system UI, call 218 {@link android.view.View#setSystemUiVisibility setSystemUiVisibility(SYSTEM_UI_FLAG_FULLSCREEN)}. 219 This also hides the action bar (because {@code windowActionBarOverlay=true)} and does 220 so with a coordinated animation when both hiding and showing the two.</p> 221
