Android Core

Android Actionbar Drop Down navigation

ActionBar supports different navigation types within activities. We saw in an older post that we can use Tabs to navigate or we can use Drop Down Navigation. In this post we will see how we can implement the drop down navigation using fragments. What is exactly the drop down navigation? It is essentially a list of items in the actionbar. This items represent action and when we select one of them we activate the corresponding action. Usually selecting one item we move to another UI that can be implemented using Fragments.

Creating Drop Down navigation

Eclipse + ADT and Android studio both support this kind of navigation and we can find everything we need to implement it. We want to analyze the code generated automatically. To enable the  drop down navigation in our Activity we can create a new project and we reach the last step before confirming everything we have:

Immagine1[3]

To enable the drop down navigation we have to get the Actionbar reference and the set the navigation type we want, in our case NAVIGATION_MODE_LIST. If we look at the code generated we notice:

// Set up the action bar to show a dropdown list.
final ActionBar actionBar = getActionBar();
actionBar.setDisplayShowTitleEnabled(false);
actionBar.setNavigationMode(ActionBar.NAVIGATION_MODE_LIST);

where at line 4 we enable our navigation type.

Implementing the navigation item

We need to create a list of item corresponding to the action we want to support. In other words we have to create a menu with different items. The drop down list is implemented like a Spinner. We know a Spinner is android view that displays one time at time and user can select one item among a list of items. So to create our drop down navigation list we need simply populate a spinner. To populate a spinner we need an Adapter, in our case a simple ArrayAdapter, so we have:

ArrayList<String> itemList = new ArrayList<String>();
itemList.add("Section 1");
itemList.add("Section 2");
ArrayAdapter<String> aAdpt = new ArrayAdapter<String>(this, android.R.layout.simple_list_item_1, android.R.id.text1, itemList);

Looking at the code generated we notice that it is a little bit different form the one we have above because instead of thisit uses  getActionBarThemedContextCompat. Looking at this method code we find out that it returns this for all the version below Ice Cream Sandwich and another value otherwise. This is used to maintain the compatibility with the all android version.

Now we have to assign our adapter to the Actionbar, we can do it using:

actionBar.setListNavigationCallbacks(aAddpt, this);

Notice that we used this as method parameter. This means that our activity has to implement an interface so that it gets notified when user picks an item.

Implementing ActionBar.OnNavigationListener

As we said in order to be notified when user selects an item we implements ActionBar.OnNavigationListener that has only one method to override:

@Override
public boolean onNavigationItemSelected(int position, long id) {
  // Our logic
}

Now in this method we have to activate the right view according to the item selected by user. Usually we can use Fragment to enable the right UI. In this method we can instantiate a new fragment and replace the existing one with the new one.

Running the code we have:

android_drop_down_navigation_1[4]
android_drop_down_navigation_2[3]

You might be interested on: Android Action Bar (ActionBar) Tab navigation
 

Reference: Android Actionbar Drop Down navigation from our JCG partner Francesco Azzola at the Surviving w/ Android blog.

Francesco Azzola

He's a senior software engineer with more than 15 yrs old experience in JEE architecture. He's SCEA certified (Sun Certified Enterprise Architect), SCWCD, SCJP. He is an android enthusiast and he has worked for long time in the mobile development field.
Subscribe
Notify of
guest

This site uses Akismet to reduce spam. Learn how your comment data is processed.

1 Comment
Oldest
Newest Most Voted
Inline Feedbacks
View all comments
anon
anon
8 years ago

Any reason you decided not to show the XML files in the tutorial?

Back to top button