An entry-level tutorial written by Action bar in Android Application Development. It is used for android application development.
In addition to Fragment, which we have focused on since Android 3.0, Action Bar is also an important part. Action Bar is mainly used to replace the traditional title Bar, for an Android tablet device, the title of the screen is larger. The Action Bar is used to design and display more rich content for easy control.
Action Bar provides the following functions:
1. Display option menu
2. Provides the tab switch mode navigation function, you can switch multiple fragment.
3. Provides drop-down navigation entries.
4. Provide Interactive Activity view instead of option entries
5. Use the program icon to return to the Home screen or navigate up.
Note the following points when applying ActionBar in your program. The SDK and final running firmware must be Android 3.0, that is, honeycomb, in androidmanifest. add android: minSdkVersion or android: targetSdkVersion to the uses-sdk element in the xml file, similar
< manifest xmlns:android="http://schemas.android.com/apk/res/android" package="eoe.android.cwj" 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 topic style to NoTitleBar in your Activity attributes. In your manifest file, the following code hides the title before 3.0, the ActionBar is hidden after 3.0, and the code is:
< activity android:theme="@android:style/Theme.NoTitleBar">
1. Add an activity entry Action Items
For activity entries, you can see that the right part of the title of Android 3.0 can be changed to the toolbar. The Save and Delete Items below are two Action Items activity entries.
The following is the layout file code of a menu.
< ?xml version="1.0" encoding="utf-8"?> < menu xmlns:android="http://schemas.android.com/apk/res/android"> < item android:id="@+id/menu_add" android:icon="@drawable/ic_menu_save" android:title="@string/menu_save" android:showAsAction="ifRoom|withText" /> < /menu>
Other code is similar to the Menu in the Activity, such
@ Override public boolean onOptionsItemSelected (MenuItem item) {switch (item. getItemId () {case android. r. id. home: // when the Action Bar icon is clicked, execute the following Intent intent = new Intent (this, Android123.class); startActivity (intent); break;} return super. onOptionsItemSelected (item );}
To create an ActionBar, you can rewrite the onStart method in your Activity:
@Override protected void onStart() { super.onStart(); ActionBar actionBar = this.getActionBar(); actionBar.setDisplayOptions(ActionBar.DISPLAY_HOME_AS_UP, ActionBar.DISPLAY_HOME_AS_UP); }
When calling the getActionBar method in onCreate of your Activity, note that you must call setContentView.
2. Add activity View Action View
For ActionView, We can customize the searchview layout in the layout file of menu, as shown below:
< item android:id="@+id/menu_search" 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. In this case, the menu "_ search code should be written as follows:
< item android:id="@+id/menu_search" android:title="Search" android:icon="@drawable/ic_menu_search" android:showAsAction="ifRoom" android:actionViewClass="android.widget.SearchView" />
Note that one of the preceding two methods is actionLayout to create a layout xml layout file, and the other is actionViewClass to specify a class, the final call can respond to the onCreateOptionsMenu method in the Activity to map the menu layout.
@Override public boolean onCreateOptionsMenu(Menu menu) { getMenuInflater().inflate(R.menu.options, menu); SearchView searchView = (SearchView) menu.findItem(R.id.menu_search).getActionView(); return super.onCreateOptionsMenu(menu); }
3. Add Tag Tabs
The implementation tab in ActionBar can implement android. app. ActionBar. TabListener, and rewrite onTabSelected, onTabUnselected, and onTabReselected methods to associate Fragment. The Code is as follows:
private class MyTabListener implements ActionBar.TabListener { private TabContentFragment mFragment; public TabListener(TabContentFragment fragment) { mFragment = fragment; } @Override public void onTabSelected(Tab tab, FragmentTransaction ft) { ft.add(R.id.fragment_content, mFragment, null); } @Override public void onTabUnselected(Tab tab, FragmentTransaction ft) { ft.remove(mFragment); } @Override public void onTabReselected(Tab tab, FragmentTransaction ft) { } }
Next we will create an ActionBar in the Activity, the Code is as follows;
@ Override protected void onCreate (Bundle savedInstanceState) {super. onCreate (savedInstanceState); setContentView (R. layout. main); final ActionBar actionBar = getActionBar (); // The system prompts that the getActionBar method must be behind the setContentView actionBar. setNavigationMode (ActionBar. NAVIGATION_MODE_TABS); actionBar. setDisplayOptions (0, ActionBar. DISPLAY_SHOW_TITLE); Fragment artistsFragment = new ArtistsFragment (); actionBar. addTab (actionBar. newTab (). setText (R. string. tab_artists ). setTabListener (new TabListener (artistsFragment); Fragment albumsFragment = new AlbumsFragment (); actionBar. addTab (actionBar. newTab (). setText (R. string. tab_albums ). setTabListener (new TabListener (albumsFragment )));}
4. Add Drop-down Navigation:
Create a SpinnerAdapter and provide the Drop-down option. Unlike the Tab mode, you only need to modify the setNavigationMode mode and change ActionBar. NAVIGATION_MODE_TABS to ActionBar. NAVIGATION_MODE_LIST. The improved code is
ActionBar actionBar = getActionBar(); actionBar.setNavigationMode(ActionBar.NAVIGATION_MODE_LIST); actionBar.setListNavigationCallbacks(mSpinnerAdapter, mNavigationCallback);
The above code binds a SpinnerAdapter control through the setListNavigationCallbacks method. The specific OnNavigationListener code example is;
mOnNavigationListener = new OnNavigationListener() { String[] strings = getResources().getStringArray(R.array.action_list); @Override public boolean onNavigationItemSelected(int position, long itemId) { ListContentFragment newFragment = new ListContentFragment(); FragmentTransaction ft = openFragmentTransaction(); ft.replace(R.id.fragment_container, newFragment, strings[position]); ft.commit(); return true; } };
The ListContentFragment code is:
public class ListContentFragment extends Fragment { private String mText; @Override public void onAttach(Activity activity) { super.onAttach(activity); mText = getTag(); } @Override public View onCreateView(LayoutInflater inflater, ViewGroup container, Bundle savedInstanceState) { TextView text = new TextView(getActivity()); text.setText(mText); return text; } }
5. Switch the Tabs label;
Activity Code:
public class ActionBarTabs extends Activity { @Override protected void onCreate(Bundle savedInstanceState) { super.onCreate(savedInstanceState); setContentView(R.layout.action_bar_tabs); } public void onAddTab(View v) { final ActionBar bar = getActionBar(); final int tabCount = bar.getTabCount(); final String text = "Tab " + tabCount; bar.addTab(bar.newTab().setText(text) .setTabListener(new TabListener(new TabContentFragment(text)))); } public void onRemoveTab(View v) { final ActionBar bar = getActionBar(); bar.removeTabAt(bar.getTabCount() - 1); } public void onToggleTabs(View v) { final ActionBar bar = getActionBar(); if (bar.getNavigationMode() == ActionBar.NAVIGATION_MODE_TABS) { bar.setNavigationMode(ActionBar.NAVIGATION_MODE_STANDARD); bar.setDisplayOptions(ActionBar.DISPLAY_SHOW_TITLE, ActionBar.DISPLAY_SHOW_TITLE); } else { bar.setNavigationMode(ActionBar.NAVIGATION_MODE_TABS); bar.setDisplayOptions(0, ActionBar.DISPLAY_SHOW_TITLE); } } public void onRemoveAllTabs(View v) { getActionBar().removeAllTabs(); } private class TabListener implements ActionBar.TabListener { private TabContentFragment mFragment; public TabListener(TabContentFragment fragment) { mFragment = fragment; } public void onTabSelected(Tab tab, FragmentTransaction ft) { ft.add(R.id.fragment_content, mFragment, mFragment.getText()); } public void onTabUnselected(Tab tab, FragmentTransaction ft) { ft.remove(mFragment); } public void onTabReselected(Tab tab, FragmentTransaction ft) { Toast.makeText(ActionBarTabs.this, "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 = inflater.inflate(R.layout.action_bar_tab_content, container, false); TextView text = (TextView) fragView.findViewById(R.id.text); text.setText(mText); return fragView; } } }
The code of the layout file action_bar_tabs.xml involved is:
< ?xml version="1.0" encoding="utf-8"?> < LinearLayout xmlns:android="http://schemas.android.com/apk/res/android" android:layout_width="match_parent" android:layout_height="match_parent" android:orientation="vertical"> < FrameLayout android:id="@+id/fragment_content" 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:id="@+id/btn_add_tab" android:layout_width="wrap_content" android:layout_height="wrap_content" android:text="@string/btn_add_tab" android:onClick="onAddTab" /> < Button android:id="@+id/btn_remove_tab" android:layout_width="wrap_content" android:layout_height="wrap_content" android:text="@string/btn_remove_tab" android:onClick="onRemoveTab" /> < Button android:id="@+id/btn_toggle_tabs" android:layout_width="wrap_content" android:layout_height="wrap_content" android:text="@string/btn_toggle_tabs" android:onClick="onToggleTabs" /> < Button android:id="@+id/btn_remove_all_tabs" 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:android="http://schemas.android.com/apk/res/android" android:id="@+id/text" android:layout_width="wrap_content" android:layout_height="wrap_content" />
Articles you may be interested in:
- Flexible Use of ActionBar and ViewPager in Android to switch pages
- Code setting style of ActionBar and menu in Android
- Two methods to enable actionbar in android
- Android custom ActionBar instance