Android NavigationBar Example

Android NavigationBar  Example
simple   android navigationbar look like iphone navigationbar.

layout code.

layout/actnavbar.xml.

<?xml version="1.0" encoding="utf-8"?>

<RelativeLayout
    xmlns:android="http://schemas.android.com/apk/res/android"
    android:layout_width="fill_parent"
    android:layout_height="fill_parent"
    android:background="@android:color/white"
>
    <RadioGroup
        android:id="@+id/radiogroup"
        android:layout_width="fill_parent"
        android:layout_height="60dp"
        android:layout_alignParentBottom="true"
        android:orientation="horizontal"
        android:background="@drawable/navbar_background"
    >
        <RadioButton
            android:id="@+id/btnAll"
            style="@style/navbar_button"
            android:drawableTop="@drawable/navbar_allselector"
            android:text="All"
        />
        <RadioButton
            android:id="@+id/btnPicture"
            style="@style/navbar_button"
            android:drawableTop="@drawable/navbar_pictureselector"
            android:text="Pictures"
            android:layout_marginLeft="5dp"
        />
        <RadioButton
            android:id="@+id/btnVideo"
            style="@style/navbar_button"
            android:drawableTop="@drawable/navbar_videoselector"
            android:text="Videos"
            android:layout_marginLeft="5dp"
        />
         <RadioButton
            android:id="@+id/btnFile"
            style="@style/navbar_button"
            android:drawableTop="@drawable/navbar_fileselector"
            android:text="Files"
            android:layout_marginLeft="5dp"
        />
        <RadioButton
            android:id="@+id/btnMore"
            style="@style/navbar_button"
            android:drawableTop="@drawable/navbar_moreselector"
            android:text="More"
            android:layout_marginLeft="5dp"
        />
    </RadioGroup>
   
   
    <LinearLayout
        android:id="@+id/floatingmenu"
        android:layout_width="fill_parent"
        android:layout_height="wrap_content"
        android:layout_alignParentBottom="true"
        android:layout_marginLeft="30dp"
        android:layout_marginRight="30dp"
        android:background="@drawable/laysemitransparentwithborders"
        android:orientation="vertical"
        android:layout_marginBottom="-4dp"
        android:visibility="gone"
    >
        <TextView
            android:layout_width="fill_parent"
            android:layout_height="wrap_content"
            android:paddingLeft="5dp"
            android:paddingTop="15dp"
            android:paddingBottom="15dp"
            android:text="Contacts"
            android:textColor="#ffffff"
            android:textSize="16dp"
        />
        <View
            android:layout_width="fill_parent"
            android:layout_height="1dp"
            android:background="#ff999999"
        />
        <TextView
            android:layout_width="fill_parent"
            android:layout_height="wrap_content"
            android:paddingLeft="5dp"
            android:paddingTop="15dp"
            android:paddingBottom="15dp"
            android:text="Calendar"
            android:textColor="#ffffff"
            android:textSize="16dp"
        />
    </LinearLayout>
</RelativeLayout>

values/style.xml

<?xml version="1.0" encoding="utf-8"?>
<resources>
  <style name="navbar_button">
 <item name="android:layout_width">0dp</item>
 <item name="android:layout_height">wrap_content</item>
 <item name="android:button">@null</item>
 <item name="android:background">@drawable/navbar_backgroundselector</item>
 <item name="android:gravity">center_horizontal</item>
 <item name="android:layout_weight">1</item>
 <item name="android:textSize">12dp</item>
  </style>
</resources>

Activity code


public class NavbarActivity  extends Activity {

    @Override
    public void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        setContentView(R.layout.actnavbar);

        RadioButton radioButton;
        radioButton = (RadioButton) findViewById(R.id.btnAll);
        radioButton.setOnCheckedChangeListener(btnNavBarOnCheckedChangeListener);
        radioButton = (RadioButton) findViewById(R.id.btnPicture);
        radioButton.setOnCheckedChangeListener(btnNavBarOnCheckedChangeListener);
        radioButton = (RadioButton) findViewById(R.id.btnVideo);
        radioButton.setOnCheckedChangeListener(btnNavBarOnCheckedChangeListener);
        radioButton = (RadioButton) findViewById(R.id.btnFile);
        radioButton.setOnCheckedChangeListener(btnNavBarOnCheckedChangeListener);
        radioButton = (RadioButton) findViewById(R.id.btnMore);
        radioButton.setOnCheckedChangeListener(btnNavBarOnCheckedChangeListener);
    }

    private CompoundButton.OnCheckedChangeListener btnNavBarOnCheckedChangeListener = new CompoundButton.OnCheckedChangeListener() {
        public void onCheckedChanged(CompoundButton buttonView, boolean isChecked) {
            if (isChecked) {
                Toast.makeText(NavbarActivity.this,"Clicked Button ! "+ buttonView.getText(), Toast.LENGTH_SHORT).show();
            }
        }
    };
}

Sample Screen Shot:

naviigation bar for android look like iphone navigation bar. download source code here.