Android之ActionBar學習

  關於那個問題:是關於如何生成如下圖所示之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。

 

       下面開始正題。

簡介
        ActionBar是一個顯示在屏幕頂部的控件,它包括瞭在左邊顯示的應用的logo圖標和右邊操作菜單的可見項。
       我們可以選擇可見的操作菜單可見項,不可見項會以下拉列表的形式呈現出來。(見上圖相機圖標右側,點擊出現下拉列 表,顯示沒有直接顯示出來的操作菜單可見項)
       ActionBar為Fragment之間提供標簽導航

 

添加ActionBar
     不需要導入ActionBar,因為在android3.0或者以上版本中,ActionBar已經默認的包含在Activity中
     在Android3.0的默認主題“holographic”中,已經創造瞭ActionBar
     當android:minSdkVersion 或者 android:targetSdkVersion 屬性被設置成11或者更高時,應用會被認為是Android3.0版本(默認含有ActionBar)
去除ActionBar 
     我們可以通過把主題設置為Theme.Holo.NoActionBar為一個Activity去除掉ActionBar。                                                                                        <activity android:theme="@android:style/Theme.Holo.NoActionBar">
     我們也可以通過在代碼中調用show()或者hide()方法來相應的顯示或者隱藏ActionBar
添加Action Item
               每一個操作菜單的菜單項都可以成為ActionBar中的一個Action Item
       參考代碼如下:

      ActionBarDemoActivity.java:

[java] 
public class ActionBarDemoActivity extends Activity 

    /** Called when the activity is first created. */ 
    @Override 
    public void onCreate(Bundle savedInstanceState) 
    { 
        super.onCreate(savedInstanceState); 
        setContentView(R.layout.main); 
        Button showBt = (Button) findViewById(R.id.showBt); 
        showBt.setOnClickListener(new OnClickListener() 
        { 
            public void onClick(View view) 
            { 
                ActionBar actionBar = getActionBar(); 
                actionBar.show(); 
            } 
        }); 
 
    } 
 
    public boolean onCreateOptionsMenu(Menu menu) 
    { 
        super.onCreateOptionsMenu(menu); 
        MenuItem add = menu.add(0, 1, 0, "Save"); 
        MenuItem open = menu.add(0, 2, 1, "Open"); 
        MenuItem close = menu.add(0, 3, 2, "Close"); 
        add.setShowAsAction(MenuItem.SHOW_AS_ACTION_IF_ROOM); 
        open.setShowAsAction(MenuItem.SHOW_AS_ACTION_IF_ROOM); 
        close.setShowAsAction(MenuItem.SHOW_AS_ACTION_IF_ROOM); 
        return true; 
    } 

        main.xml

[html]
<?xml version="1.0" encoding="utf-8"?> 
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android" 
    android:layout_width="fill_parent" 
    android:layout_height="fill_parent" 
    android:orientation="horizontal" > 
 
    <Button 
        android:id="@+id/hideBt" 
        android:layout_width="wrap_content" 
        android:layout_height="wrap_content" 
        android:text="Hide The Action Bar" > 
    </Button> 
 
    <Button 
        android:id="@+id/showBt" 
        android:layout_width="wrap_content" 
        android:layout_height="wrap_content" 
        android:text="Show The Action Bar" > 
    </Button> 
 
</LinearLayout> 

      效果圖如下:


 

添加活動項(Action Item)
        當使用xml文件創建菜單(menu)時,可以標記這些菜單項作為想要實現的Action Item
代碼如下:
ActionBarXMLActivity:
     
[java] 
public class ActionBarXMLActivity extends Activity { 
    /** Called when the activity is first created. */ 
    @Override 
    public void onCreate(Bundle savedInstanceState) { 
        super.onCreate(savedInstanceState); 
        setContentView(R.layout.main); 
    } 
 
    @Override 
    public boolean onCreateOptionsMenu(Menu menu) 
    { 
        MenuInflater inflater = getMenuInflater(); 
        inflater.inflate(R.menu.optionsmenu, menu); 
        return true; 
    } 

  

optionsmenu.xml:

[html] 
<?xml version="1.0" encoding="utf-8"?> 
<menu xmlns:android="http://schemas.android.com/apk/res/android" > 
 
    <item 
        android:id="@+id/item1" 
        android:orderInCategory="1" 
        android:showAsAction="ifRoom|withText" 
        android:title="@string/save"/> 
 
    <item 
        android:id="@+id/item1" 
        android:orderInCategory="2" 
        android:showAsAction="ifRoom|withText" 
        android:title="@string/edit"/> 
 
    <item 
        android:id="@+id/item1" 
        android:orderInCategory="3" 
        android:showAsAction="ifRoom|withText" 
        android:title="@string/about"/> 
 
    <item 
        android:id="@+id/item1" 
        android:orderInCategory="4" 
        android:showAsAction="ifRoom|withText" 
        android:title="@string/help"/> 
 
</menu> 

效果圖:

 

 

菜單項過多溢出
       當創建一個ActionBar擁有太多的Action item以至於沒有足夠的控件來顯示會在屏幕的右上角出現一個溢出菜單項,可以通過它來訪問溢出部分菜單。
       代碼示例:
       其Activity代碼如上(ActionBarXMLActivity)
       溢出菜單xml
[html] 
<?xml version="1.0" encoding="utf-8"?> 
<menu xmlns:android="http://schemas.android.com/apk/res/android" > 
 
    <item 
        android:id="@+id/item1" 
        android:orderInCategory="1" 
        android:showAsAction="ifRoom|withText" 
        android:title="@string/save"/> 
    <item 
        android:id="@+id/item2" 
        android:orderInCategory="2" 
        android:showAsAction="ifRoom|withText" 
        android:title="@string/edit"/> 
    <item 
        android:id="@+id/item3" 
        android:orderInCategory="3" 
        android:showAsAction="ifRoom|withText" 
        android:title="@string/about"/> 
    <item 
        android:id="@+id/item4" 
        android:orderInCategory="4" 
        android:showAsAction="ifRoom|withText" 
        android:title="@string/help"/> 
    <item 
        android:id="@+id/item5" 
        android:orderInCategory="5" 
        android:showAsAction="ifRoom|withText" 
        android:title="@string/file"/> 
    <item 
        android:id="@+id/item6" 
        android:orderInCategory="6" 
        android:showAsAction="ifRoom|withText" 
        android:title="@string/run"/> 
    <item 
        android:id="@+id/item7" 
        android:orderInCategory="7" 
        android:showAsAction="ifRoom|withText" 
        android:title="@string/source"/> 
    <item 
        android:id="@+id/item8" 
        android:orderInCategory="8" 
        android:showAsAction="ifRoom|withText" 
        android:title="@string/navigate"/> 
    <item 
        android:id="@+id/item9" 
        android:orderInCategory="9" 
        android:showAsAction="ifRoom|withText" 
        android:title="@string/search"/> 
    <item 
        android:id="@+id/item10" 
        android:orderInCategory="10" 
        android:showAsAction="ifRoom|withText" 
        android:title="@string/project"/> 
    <item 
        android:id="@+id/item11" 
        android:orderInCategory="11" 
        android:showAsAction="ifRoom|withText" 
        android:title="@string/refactor"/> 
    <item 
        android:id="@+id/item12" 
        android:orderInCategory="12" 
        android:showAsAction="ifRoom|withText" 
        android:title="@string/window"/> 
    <item 
        android:id="@+id/item13" 
        android:orderInCategory="13" 
        android:showAsAction="ifRoom|withText" 
        android:title="@string/help"/> 
 
</menu> 

其效果圖如下:

 

使用帶字的Action Item
        Action item 默認格式是如果菜單項含字和圖標的話,隻顯示圖標
        如果想要顯示字的效果,在xml裡如下設置:android:showAsAction="ifRoom|withText"
        或者在代碼裡調用setShowAsAction():setShowAsAction(MenuItem.SHOW_AS_ACTION_IF_ROOM)

Action事件
        ActionBar中一個菜單項(即Action item)的觸發像以前版本中的活動菜單回調方法(onOptionsItemSelected())一樣。
        當用戶選擇一個Fragment的菜單項時,首先會調用Activity的onOptionsItemSelected()方法,如果該方法返回false,則調用Fragment實現的onOptionsItemSelected()方法。

應用圖標
     默認情況下,應用圖標在ActionBar的左側
    當用戶點擊應用bar的時候,系統會調用你的Activity裡面的onOptionsItemSelected() 方法裡面的Android.R.id.Home ID(你的主ID)裡定義的事件。我們可以重寫這個方法,添加一個條件執行該行為:讓它跳轉到這個應用的主Activity而不是返回的主屏幕。
    如果選擇返回應用的主activity,最好的方式是在創建的Intent中添加FLAG_ACTIVITY_CLEAR_TOP這個標簽。
    使用這個FLAG_ACTIVITY_CLEAR_TOP標簽,如果應用的主Activity已經在activity棧中存在,所有在其上的activity都會被銷毀,然後主activity會到棧頂,而不用創建主Activity的的新實例。

[java] 
@Override 
    public boolean onOptionsItemSelected(MenuItem item) 
    { 
        switch (item.getItemId()) 
        { 
        case android.R.id.home: 
            Intent intent = new Intent(this, MainActivity.class); 
            intent.addFlags(Intent.FLAG_ACTIVITY_CLEAR_TOP); 
            startActivity(intent); 
            return true; 
        default: 
            return super.onOptionsItemSelected(item); 
        } 
    } 

 

          當我們想實現用戶點擊ActionBar 圖標後返回前一個activity,可以通過在Actionbar設置setDisplayHomeAsUpEnabled(true) 來實現。
[java] 
public class HomyUpActivity extends Activity { 
    /** Called when the activity is first created. */ 
    @Override 
    public void onCreate(Bundle savedInstanceState) { 
        super.onCreate(savedInstanceState); 
        setContentView(R.layout.main); 
    } 
    @Override 
    protected void onStart() { 
        super.onStart(); 
        ActionBar actionBar = this.getActionBar(); 
        actionBar.setDisplayHomeAsUpEnabled(true); 
    } 
    @Override 
    public boolean onCreateOptionsMenu(Menu menu) { 
        MenuInflater inflater = getMenuInflater(); 
        inflater.inflate(R.menu.optionsmenu, menu); 
        return true; 
    } 
 

效果圖:

 

添加活動視圖
        我們也可以添加一個視圖作為一個Action Item.我們可以通過在xml元素的android:actionLayout屬性制定我們希望現實佈局資源的ID(例如@layout/mysearchview)
        我們可以選擇添加android:actionViewClass屬性分配與完全限定的類名描述我們想要顯示的視圖(例如android.widget.SearchView)
代碼示例:
optionsmenu.xml
[java]
<?xml version="1.0" encoding="utf-8"?> 
<menu xmlns:android="http://schemas.android.com/apk/res/android" > 
 
    <item 
        android:id="@+id/item4" 
        android:orderInCategory="4" 
        android:showAsAction="ifRoom|withText" 
        android:title="@string/help"/> 
    <item 
        android:id="@+id/item5" 
        android:orderInCategory="5" 
        android:showAsAction="ifRoom|withText" 
        android:title="@string/file"/> 
    <item 
        android:id="@+id/search" 
        android:actionViewClass="android.widget.SearchView" 
        android:showAsAction="ifRoom" 
        android:title="Search"/> 
 
</menu> 

HomeUpActivity.java
[java] 
public class HomyUpActivity extends Activity { 
    /** Called when the activity is first created. */ 
    @Override 
    public void onCreate(Bundle savedInstanceState) { 
        super.onCreate(savedInstanceState); 
        setContentView(R.layout.main); 
    } 
    @Override 
    protected void onStart() { 
        super.onStart(); 
        ActionBar actionBar = this.getActionBar(); 
        actionBar.setDisplayHomeAsUpEnabled(true); 
    } 
 
    @Override 
    public boolean onCreateOptionsMenu(Menu menu) 
    { 
        MenuInflater inflater = getMenuInflater(); 
        inflater.inflate(R.menu.optionsmenu, menu); 
        return true; 
    } 

效果圖:

 

ActionBar 標簽
        ActionBar可以現實選項卡供用戶切換瀏覽該Activity中不同的Fragment
        每個標簽都可以是一個圖標或文本標題

代碼示例:
       TabsActivity.java
[java]
public class TabsActivity extends Activity 

    /** Called when the activity is first created. */ 
    @Override 
    public void onCreate(Bundle savedInstanceState) 
    { 
        super.onCreate(savedInstanceState); 
        setContentView(R.layout.main); 
        ActionBar bar = getActionBar(); 
        bar.setNavigationMode(ActionBar.NAVIGATION_MODE_TABS); 
        ActionBar.Tab tabA = bar.newTab().setText("A Tab"); 
        ActionBar.Tab tabB = bar.newTab().setText("B Tab"); 
        ActionBar.Tab tabC = bar.newTab().setText("C Tab"); 
        Fragment fragmentA = new AFragmentTab(); 
        Fragment fragmentB = new BFragmentTab(); 
        Fragment fragmentC = new CFragmentTab(); 
 
    } 
    tabA.setTabListener(new MyTabsListener(fragmentA)); 
    tabB.setTabListener(new MyTabsListener(fragmentB)); 
    tabC.setTabListener(new MyTabsListener(fragmentC)); 
    bar.addTab(tabA); 
    bar.addTab(tabB); 
    bar.addTab(tabC); 
    protected class MyTabsListener implements ActionBar.TabListener 
    { 
        private Fragment fragment; 
        public MyTabsListener(Fragment fragment) 
        { 
            this.fragment = fragment; 
        } 
        @Override 
        public void onTabSelected(Tab tab, FragmentTransaction ft) 
        { 
            ft.add(R.id.fragment_place, fragment, null); 
        } 
    } 
     

AFragmentTab.java
[java] 
public class AFragmentTab extends Fragment 

    @Override 
    public View onCreateView(LayoutInflater inflater, ViewGroup container, 
            Bundle savedInstanceState) 
    { 
        return inflater.inflate(R.layout.fragment_a, container, false); 
    } 

BFragmentTab.java
[java] 
public class BFragmentTab extends Fragment 

    @Override 
    public View onCreateView(LayoutInflater inflater, ViewGroup container, 
            Bundle savedInstanceState) 
    { 
        return inflater.inflate(R.layout.fragment_b, container, false); 
    } 

CFragmentTab.java
[java]
public class CFragmentTab extends Fragment 

    @Override 
    public View onCreateView(LayoutInflater inflater, ViewGroup container, 
            Bundle savedInstanceState) 
    { 
        return inflater.inflate(R.layout.fragment_c, container, false); 
    } 

main.xml
[html] 
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android" 
    android:layout_width="fill_parent" 
    android:layout_height="fill_parent" 
    android:orientation="vertical" > www.aiwalls.com
 
    <LinearLayout 
        android:id="@+id/fragment_place" 
        android:layout_width="match_parent" 
        android:layout_height="wrap_content" > 
    </LinearLayout> 
 
</LinearLayout> 

效果圖:
作者:aomandeshangxiao

發佈留言

發佈留言必須填寫的電子郵件地址不會公開。 必填欄位標示為 *