SoFunction
Updated on 2024-10-30

Getting Started Tutorial for Writing Action bar in Android Application Development

From Android 3.0 onwards, in addition to our focus on explaining the Fragment, Action Bar is also an important content, Action Bar is mainly used in place of the traditional title bar, for Android tablet devices with a larger screen and its title to use Action Bar to design can show more rich content, easy to manipulate.

The main functions of the Action Bar include.

1. Display options menu
2. Provide tabs to switch the way the navigation function, you can switch more than one fragment.
3. Provide drop-down navigation entries.
4. Provide an interactive activity view instead of option entries
5. Use the program's icon as a navigational action to return to the Home home screen or up.

Tips in your program to apply ActionBar need to pay attention to a few points, SDK and ultimately running firmware must be Android 3.0 that honeycomb, in the file of the uses-sdk element to add android: minSdkVersion or android: targetSdkVersion, similar to the

< manifest xmlns:andro 
package="" 
android:versionCode="1" 
android:versionName="1.0"> 
< uses-sdk android:minSdkVersion="honeycomb" /> 
< application ... > 
 
< /application> 
< /manifest> 


If you need to hide the Action Bar you can set the theme style to NoTitleBar in the properties of your Activity in your manifest file, the following code before 3.0 is to hide the title, and after 3.0 is to hide the ActionBar, the code is.

< activity android:theme="@android:style/"> 

I. Adding Activity Items Action Items

For Action Items you can see in the picture below that the right part of the title of Android 3.0 can be turned into a toolbar, and the following Save and Delete are the two Action Items.

Here is the code for a layout file for a menu

< ?xml version="1.0" encoding="utf-8"?> 
< menu xmlns:andro> 
< item android: 
android:icon="@drawable/ic_menu_save" 
android:title="@string/menu_save" 
android:showAsAction="ifRoom|withText" /> 
< /menu> 

And other code similar to Menu in Activity, such as

@Override 
public boolean onOptionsItemSelected(MenuItem item) { 
switch (()) { 
case : 
// Execute the following Intent when the Action Bar's icon is clicked
Intent intent = new Intent(this, ); 
startActivity(intent); 
break; 
} 
return (item); 
} 

For ActionBar creation, you can override the onStart method in your Activity:.

@Override 
protected void onStart() { 
(); 
ActionBar actionBar = (); 
(ActionBar.DISPLAY_HOME_AS_UP, ActionBar.DISPLAY_HOME_AS_UP); 
} 

When calling getActionBar in your Activity's onCreate, be aware that it must be called after setContentView.

Second, add the activity view Action View

For ActionView, we can customize the searchview layout in the menu's layout file usage as follows:

< item android: 
android:title="Search" 
android:icon="@drawable/ic_menu_search" 
android:showAsAction="ifRoom" 
android:actionLayout="@layout/searchview" /> 

You can also directly specify the SearchView control in the Android system, then the code for menu"_search should be written like this.

< item android: 
android:title="Search" 
android:icon="@drawable/ic_menu_search" 
android:showAsAction="ifRoom" 
android:actionViewClass="" /> 

We note that the above two methods in an attribute is actionLayout to develop a layout xml layout file, an actionViewClass to specify a class, the final call can be responded to in Activity onCreateOptionsMenu method to map the menu layout can be.

@Override 
public boolean onCreateOptionsMenu(Menu menu) { 
getMenuInflater().inflate(, menu); 
SearchView searchView = (SearchView) (.menu_search).getActionView(); 
return (menu); 
} 

Third, add tabs Tabs

Implementing tabs in ActionBar can be achieved by , overriding the onTabSelected, onTabUnselected, and onTabReselected methods to associate a Fragment. code as follows.

private class MyTabListener implements  { 
 private TabContentFragment mFragment; 
 public TabListener(TabContentFragment fragment) { 
 mFragment = fragment; 
 } @Override 
 public void onTabSelected(Tab tab, FragmentTransaction ft) { 
 (.fragment_content, mFragment, null); 
 } 
 @Override 
 public void onTabUnselected(Tab tab, FragmentTransaction ft) { 
 (mFragment); 
 } 
 @Override 
 public void onTabReselected(Tab tab, FragmentTransaction ft) { 
 } 
 
} 

Next we create the ActionBar in the Activity with the following code ;)

@Override 
protected void onCreate(Bundle savedInstanceState) { 
(savedInstanceState); 
setContentView(); 
final ActionBar actionBar = getActionBar(); //Tip the getActionBar method must come after setContentView.
(ActionBar.NAVIGATION_MODE_TABS); 
(0, ActionBar.DISPLAY_SHOW_TITLE); 
Fragment artistsFragment = new ArtistsFragment(); 
(().setText(.tab_artists).setTabListener(new TabListener(artistsFragment))); 
Fragment albumsFragment = new AlbumsFragment(); 
(().setText(.tab_albums).setTabListener(new TabListener(albumsFragment))); 
}

IV. Add Drop-down Navigation.

Create a SpinnerAdapter to provide drop-down options, and the Tab method is different from Drop-down only need to modify the mode of setNavigationMode, change ActionBar.NAVIGATION_MODE_TABS to ActionBar.NAVIGATION_MODE_LIST. LIST, the final improved code is

ActionBar actionBar = getActionBar(); 
(ActionBar.NAVIGATION_MODE_LIST); 
(mSpinnerAdapter, mNavigationCallback); 

Above we bind a SpinnerAdapter control through the setListNavigationCallbacks method, the specific OnNavigationListener code example is;.

mOnNavigationListener = new OnNavigationListener() { 
 String[] strings = getResources().getStringArray(.action_list); 
 @Override 
 public boolean onNavigationItemSelected(int position, long itemId) { 
 ListContentFragment newFragment = new ListContentFragment(); 
 FragmentTransaction ft = openFragmentTransaction(); 
 (.fragment_container, newFragment, strings[position]); 
 (); 
 return true; 
} 
 
}; 


And the code for one of the ListContentFragment is.

public class ListContentFragment extends Fragment { 
private String mText; 
 
@Override 
public void onAttach(Activity activity) { 
(activity); 
mText = getTag(); 
} 
 
@Override 
public View onCreateView(LayoutInflater inflater, ViewGroup container, 
Bundle savedInstanceState) { 
TextView text = new TextView(getActivity()); 
(mText); 
return text; 
} 
} 

V. Implementation of switching Tabs tabs ;)
  
Activity Code:

public class ActionBarTabs extends Activity { 
 
@Override 
protected void onCreate(Bundle savedInstanceState) { 
(savedInstanceState); 
setContentView(.action_bar_tabs); 
} 
 
public void onAddTab(View v) { 
final ActionBar bar = getActionBar(); 
final int tabCount = (); 
final String text = "Tab " + tabCount; 
 
(().setText(text) 
.setTabListener(new TabListener(new TabContentFragment(text)))); 
} 
 
public void onRemoveTab(View v) { 
final ActionBar bar = getActionBar(); 
(() - 1); 
} 
 
public void onToggleTabs(View v) { 
final ActionBar bar = getActionBar(); 
 
if (() == ActionBar.NAVIGATION_MODE_TABS) { 
(ActionBar.NAVIGATION_MODE_STANDARD); 
 
(ActionBar.DISPLAY_SHOW_TITLE, ActionBar.DISPLAY_SHOW_TITLE); 
} else { 
(ActionBar.NAVIGATION_MODE_TABS); 
(0, ActionBar.DISPLAY_SHOW_TITLE); 
} 
} 
 
public void onRemoveAllTabs(View v) { 
getActionBar().removeAllTabs(); 
} 
 
private class TabListener implements  { 
private TabContentFragment mFragment; 
public TabListener(TabContentFragment fragment) { 
 
mFragment = fragment; 
} 
 
public void onTabSelected(Tab tab, FragmentTransaction ft) { 
(.fragment_content, mFragment, ()); 
} 
 
 
public void onTabUnselected(Tab tab, FragmentTransaction ft) { 
(mFragment); 
} 
 
public void onTabReselected(Tab tab, FragmentTransaction ft) { 
(, "Reselected!", Toast.LENGTH_SHORT).show(); 
} 
 
} 
 
private class TabContentFragment extends Fragment { 
private String mText; 
public TabContentFragment(String text) { 
mText = text; 
} 
 
public String getText() { 
return mText; 
} 
 
@Override 
public View onCreateView(LayoutInflater inflater, ViewGroup container, 
Bundle savedInstanceState) { 
View fragView = (.action_bar_tab_content, container, false); 
TextView text = (TextView) (); 
(mText); 
return fragView; 
} 
} 
} 

The layout file action_bar_tabs.xml code involved is.

< ?xml version="1.0" encoding="utf-8"?> 
< LinearLayout xmlns:andro 
 
android:layout_width="match_parent" 
android:layout_height="match_parent" 
android:orientation="vertical"> 
 
< FrameLayout android: 
android:layout_width="match_parent" 
android:layout_height="0dip" 
android:layout_weight="1" /> 
 
< LinearLayout android:layout_width="match_parent" 
android:layout_height="0dip" 
android:layout_weight="1" 
android:orientation="vertical"> 
 
< Button android: 
android:layout_width="wrap_content" 
android:layout_height="wrap_content" 
android:text="@string/btn_add_tab" 
android:onClick="onAddTab" /> 
 
< Button android: 
android:layout_width="wrap_content" 
android:layout_height="wrap_content" 
android:text="@string/btn_remove_tab" 
android:onClick="onRemoveTab" /> 
 
< Button android: 
android:layout_width="wrap_content" 
android:layout_height="wrap_content" 
android:text="@string/btn_toggle_tabs" 
android:onClick="onToggleTabs" /> 
 
< Button android: 
android:layout_width="wrap_content" 
android:layout_height="wrap_content" 
android:text="@string/btn_remove_all_tabs" 
android:onClick="onRemoveAllTabs" /> 
< /LinearLayout> 
 
< /LinearLayout> 

Layout file action_bar_tab_content.xml.

< ?xml version="1.0" encoding="utf-8"?> 
< TextView xmlns:andro 
 
android: 
android:layout_width="wrap_content" 
android:layout_height="wrap_content" />