Android bottom bar

By default, action items are displayed on the action bar at the top of the screen. However, Android applications may use a separate bottom bar to display action items. This is useful when the activity is running on a narrow screen and there is not enough space to display all the action items. To achieve this goal, you will add the uiOptions="splitActionBarWhenNarrow" to the activity in the AndroidManifest.xml file. See the example below.


    
  <activity
......      
         android:uiOptions="splitActionBarWhenNarrow"
......
         >        
     </activity>


The uiOptions="splitActionBarWhenNarrow" attribute works only in API level 14 and higher. To support older versions, you need to add a <meta-data> element as a child of each <activity> element. You will assign "android.support.UI_OPTIONS" to the name attribute and "splitActionBarWhenNarrow" to the value attribute of the <meta-data> element.


      <activity
......        
         android:uiOptions="splitActionBarWhenNarrow"
......
         >
          <meta-data android:name="android.support.UI_OPTIONS"
             android:value="splitActionBarWhenNarrow" />    
        
     </activity>

    
Now to have an example application on using bottom bar to display action items, create a new Android project. Then modify the main.xml file in the res/menu folder to add four action items as shown below. You need searchicon, trackicon, meetingicon, and usericon images in the res/drawable folder.

<menu xmlns:android="http://schemas.android.com/apk/res/android" >
   <item android:id="@+id/action_search"
       android:icon="@drawable/searchicon"
       android:title="Search"
       android:showAsAction="always|withText"
       />
   <item android:id="@+id/action_tracking"
       android:icon="@drawable/trackicon"
       android:title="Doc Track"
       android:showAsAction="always|withText"
       />
   <item android:id="@+id/action_meeting"
       android:icon="@drawable/meetingicon"
       android:title="Meeting"
       android:showAsAction="always|withText"
       />
   <item android:id="@+id/action_user"
       android:icon="@drawable/usericon"
       android:title="User"
       android:showAsAction="always|withText"
       />
</menu>


Here is the complete content of the AndroidManifest.xml file.

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

<manifest xmlns:android="http://schemas.android.com/apk/res/android"
   package="com.example.androidexample"
   android:versionCode="1"
   android:versionName="1.0" >
<uses-sdk
     android:minSdkVersion="11"
     android:targetSdkVersion="17" />
   <application
     android:allowBackup="true"
     android:icon="@drawable/ic_launcher"
     android:label="@string/app_name"    
     android:theme="@style/AppTheme">
     <activity
        android:name="com.example.androidexample.MainActivity"
        android:label="@string/app_name"
        android:uiOptions="splitActionBarWhenNarrow"
         >
        <meta-data android:name="android.support.UI_OPTIONS"
             android:value="splitActionBarWhenNarrow" />
        
        <intent-filter>
           <action android:name="android.intent.action.MAIN" />
           <category android:name="android.intent.category.LAUNCHER" />
        </intent-filter>        
        
     </activity>
    
   </application>

</manifest>


After running the example application, try to switch from portrait to landscape view. You will notice that in portrait view, all action items are displayed on the bottom bar while in the landscape view, all items are displayed on the action bar at the top.

Android-bottom-bar

Posted by: Dara | post date: 09-26-2014 | Subject: Android Apps Development

write programming tip



This website intents to provide free and high quality tutorials, examples, exercises and solutions, questions and answers of programming and scripting languages:
C, C++, C#, Java, VB.NET, Python, VBA,PHP & Mysql, SQL, JSP, ASP.NET,HTML, CSS, JQuery, JavaScript and other applications such as MS Excel, MS Access, and MS Word. However, we don't guarantee all things of the web are accurate. If you find any error, please report it then we will take actions to correct it as soon as possible.