AnDevCon SF 2013

The Action Bar,
Front to Back
Copyright © 2012 CommonsWare, LLC
Action Bar Options
●

Native Implementation
●

●

Works well if android:minSdkVersion is 11 or
higher

Backports
●

Offici...
Action Bar Options
●

AppCompat
●

Part of Android Support package

●

Pros
–
–

●

Google “seal of approval”
No additiona...
Action Bar Options
●

ActionBarSherlock
●

Independent open source backport

●

Pros
–
–

●

Used by countless projects ov...
Manifest Changes
●

<uses-sdk android:targetSdkVersion=”14”>
●
●

●

Action bar added
Holographic theme for widgets

andro...
Populating the Bar
●

res/menu/options.xml (or other name)
●

Root = <menu>

●

<menu> holds <item> elements

●

<item> de...
Populating the Bar
●

Activity Callbacks for Action Bar
●

onCreateOptionsMenu()
–

●

onOptionsItemSelected()
–

●

Where...
Toolbar Buttons
●

●

Puts item right in action bar, vs. overflow
Add android:showAsAction to <item> in
menu resource
●

●...
Fragments and the Action Bar
●

Step #1: Call setHasOptionsMenu(true)

●

Step #2: Implement onCreateOptionsMenu()
●

●

S...
Custom Action Bar Widgets
●

Option #1: Substitute Own Inflated Layout for
Standard Button
●

●

Add android:actionLayout ...
Custom Action Bar Widgets
●

Option #2: android:actionViewClass
●

Skip the layout, directly reference a View class

●

Of...
Custom Action Bar Widgets
●

Option #3: ActionProvider
●

●

Extend ActionProvider, implement
onCreateActionView()
Wire in...
ShareActionProvider
●

Stock Way to Share Content

●

Step #1: Add to <menu>

●

Step #2: Call setShareIntent()
●

●

●

O...
SearchView
●

The Classic Magnifying Glass

●

Approaches
●

Iconified by default, expanding on click

●

Expanded by defa...
Basic SearchView Usage
●

Step #1: Add to <menu>

●

Step #2: Configure in onCreateOptionsMenu()
●

Register listeners
–
–...
App Icon
●

Default = activity icon
●

●

Virtual menu choice: android.R.id.home
●

●

Optional android:logo in <applicati...
Action Bar Navigation
●

Option #1: Tabs
●

Use setNavigationMode() on ActionBar
–

NAVIGATION_MODE_TABS

●

Call addTab()...
Action Bar Navigation
●

Option #2: List
●

Use setNavigationMode() on ActionBar
–

●

NAVIGATION_MODE_LIST

Call setListN...
Action Bar Navigation
●

setCustomView()
●
●

●
●

You supply your own View or layout resource ID
Used in the navigation s...
Action Modes
●

Alternate Action Bar for Contextual Actions
●

Operations on selections
–
–

●

Multiple selections in a l...
Action Modes
●

ActionMode.Callback
●

●

Configure ActionMode in
onCreateActionMode()
onActionItemClicked() if user click...
Action Modes
●

Automatic Multiple-Choice Action Mode
●

CHOICE_MODE_MULTIPLE_MODAL and an

appropriate row layout
●

Chec...
Action Modes
●

Long-Press-Initiated Automatic Action Mode
●

Start off in single-choice mode

●

On long-click of item, t...
Styles and Themes
●

Theme.Holo / Theme.Holo.Light
●

●

Standard themes, standard color scheme

Can Style the Action Bar
...
What Else Is There?
●

Custom Action Providers

●

ActionBarDrawerToggle

●

Transparent/Translucent Action Bars

●

Check...
Upcoming SlideShare
Loading in …5
×

The Action Bar: Front to Back

1,194 views
990 views

Published on

from the AnDevCon San Francisco 2013 conference

Published in: Technology
0 Comments
1 Like
Statistics
Notes
  • Be the first to comment

No Downloads
Views
Total views
1,194
On SlideShare
0
From Embeds
0
Number of Embeds
3
Actions
Shares
0
Downloads
30
Comments
0
Likes
1
Embeds 0
No embeds

No notes for slide

The Action Bar: Front to Back

  1. 1. AnDevCon SF 2013 The Action Bar, Front to Back Copyright © 2012 CommonsWare, LLC
  2. 2. Action Bar Options ● Native Implementation ● ● Works well if android:minSdkVersion is 11 or higher Backports ● Official: AppCompat ● Popular: ActionBarSherlock Copyright © 2012 CommonsWare, LLC
  3. 3. Action Bar Options ● AppCompat ● Part of Android Support package ● Pros – – ● Google “seal of approval” No additional libraries (since you probably are already using the Android Support package) Cons – Released in August 2013 – Modest track record to date Copyright © 2012 CommonsWare, LLC
  4. 4. Action Bar Options ● ActionBarSherlock ● Independent open source backport ● Pros – – ● Used by countless projects over 18+ months Lots of material written about it Cons – Requires an Android library project – No Google “seal of approval” Copyright © 2012 CommonsWare, LLC
  5. 5. Manifest Changes ● <uses-sdk android:targetSdkVersion=”14”> ● ● ● Action bar added Holographic theme for widgets android:uiOptions=”splitActionBarWhenNarrow” ● Two halves of action bar, top and bottom ● Used for phones in portrait mode Copyright © 2012 CommonsWare, LLC
  6. 6. Populating the Bar ● res/menu/options.xml (or other name) ● Root = <menu> ● <menu> holds <item> elements ● <item> defines a single menu item – android:id – android:title – android:icon – android:visible – android:enabled Copyright © 2012 CommonsWare, LLC
  7. 7. Populating the Bar ● Activity Callbacks for Action Bar ● onCreateOptionsMenu() – ● onOptionsItemSelected() – ● Where you set up the basic options menu to use, via a MenuInflater Called when the user clicks on something in the action bar Default Behavior: Overflow ● Devices with MENU button – use to display ● Devices sans MENU button – … to display Copyright © 2012 CommonsWare, LLC
  8. 8. Toolbar Buttons ● ● Puts item right in action bar, vs. overflow Add android:showAsAction to <item> in menu resource ● ● ifRoom to indicate it can remain an options menu item if there is no room withText if you want icon & title Copyright © 2012 CommonsWare, LLC
  9. 9. Fragments and the Action Bar ● Step #1: Call setHasOptionsMenu(true) ● Step #2: Implement onCreateOptionsMenu() ● ● Slightly different method signature Step #3: Implement onOptionsItemSelected() Copyright © 2012 CommonsWare, LLC
  10. 10. Custom Action Bar Widgets ● Option #1: Substitute Own Inflated Layout for Standard Button ● ● Add android:actionLayout to <item> in menu resource Call getActionView() on MenuItem to configure at runtime Copyright © 2012 CommonsWare, LLC
  11. 11. Custom Action Bar Widgets ● Option #2: android:actionViewClass ● Skip the layout, directly reference a View class ● Often implements CollapsibleActionView interface – ● Allows automatic expansion to fill available space or collapse to allow other action bar items to be seen Built-In: SearchView Copyright © 2012 CommonsWare, LLC
  12. 12. Custom Action Bar Widgets ● Option #3: ActionProvider ● ● Extend ActionProvider, implement onCreateActionView() Wire in via android:actionProviderClass in menu resource ● Supports overflow with simplified UI ● Built-in – ShareActionProvider – MediaRouteActionProvider Copyright © 2012 CommonsWare, LLC
  13. 13. ShareActionProvider ● Stock Way to Share Content ● Step #1: Add to <menu> ● Step #2: Call setShareIntent() ● ● ● Once or many times, as appropriate Be sure to set MIME type! Optional ● Control share history ● Register OnShareTargetSelectedListener, to update UI Copyright © 2012 CommonsWare, LLC
  14. 14. SearchView ● The Classic Magnifying Glass ● Approaches ● Iconified by default, expanding on click ● Expanded by default – Good for tablets, particularly in landscape Copyright © 2012 CommonsWare, LLC
  15. 15. Basic SearchView Usage ● Step #1: Add to <menu> ● Step #2: Configure in onCreateOptionsMenu() ● Register listeners – – ● ● OnQueryTextListener OnCloseListener Other settings Step #3: Respond to Events ● E.g., manage a ListView filter Copyright © 2012 CommonsWare, LLC
  16. 16. App Icon ● Default = activity icon ● ● Virtual menu choice: android.R.id.home ● ● Optional android:logo in <application> to supply alternative image Handle in onOptionsItemSelected() setDisplayHomeAsUpEnabled() ● ● Adds arrowhead Handling “up navigation” well is beyond the scope of this presentation Copyright © 2012 CommonsWare, LLC
  17. 17. Action Bar Navigation ● Option #1: Tabs ● Use setNavigationMode() on ActionBar – NAVIGATION_MODE_TABS ● Call addTab() to add a tab ● Pros: easy to set up, automatic fragment support ● Cons – May appear on separate row – May be converted into list navigation Copyright © 2012 CommonsWare, LLC
  18. 18. Action Bar Navigation ● Option #2: List ● Use setNavigationMode() on ActionBar – ● NAVIGATION_MODE_LIST Call setListNavigationCallbacks() to define Spinner contents and listener Copyright © 2012 CommonsWare, LLC
  19. 19. Action Bar Navigation ● setCustomView() ● ● ● ● You supply your own View or layout resource ID Used in the navigation space on the action bar, instead of tabs or Spinner Example: AutoCompleteTextView for browser getCustomView() to retrieve inflated layout for runtime configuration Copyright © 2012 CommonsWare, LLC
  20. 20. Action Modes ● Alternate Action Bar for Contextual Actions ● Operations on selections – – ● Multiple selections in a list Selected text in a TextView, EditText, WebView, etc. Replacement for context menu Copyright © 2012 CommonsWare, LLC
  21. 21. Action Modes ● ActionMode.Callback ● ● Configure ActionMode in onCreateActionMode() onActionItemClicked() if user clicks a toolbar button ● finish() the ActionMode when done ● Clean up in onDestroyActionMode() Copyright © 2012 CommonsWare, LLC
  22. 22. Action Modes ● Automatic Multiple-Choice Action Mode ● CHOICE_MODE_MULTIPLE_MODAL and an appropriate row layout ● Checking item toggles on action mode with your supplied MultiChoiceModeListener callback – Serves as ActionBar.Callback, plus onItemCheckedStateChanged() for check/uncheck events Copyright © 2012 CommonsWare, LLC
  23. 23. Action Modes ● Long-Press-Initiated Automatic Action Mode ● Start off in single-choice mode ● On long-click of item, toggle into CHOICE_MODE_MULTIPLE_MODAL ● ● When action mode destroyed, switch back to single-choice mode Need to remember choice mode across configuration changes! Copyright © 2012 CommonsWare, LLC
  24. 24. Styles and Themes ● Theme.Holo / Theme.Holo.Light ● ● Standard themes, standard color scheme Can Style the Action Bar ● Easy: Action Bar Style Generator – ● http://jgilfelt.github.io/android-actionbarstylegenerator More power: DIY – https://developer.android.com/training/basics/actionbar /styling.html Copyright © 2012 CommonsWare, LLC
  25. 25. What Else Is There? ● Custom Action Providers ● ActionBarDrawerToggle ● Transparent/Translucent Action Bars ● Checkable Action Items ● Long-Press “Tooltip” Help ● And more! Copyright © 2012 CommonsWare, LLC

×