android中的ActionBar

  其实就在官网上就有答案，自己疏忽再加上资料繁多。寻了许久，经过指点。终于找到：

To enable split action bar, simply add uiOptions="splitActionBarWhenNarrow" to your <activity> or <application> manifest element.（http://developer.android.com/guide/topics/ui/actionbar.html）Using split action bar 标题下。

如果你想拥有上图的那种效果，Fragment（关于Fragment的内容，见上篇）在menuItem的下面显示，在manifest.xml文件里在<activity>或者<application>里加上uiOptions="splitActionBarWhenNarrow" 即可。

         注：本人在4.0版本平板上不能达到此效果，在4.0手机上可以实现。在平板上，效果类似如下：

        ，

如果fragment增多，不会分裂出现上图效果，而使用下拉列表来显示Fragment。

       下面开始正题。

简介

1.         ActionBar是一个显示在屏幕顶部的控件，它包括了在左边显示的应用的logo图标和右边操作菜单的可见项。
2.        我们可以选择可见的操作菜单可见项，不可见项会以下拉列表的形式呈现出来。（见上图相机图标右侧，点击出现下拉列 表，显示没有直接显示出来的操作菜单可见项）
3.        ActionBar为Fragment之间提供标签导航

添加ActionBar

1.      不需要导入ActionBar，因为在android3.0或者以上版本中，ActionBar已经默认的包含在Activity中
2.      在Android3.0的默认主题“holographic”中，已经创造了ActionBar
3.      当android:minSdkVersion 或者 android:targetSdkVersion 属性被设置成11或者更高时，应用会被认为是Android3.0版本（默认含有ActionBar）

去除ActionBar  

1.      我们可以通过把主题设置为Theme.Holo.NoActionBar为一个Activity去除掉ActionBar。                                                                                        <activity android:theme="@android:style/Theme.Holo.NoActionBar">
2.      我们也可以通过在代码中调用show()或者hide()方法来相应的显示或者隐藏ActionBar

添加Action Item

               每一个操作菜单的菜单项都可以成为ActionBar中的一个Action Item

       参考代码如下：

      ActionBarDemoActivity.java：

[java] view plain copy

1. public class ActionBarDemoActivity extends Activity  
2. {  
3.     /** Called when the activity is first created. */  
4.     @Override  
5.     public void onCreate(Bundle savedInstanceState)  
6.     {  
7.         super.onCreate(savedInstanceState);  
8.         setContentView(R.layout.main);  
9.         Button showBt = (Button) findViewById(R.id.showBt);  
10.         showBt.setOnClickListener(new OnClickListener()  
11.         {  
12.             public void onClick(View view)  
13.             {  
14.                 ActionBar actionBar = getActionBar();  
15.                 actionBar.show();  
16.             }  
17.         });  
18.   
19.     }  
20.   
21.     public boolean onCreateOptionsMenu(Menu menu)  
22.     {  
23.         super.onCreateOptionsMenu(menu);  
24.         MenuItem add = menu.add(0, 1, 0, "Save");  
25.         MenuItem open = menu.add(0, 2, 1, "Open");  
26.         MenuItem close = menu.add(0, 3, 2, "Close");  
27.         add.setShowAsAction(MenuItem.SHOW_AS_ACTION_IF_ROOM);  
28.         open.setShowAsAction(MenuItem.SHOW_AS_ACTION_IF_ROOM);  
29.         close.setShowAsAction(MenuItem.SHOW_AS_ACTION_IF_ROOM);  
30.         return true;  
31.     }  
32. }  

        main.xml

[html] view plain copy

1. <?xml version="1.0" encoding="utf-8"?>  
2. <LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"  
3.     android:layout_width="fill_parent"  
4.     android:layout_height="fill_parent"  
5.     android:orientation="horizontal" >  
6.   
7.     <Button  
8.         android:id="@+id/hideBt"  
9.         android:layout_width="wrap_content"  
10.         android:layout_height="wrap_content"  
11.         android:text="Hide The Action Bar" >  
12.     </Button>  
13.   
14.     <Button  
15.         android:id="@+id/showBt"  
16.         android:layout_width="wrap_content"  
17.         android:layout_height="wrap_content"  
18.         android:text="Show The Action Bar" >  
19.     </Button>  
20.   
21. </LinearLayout>  

      效果图如下：

 

添加活动项（Action Item）

        当使用xml文件创建菜单（menu）时，可以标记这些菜单项作为想要实现的Action Item

代码如下：

ActionBarXMLActivity：

      

[java] view plain copy

1. public class ActionBarXMLActivity extends Activity {  
2.     /** Called when the activity is first created. */  
3.     @Override  
4.     public void onCreate(Bundle savedInstanceState) {  
5.         super.onCreate(savedInstanceState);  
6.         setContentView(R.layout.main);  
7.     }  
8.   
9.     @Override  
10.     public boolean onCreateOptionsMenu(Menu menu)  
11.     {  
12.         MenuInflater inflater = getMenuInflater();  
13.         inflater.inflate(R.menu.optionsmenu, menu);  
14.         return true;  
15.     }  
16. }  

   

optionsmenu.xml:

[html] view plain copy

1. <?xml version="1.0" encoding="utf-8"?>  
2. <menu xmlns:android="http://schemas.android.com/apk/res/android" >  
3.   
4.     <item  
5.         android:id="@+id/item1"  
6.         android:orderInCategory="1"  
7.         android:showAsAction="ifRoom|withText"  
8.         android:title="@string/save"/>  
9.   
10.     <item  
11.         android:id="@+id/item1"  
12.         android:orderInCategory="2"  
13.         android:showAsAction="ifRoom|withText"  
14.         android:title="@string/edit"/>  
15.   
16.     <item  
17.         android:id="@+id/item1"  
18.         android:orderInCategory="3"  
19.         android:showAsAction="ifRoom|withText"  
20.         android:title="@string/about"/>  
21.   
22.     <item  
23.         android:id="@+id/item1"  
24.         android:orderInCategory="4"  
25.         android:showAsAction="ifRoom|withText"  
26.         android:title="@string/help"/>  
27.   
28. </menu>  

效果图：

菜单项过多溢出

       当创建一个ActionBar拥有太多的Action item以至于没有足够的控件来显示会在屏幕的右上角出现一个溢出菜单项，可以通过它来访问溢出部分菜单。

       代码示例：

       其Activity代码如上（ActionBarXMLActivity）

       溢出菜单xml

[html] view plain copy

1. <?xml version="1.0" encoding="utf-8"?>  
2. <menu xmlns:android="http://schemas.android.com/apk/res/android" >  
3.   
4.     <item  
5.         android:id="@+id/item1"  
6.         android:orderInCategory="1"  
7.         android:showAsAction="ifRoom|withText"  
8.         android:title="@string/save"/>  
9.     <item  
10.         android:id="@+id/item2"  
11.         android:orderInCategory="2"  
12.         android:showAsAction="ifRoom|withText"  
13.         android:title="@string/edit"/>  
14.     <item  
15.         android:id="@+id/item3"  
16.         android:orderInCategory="3"  
17.         android:showAsAction="ifRoom|withText"  
18.         android:title="@string/about"/>  
19.     <item  
20.         android:id="@+id/item4"  
21.         android:orderInCategory="4"  
22.         android:showAsAction="ifRoom|withText"  
23.         android:title="@string/help"/>  
24.     <item  
25.         android:id="@+id/item5"  
26.         android:orderInCategory="5"  
27.         android:showAsAction="ifRoom|withText"  
28.         android:title="@string/file"/>  
29.     <item  
30.         android:id="@+id/item6"  
31.         android:orderInCategory="6"  
32.         android:showAsAction="ifRoom|withText"  
33.         android:title="@string/run"/>  
34.     <item  
35.         android:id="@+id/item7"  
36.         android:orderInCategory="7"  
37.         android:showAsAction="ifRoom|withText"  
38.         android:title="@string/source"/>  
39.     <item  
40.         android:id="@+id/item8"  
41.         android:orderInCategory="8"  
42.         android:showAsAction="ifRoom|withText"  
43.         android:title="@string/navigate"/>  
44.     <item  
45.         android:id="@+id/item9"  
46.         android:orderInCategory="9"  
47.         android:showAsAction="ifRoom|withText"  
48.         android:title="@string/search"/>  
49.     <item  
50.         android:id="@+id/item10"  
51.         android:orderInCategory="10"  
52.         android:showAsAction="ifRoom|withText"  
53.         android:title="@string/project"/>  
54.     <item  
55.         android:id="@+id/item11"  
56.         android:orderInCategory="11"  
57.         android:showAsAction="ifRoom|withText"  
58.         android:title="@string/refactor"/>  
59.     <item  
60.         android:id="@+id/item12"  
61.         android:orderInCategory="12"  
62.         android:showAsAction="ifRoom|withText"  
63.         android:title="@string/window"/>  
64.     <item  
65.         android:id="@+id/item13"  
66.         android:orderInCategory="13"  
67.         android:showAsAction="ifRoom|withText"  
68.         android:title="@string/help"/>  
69.   
70. </menu>  

其效果图如下：

使用带字的Action Item

1.         Action item 默认格式是如果菜单项含字和图标的话，只显示图标
2.         如果想要显示字的效果，在xml里如下设置：android:showAsAction="ifRoom|withText" 
3.         或者在代码里调用setShowAsAction()：setShowAsAction(MenuItem.SHOW_AS_ACTION_IF_ROOM)

Action事件

1.         ActionBar中一个菜单项（即Action item）的触发像以前版本中的活动菜单回调方法（onOptionsItemSelected()）一样。
2.         当用户选择一个Fragment的菜单项时，首先会调用Activity的onOptionsItemSelected()方法，如果该方法返回false，则调用Fragment实现的onOptionsItemSelected()方法。

应用图标

1.      默认情况下，应用图标在ActionBar的左侧
2.     当用户点击应用bar的时候，系统会调用你的Activity里面的onOptionsItemSelected() 方法里面的Android.R.id.Home ID(你的主ID)里定义的事件。我们可以重写这个方法，添加一个条件执行该行为：让它跳转到这个应用的主Activity而不是返回的主屏幕。
3.     如果选择返回应用的主activity，最好的方式是在创建的Intent中添加FLAG_ACTIVITY_CLEAR_TOP这个标签。
4.     使用这个FLAG_ACTIVITY_CLEAR_TOP标签，如果应用的主Activity已经在activity栈中存在，所有在其上的activity都会被销毁，然后主activity会到栈顶，而不用创建主Activity的的新实例。

[java] view plain copy

1. @Override  
2.     public boolean onOptionsItemSelected(MenuItem item)  
3.     {  
4.         switch (item.getItemId())  
5.         {  
6.         case android.R.id.home:  
7.             Intent intent = new Intent(this, MainActivity.class);  
8.             intent.addFlags(Intent.FLAG_ACTIVITY_CLEAR_TOP);  
9.             startActivity(intent);  
10.             return true;  
11.         default:  
12.             return super.onOptionsItemSelected(item);  
13.         }  
14.     }  

          当我们想实现用户点击ActionBar 图标后返回前一个activity，可以通过在Actionbar设置setDisplayHomeAsUpEnabled(true) 来实现。

[java] view plain copy

1. public class HomyUpActivity extends Activity {  
2.     /** Called when the activity is first created. */  
3.     @Override  
4.     public void onCreate(Bundle savedInstanceState) {  
5.         super.onCreate(savedInstanceState);  
6.         setContentView(R.layout.main);  
7.     }  
8.     @Override  
9.     protected void onStart() {  
10.         super.onStart();  
11.         ActionBar actionBar = this.getActionBar();  
12.         actionBar.setDisplayHomeAsUpEnabled(true);  
13.     }  
14.     @Override  
15.     public boolean onCreateOptionsMenu(Menu menu) {  
16.         MenuInflater inflater = getMenuInflater();  
17.         inflater.inflate(R.menu.optionsmenu, menu);  
18.         return true;  
19.     }  
20.   
21. }  

效果图：

添加活动视图

1.         我们也可以添加一个视图作为一个Action Item.我们可以通过在xml元素的android:actionLayout属性制定我们希望现实布局资源的ID（例如@layout/mysearchview)
2.         我们可以选择添加android:actionViewClass属性分配与完全限定的类名描述我们想要显示的视图(例如android.widget.SearchView)

代码示例：

optionsmenu.xml

[java] view plain copy

1. <?xml version="1.0" encoding="utf-8"?>  
2. <menu xmlns:android="http://schemas.android.com/apk/res/android" >  
3.   
4.     <item  
5.         android:id="@+id/item4"  
6.         android:orderInCategory="4"  
7.         android:showAsAction="ifRoom|withText"  
8.         android:title="@string/help"/>  
9.     <item  
10.         android:id="@+id/item5"  
11.         android:orderInCategory="5"  
12.         android:showAsAction="ifRoom|withText"  
13.         android:title="@string/file"/>  
14.     <item  
15.         android:id="@+id/search"  
16.         android:actionViewClass="android.widget.SearchView"  
17.         android:showAsAction="ifRoom"  
18.         android:title="Search"/>  
19.   
20. </menu>  

HomeUpActivity.java

[java] view plain copy

1. public class HomyUpActivity extends Activity {  
2.     /** Called when the activity is first created. */  
3.     @Override  
4.     public void onCreate(Bundle savedInstanceState) {  
5.         super.onCreate(savedInstanceState);  
6.         setContentView(R.layout.main);  
7.     }  
8.     @Override  
9.     protected void onStart() {  
10.         super.onStart();  
11.         ActionBar actionBar = this.getActionBar();  
12.         actionBar.setDisplayHomeAsUpEnabled(true);  
13.     }  
14.   
15.     @Override  
16.     public boolean onCreateOptionsMenu(Menu menu)  
17.     {  
18.         MenuInflater inflater = getMenuInflater();  
19.         inflater.inflate(R.menu.optionsmenu, menu);  
20.         return true;  
21.     }  
22. }  

效果图：

ActionBar 标签

1.         ActionBar可以现实选项卡供用户切换浏览该Activity中不同的Fragment
2.         每个标签都可以是一个图标或文本标题
   
   

代码示例：

       TabsActivity.java

[java] view plain copy

1. public class TabsActivity extends Activity  
2. {  
3.     /** Called when the activity is first created. */  
4.     @Override  
5.     public void onCreate(Bundle savedInstanceState)  
6.     {  
7.         super.onCreate(savedInstanceState);  
8.         setContentView(R.layout.main);  
9.         ActionBar bar = getActionBar();  
10.         bar.setNavigationMode(ActionBar.NAVIGATION_MODE_TABS);  
11.         ActionBar.Tab tabA = bar.newTab().setText("A Tab");  
12.         ActionBar.Tab tabB = bar.newTab().setText("B Tab");  
13.         ActionBar.Tab tabC = bar.newTab().setText("C Tab");  
14.         Fragment fragmentA = new AFragmentTab();  
15.         Fragment fragmentB = new BFragmentTab();  
16.         Fragment fragmentC = new CFragmentTab();  
17.   
18.     }  
19.     tabA.setTabListener(new MyTabsListener(fragmentA));  
20.     tabB.setTabListener(new MyTabsListener(fragmentB));  
21.     tabC.setTabListener(new MyTabsListener(fragmentC));  
22.     bar.addTab(tabA);  
23.     bar.addTab(tabB);  
24.     bar.addTab(tabC);  
25.     protected class MyTabsListener implements ActionBar.TabListener  
26.     {  
27.         private Fragment fragment;  
28.         public MyTabsListener(Fragment fragment)  
29.         {  
30.             this.fragment = fragment;  
31.         }  
32.         @Override  
33.         public void onTabSelected(Tab tab, FragmentTransaction ft)  
34.         {  
35.             ft.add(R.id.fragment_place, fragment, null);  
36.         }  
37.     }  
38.       
39. }  

AFragmentTab.java

[java] view plain copy

1. public class AFragmentTab extends Fragment  
2. {  
3.     @Override  
4.     public View onCreateView(LayoutInflater inflater, ViewGroup container,  
5.             Bundle savedInstanceState)  
6.     {  
7.         return inflater.inflate(R.layout.fragment_a, container, false);  
8.     }  
9. }  

BFragmentTab.java

[java] view plain copy

1. public class BFragmentTab extends Fragment  
2. {  
3.     @Override  
4.     public View onCreateView(LayoutInflater inflater, ViewGroup container,  
5.             Bundle savedInstanceState)  
6.     {  
7.         return inflater.inflate(R.layout.fragment_b, container, false);  
8.     }  
9. }  

CFragmentTab.java

[java] view plain copy

1. public class CFragmentTab extends Fragment  
2. {  
3.     @Override  
4.     public View onCreateView(LayoutInflater inflater, ViewGroup container,  
5.             Bundle savedInstanceState)  
6.     {  
7.         return inflater.inflate(R.layout.fragment_c, container, false);  
8.     }  
9. }  

main.xml

[html] view plain copy

1. <LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"  
2.     android:layout_width="fill_parent"  
3.     android:layout_height="fill_parent"  
4.     android:orientation="vertical" >  
5.   
6.     <LinearLayout  
7.         android:id="@+id/fragment_place"  
8.         android:layout_width="match_parent"  
9.         android:layout_height="wrap_content" >  
10.     </LinearLayout>  
11.   
12. </LinearLayout>  

效果图：

PPT 下载地址：http://download.youkuaiyun.com/detail/aomandeshangxiao/4383006