Getting Started tutorial on action Bar in Android app development

Source: Internet
Author: User
Tags home screen
Starting with Android 3.0 In addition to our focus on the fragment, Action Bar is also an important content, the action bar is mainly used to replace the traditional title bar, for Android tablet device for the larger screen its title use Action Bar to design to show more rich content, easy to control.

The main functions of the Action bar include:

1. Display the Options menu
2. Provide the navigation function of the switch mode of the tab page, can switch multiple fragment.
3. Provide a drop-down navigation entry.
4. Provide interactive activity view instead of option entry
5. Use the program's icon as the back home screen or up navigation action.

Tips for applying Actionbar in your program there are a few points to note, the SDK and the final running firmware must be Android 3.0, or honeycomb, to add Android to the USES-SDK element in the Androidmanifest.xml file: Minsdkversion or android:targetsdkversion, 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 ... >  


If you need to hide the action bar to set the theme style for Notitlebar in your activity's properties in your manifest file, the following code hides the title before 3.0, and after 3.0 it hides Actionbar, and the code is:

First, add the active item action items

For the active item, you can see the right part of the title of Android 3.0 as a toolbar, and the following save and delete are the two action items activity entries.

Below is a menu layout file code

Other code is similar to the menu in activity, such as

For the creation of Actionbar, you can override the OnStart method in your activity:

You need to be aware that you must call Getactionbar in the oncreate of your activity when you call Setcontentview.

Second, add the active view action

For Actionview, we can customize the Searchview layout in the menu layout file using, as follows:

You can also specify the Searchview control in the Android system directly, then the menu "_search" code to write this way:

It is important to note that one of the two methods above is actionlayout to develop an XML layout file, one that specifies a class Actionviewclass The final call can map the menu layout in response to the Oncreateoptionsmenu method in activity.

Third, add the label Tabs

Implementing a tab in ActionBar can implement Android.app.ActionBar.TabListener, overriding Ontabselected, Ontabunselected and ontabreselected methods to correlate 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 create 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 (); Hint Getactionbar method must be in Setcontentview back 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) )); }

Iv. Add a drop-down navigation drop-down Navigation:

Creating a Spinneradapter provides a drop-down option, and the tab mode is different drop-down only need to modify the Setnavigationmode mode, will Actionbar.navigation_mode_ Tabs changed to Actionbar.navigation_mode_list, and the final improved code is

Above we bind a Spinneradapter control through the Setlistnavigationcallbacks method, the concrete 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; }  


And the code for the Listcontentfragment is:

public class Listcontentfragment extends Fragment {private String mText;  @Override public void Onattach (activity activity) {Super.onattach (activity); mText = Gettag ();}  

Five, realize the switch tabs label;

Activity code:

public class Actionbartabs extends Activity {@Override protected void onCreate (Bundle savedinstancestate) {Super.oncrea Te (savedinstancestate); Setcontentview (R.layout.action_bar_tabs); public void Onaddtab (View v) {final ActionBar bar = Getactionbar (); final int tabcount = Bar.gettabcount (); final Stri  ng Text = "tab" + Tabcount; Bar.addtab (Bar.newtab (). SetText (text). Settablistener (New Tablistener (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) {m Text = text;    } public String GetText () {return mText;} @Override public view Oncreateview (Layoutinflater inflater, ViewGroup container, Bundle savedinstancestate) {View Fragvi ew = inflater.inflate (R.layout.action_bar_tab_content, container, false); TextView Text = (TextView) Fragview.findviewbyid (R.id.text); Text.settext (MText); return fragview;  } } }

The Action_bar_tabs.xml code for the layout file 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:o nclick= "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"  
  • Related Article

    Contact Us

    The content source of this page is from Internet, which doesn't represent Alibaba Cloud's opinion; products and services mentioned on that page don't have any relationship with Alibaba Cloud. If the content of the page makes you feel confusing, please write us an email, we will handle the problem within 5 days after receiving your email.

    If you find any instances of plagiarism from the community, please send an email to: info-contact@alibabacloud.com and provide relevant evidence. A staff member will contact you within 5 working days.

    A Free Trial That Lets You Build Big!

    Start building with 50+ products and up to 12 months usage for Elastic Compute Service

    • Sales Support

      1 on 1 presale consultation

    • After-Sales Support

      24/7 Technical Support 6 Free Tickets per Quarter Faster Response

    • Alibaba Cloud offers highly flexible support services tailored to meet your exact needs.