Monday, May 7, 2012

Hide and auto-show the navigation bar, for Android 4.0 or higher


In last exercise to display a big picture, I want to hide the the navigation bar (Home, Back, ...) to leave for space for the big picture.

In Android 4.0, the APIs updated with new flags of SYSTEM_UI_FLAG_HIDE_NAVIGATION, that requests the navigation bar hide completely. Be aware that this works only for the navigation bar used by some handsets (it does not hide the system bar on tablets). The navigation bar returns to view as soon as the system receives user input.


You can also use SYSTEM_UI_FLAG_LOW_PROFILE flag, to enables “low profile" mode for the system bar or navigation bar. Navigation buttons dim and other elements in the system bar also hide. Enabling this is useful for creating more immersive games without distraction for the system navigation buttons, and SYSTEM_UI_FLAG_VISIBLE flag to request the system bar or navigation bar be visible.


You can set each of these flags for the system bar and navigation bar by calling setSystemUiVisibility() on any view in your activity. The window manager combines (OR-together) all flags from all views in your window and apply them to the system UI as long as your window has input focus. When your window loses input focus (the user navigates away from your app, or a dialog appears), your flags cease to have effect. Similarly, if you remove those views from the view hierarchy their flags no longer apply.


Example:

The navigation bar hide when the app start
The navigation bar hide when the app start

The navigation bar return after user touched on the screen
The navigation bar return after user touched on the screen


package com.exercise.AndroidBigPicture;

import android.app.Activity;
import android.os.Bundle;
import android.view.View;
import android.widget.ImageView;

public class AndroidBigPictureActivity extends Activity {
    /** Called when the activity is first created. */
    @Override
    public void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        setContentView(R.layout.main);
        
        ImageView myImageView = (ImageView)findViewById(R.id.myimageview);
        myImageView.setSystemUiVisibility(View.SYSTEM_UI_FLAG_HIDE_NAVIGATION);
    }
}


<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
    android:layout_width="fill_parent"
    android:layout_height="fill_parent"
    android:orientation="vertical" >

    <TextView
        android:layout_width="fill_parent"
        android:layout_height="wrap_content"
        android:text="@string/hello" />

    <HorizontalScrollView 
        android:layout_width="wrap_content" 
        android:layout_height="wrap_content">
        <ScrollView 
            android:layout_width="wrap_content" 
            android:layout_height="wrap_content">
            <ImageView 
                android:id="@+id/myimageview"
                android:src="@drawable/bigpicture"
                android:layout_height="wrap_content" 
                android:layout_width="wrap_content"
                android:scaleType="center"/>
        </ScrollView>
 </HorizontalScrollView>
</LinearLayout>

5 comments:

Unknown said...

I'm using a Samsung Galaxy S using android 4.04. For some reason when i call myImage.setSystemUiVisibility(View.SYSTEM_UI_FLAG_LOW_PROFILE);
with any type of flag the application crashes


FATAL EXCEPTION: main
oidRuntime E java.lang.RuntimeException: Unable to start activity ComponentInfo{com.example.displayBigImage/com.example.displayBigImage.displayBigImage}: java.lang.NullPointerException

Do you know if it is because the API is not compatible?

Erik said...

hello Robert,

I test on Galaxy Nexus running 4.0.2. But cannot repeat your problem. sorry!

I can repeat java.lang.OutOfMemoryError, if the bigpicture is very very big (4256 x 2832).

Anonymous said...

Bastards like you make browsing though ads unbearable. Especially critical it is on a mobile OS where user doesn't control anything.

Anonymous said...

you could have finger motion activated one... meaning if you flik from offscreento onscreen(down to up) from the bottom, the menu comes up, if the finger is swiped from the top then down onto the phone, then the menu disappears.

Anonymous said...

Are there any ways to force the Navigation Bar hide permanently?