Welcome to the final part of this review of the Pluralsight course Improving User Interaction with the Android Action Bar by Jim Wilson

Jim has over 30 years of software engineering experience, with the past 15 years heavily focused on creating mobile device and location-based solutions. He has co-founded multiple software-related startups and has served in a consulting role at several more.

After nearly a decade as a Microsoft Device Application Development MVP, Jim now focuses on developing Android and iOS device applications. Jim’s passion is mentoring software developers. He blogs at hedgehogjim.wordpress.com.

Improving User Interaction with the Android Action Bar is the 7th course in the Pluralsight learning path for Android, and this month I am reviewing every course in this learning path.

ActionBar Interactivity

Adding Action Views

Action Views are the way we add interactivity to our action bars. They are interactive widgets which allow occasionally used UI items to be place on our ActionBar.

In this lesson we see a textbox example on the ActionBar.

Action Views replace an individual action item, can be persistently visible and can be automatically collapsed and expanded as we will see in this module.

Adding them is actually very simple. We add them to our menu’s XML layout:

android:actionViewClass="android.widget.SearchView"

Jim says the SearchView class is one of the most common choices, allowing users to perform searches from the ActionBar.

Demo: Adding Action Views

We add a SearchView in main_menu.xml, and when we run it we see a search icon on our ActionBar.

When we click it we get a search box.

Custom Action Views

We learn that the easiest way to create a custom action view is with a layout resource file.

We can associate the layout with the menuItem’s actionLayout attribute, as we’ll see in the next demo.

By default, an action view is visible all of the time. If we don’t want this we can change the showAsAction attribute:

android:showAsAction="ifRoom|collapseActionView"

Demo: Custom Action Views

Jim demonstrates how to add our own custom action view.

We begin looking at a layout file with a simple LinearLayout with TextView and EditText elements. This is what we want to appear in our action bar.

In main_menu.xml we see a new item added:

<item android:id="@+id/menuItemMyAction"
 android:icon="@android:drawable/ic_menu_sort_by_size"
android:title="MyAction"
android:showAsAction="ifRoom"
android:actionLayout="@layout/my_action_layout"
/>

We see that although this works, it doesn’t look good. We want it to look more like the search view we saw earlier and we can implement this by updating showAsAction

android:showAsAction="ifRoom|collapseActionView"

Programmatic Interaction

We often want to deal with interactions using code.

Jim says to do this we first need to get a reference to the individual menu item and we can use menu.findItem for that.

We can programmatically show and hide action views with expandActionView and collapseActionView.

We may also want to respond to an action view being shown or hidden. To do this we implement onActionExpandListener.

Jim asks how do we deal with the content of the action view?

The first thing we must do is use getActionView to get the reference we need:

View theView = menuItem.getActionView();

What we get depends on how the view is specified.

If we use the android:actionViewClass attribute, we get a reference to that class.

If we use the android:actionLayout attribute, we get a reference to the top layout node.

Note: Google have a Menus developer guide that describes many aspects of working with menus.

Demo: Interacting with ActionView Expand/Collapse

In our main layout, we add a button that will automatically expand/collapse our action view.

In onCreateOptionsMenu we use menu.findItem and assign the result to a class level variable _menuItemMyAction.

We see that in onButtonClick we can use _menuItemMyAction.isActionViewExpanded() which returns the answer to this question as a boolean.

With this known we invoke collapseActionView or expandActionView as appropriate.

Jim runs this in the emulator and we see it works exactly as we want.

The other thing we may want to do is respond to the action.

To do this we need to implement MenuItem.OnActionExpandListener. This adds a couple of additional methods to our class:

• onMenuItemActionExpand
• onMenuItemActionCollapse

To associate the interface with the menu item we can use setOnActionExpandListener.

We also add a Checkbox to our main layout, and see how to get a reference to its value.

With this known, we can update onMenuItemActionExpand and onMenuItemActionCollapse to allow/disallow the actions as appropriate.

We also see showToast used to toast “Expand” and “Collapse”.

Demo: Interacting with ActionView Contents

Now we want to interact with our EditText control, setting it to blank each time the user is about to enter a new entry.

Jim types “hello” into this textbox, collapses the view and expands it again.

The “hello” text is still displayed, and in many cases we will want this to be automatically cleared out so that the users doesn’t need to do this themselves.

Jim shows us how to get references to the action view and EditText control, and sets the text to “” when onMenuItemActionExpand is fired.

When the user presses the return button, we get a newline entered. This isn’t the behavior that the user expects.

Jim shows us how to change this behavior to grab the existing value and collapse the view.

The End

This concludes this course review, but there are many other Android courses available on Pluralsight and I have reviewed many of them for you. See Pluralsight course reviews for the full list.