• Custom ActionBars: Adding Buttons to the ActionBar in Android

    Android RobotWhen developing an Android app recently, I wanted to make a change such that I could add a button to the ActionBar as I was using a context menu to access a single option. It seemed to me that a dedicated button with an obvious icon would make more sense than the current setup.

    Initially I considered that it would be a relatively difficult thing to do, requiring all sorts of customisations to be applied to the ActionBar. In the end, however, that preconception turned out to be false. It is, in fact, a lot easier than one might think. This is because Actions on the ActionBar are by default represented as buttons.

    Using the following steps, you will be able to simply and easily add buttons to your ActionBar.

    Introduction

    I am assuming that you will already be well enough acquainted with Android development such that you will be able to create and run a basic application. This is not a tutorial on creating an app from scratch. It also assumes that the button will be present on devices running API 14 and up – there are third-party libraries available (such as ActionBarSherlock) which allow action bars to be created on devices running API lower than 14 – this will be covered in another tutorial. For this one, we are going to do two different things depending on the API version.

    Two Menus for One Activity

    As a result of the support for buttons in ActionBars only really being available in API 14+, we are going to create two menu files; one which will load the option off the context menu and one which will be present as an icon on the ActionBar. We are going to keep things simple and in both menus only include one item – a search button.

    Pre-API14 Menu

    Create a new menu XML file in your project, naming it appropriately for the location of the menu. In it, place a single option, for example:

    <?xml version="1.0" encoding="utf-8"?>
    <menu xmlns:android="http://schemas.android.com/apk/res/android" >
        <item android:id="@+id/refresh_view" android:title="@string/refresh_view"></item>
    </menu>

    API14+ Menu

    For the ActionBar to have a button with an icon, we can define a different menu (in a different XML file). Make sure that there is a relevant icon in the res/drawable folder:

    <?xml version="1.0" encoding="utf-8"?>
    <menu xmlns:android="http://schemas.android.com/apk/res/android" >
        <item
            android:id="@+id/api14_refresh_view"
            android:icon="@drawable/refresh_icon"
            android:showAsAction="ifRoom"
            android:title="@string/refresh_view">
        </item>
    </menu>

    Updating the Java code:

    With these two menus defined, you can reference them in the onCreateOptionsMenu method (assuming that the menu files were called image_view and image_view_api14):

    @Override
    public boolean onCreateOptionsMenu(Menu menu) {
    	// Inflate the menu; this adds items to the action bar if it is present.
    	if (currentApiVersion >= android.os.Build.VERSION_CODES.ICE_CREAM_SANDWICH) {
    		getMenuInflater().inflate(R.menu.image_view_api14, menu);
    	}else {
    		getMenuInflater().inflate(R.menu.image_view, menu);
    	}
    
    	// ... more stuff here if necessary
    }

    And that’s really all there is to it.

Leave a Reply

Your email address will not be published. Required fields are marked *

Are you human: *