Reputation: 7601
How can I dynamically hide the status and the navigation bar completely?
The app contains a regular navigation drawer with a appbar / toolbar and FAB buttons.
When switching to full screen, the content of the navigation and the status bar is scrolled away. Two empty bars are left on the screen. I want those empty bars to hide.
I created a minimal demo app. On the left is the regular app. When pushing on the fab, the app should be shown fullscreen.
How can I get the bars to hide?
QUESTION: Please write which change(s) are needed in the minimal demo project?
Updated with a second solution:
The GREAT solution provided by @Roaim works. Essential was to set the android:fitsSystemWindows layout property to false.
If you still have trouble with the showing and hiding of status/navigation bars, this solutin may help you.
Hide the bars completely:
public static void hideSystemUI() {
if (getSupportActionBar() != null) {
getSupportActionBar().hide();
}
getWindow().getDecorView().setSystemUiVisibility(
View.SYSTEM_UI_FLAG_IMMERSIVE
| View.SYSTEM_UI_FLAG_LAYOUT_STABLE
| View.SYSTEM_UI_FLAG_LAYOUT_HIDE_NAVIGATION
| View.SYSTEM_UI_FLAG_LAYOUT_FULLSCREEN
| View.SYSTEM_UI_FLAG_HIDE_NAVIGATION
| View.SYSTEM_UI_FLAG_FULLSCREEN);
}
And show all bars:
public static void showSystemUI() {
if (getSupportActionBar() != null) {
getSupportActionBar().show();
}
getWindow().clearFlags(WindowManager.LayoutParams.FLAG_FULLSCREEN);
getWindow().getDecorView().setSystemUiVisibility(View.SYSTEM_UI_FLAG_VISIBLE);
}
Upvotes: 12
Views: 23983
Reputation: 150
Theme
<style name="Theme.FullScreen" parent="@style/Theme.AppCompat.Light.NoActionBar">
<item name="android:windowFullscreen">true</item>
<item name="android:windowTranslucentStatus">true</item>
<item name="android:windowTranslucentNavigation">true</item>
<item name="android:statusBarColor">@android:color/transparent</item>
<item name="android:navigationBarColor">@android:color/transparent</item>
<item name="android:windowLayoutInDisplayCutoutMode" tools:targetApi="o_mr1">shortEdges</item>
</style>
AndroidManifest
<activity android:exported="false"
android:name=".FullScreenActivity"
android:screenOrientation="fullSensor"
android:theme="@style/Theme.FullScreen"/>
Upvotes: 1
Reputation: 21
Try this to hide/show statusbar and navbar, both are parts of SystemUI.
fun setSystemUIVisibility(hide: Boolean) {
if (Build.VERSION.SDK_INT >= Build.VERSION_CODES.R) {
val window = window.insetsController!!
val windows = WindowInsets.Type.statusBars() or WindowInsets.Type.navigationBars()
if (hide) window.hide(windows) else window.show(windows)
// needed for hide, doesn't do anything in show
window.systemBarsBehavior = WindowInsetsController.BEHAVIOR_SHOW_TRANSIENT_BARS_BY_SWIPE
} else {
val view = View.SYSTEM_UI_FLAG_HIDE_NAVIGATION or
View.SYSTEM_UI_FLAG_FULLSCREEN or
View.SYSTEM_UI_FLAG_IMMERSIVE_STICKY
window.decorView.systemUiVisibility = if (hide) view else view.inv()
}
}
Upvotes: 1
Reputation: 304
Try this...
<style name="MyApp" parent="Theme.MaterialComponents.Light.NoActionBar">
...
<item name="windowNoTitle">true</item>
<item name="windowActionBar">false</item>
<item name="android:windowFullscreen">true</item>
...
</style>
Upvotes: 2
Reputation: 2358
The issue was with your layout file. I just set android:fitsSystemWindows=false
to fix the issue. I made a pull request to your repo, which I think solves your issue.
You should follow the following official documentations:
Hide the Status Bar on Android 4.0 and Lower
public class MainActivity extends Activity {
@Override
protected void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
// If the Android version is lower than Jellybean, use this call to hide
// the status bar.
if (Build.VERSION.SDK_INT < 16) {
getWindow().setFlags(WindowManager.LayoutParams.FLAG_FULLSCREEN,
WindowManager.LayoutParams.FLAG_FULLSCREEN);
}
setContentView(R.layout.activity_main);
}
...
}
Hide the Status Bar on Android 4.1 and Higher
View decorView = getWindow().getDecorView();
// Hide the status bar.
int uiOptions = View.SYSTEM_UI_FLAG_FULLSCREEN;
decorView.setSystemUiVisibility(uiOptions);
// Remember that you should never show the action bar if the
// status bar is hidden, so hide that too if necessary.
ActionBar actionBar = getActionBar();
actionBar.hide();
Hide the Navigation Bar
View decorView = getWindow().getDecorView();
// Hide both the navigation bar and the status bar.
// SYSTEM_UI_FLAG_FULLSCREEN is only available on Android 4.1 and higher, but as
// a general rule, you should design your app to hide the status bar whenever you
// hide the navigation bar.
int uiOptions = View.SYSTEM_UI_FLAG_HIDE_NAVIGATION
| View.SYSTEM_UI_FLAG_FULLSCREEN;
decorView.setSystemUiVisibility(uiOptions);
Upvotes: 13
Reputation: 330
Go in values>styles
Now In App theme use
To make navigation bar transculate
<item name="android:windowTranslucentNavigation">true</item>
To remove it make its color matched with your layout
<item name="android:navigationBarColor">@color/white</item>
OR Try this
public void FullScreencall() {
if(Build.VERSION.SDK_INT > 11 && Build.VERSION.SDK_INT < 19) { // lower api
View v = this.getWindow().getDecorView();
v.setSystemUiVisibility(View.GONE);
} else if(Build.VERSION.SDK_INT >= 19) {
//for new api versions.
View decorView = getWindow().getDecorView();
int uiOptions = View.SYSTEM_UI_FLAG_HIDE_NAVIGATION | View.SYSTEM_UI_FLAG_IMMERSIVE_STICKY;
decorView.setSystemUiVisibility(uiOptions);
}
}
Upvotes: 2