Android 扩展用户体验-ActionBar

ActionBar以前已经介绍了一些，是在Android 3.0(API 11)引入的，你可以认为是一个导航条，代替了原来Activtiy的标题栏。

ActionBar提供一个一致的框架，品牌化，导航，还有供操作的action。

使用条件：targeSDK（或minSDK）版本>=11， activity theme需要设置为Theme.Holo 或者它的子Style 。默认是Theme.Holo 。

若要使用ActionBar的API，则minSDK必须>=11。   注意：ActionBar的API可不包含在Support Library。可惜哦。

ActionBar的隐藏和显示方法： 

ActionBar actionBar = getActionBar();
// Hide the Action Bar
actionBar.hide();
// Show the Action Bar
actionBar.show();

你还可以设置activity的Theme为：Theme.Holo.NoActionBar。

< activity
  android:name=”.MyNonActionBarActivity”
  android:theme=”@android:style/Theme.Holo.NoActionBar”>

你还可以自定义主题，然后移除ActionBar，通过设置android:windowActionBar为false。

<? xml version=”1.0” encoding=”utf-8”?>
< resources >
  < style name=”NoActionBar” parent=”@style/ActivityTheme”>
    < item name=”android:windowActionBar”>false</ item >
  </ style >
</ resources >

前面无论哪种方式，一旦你移除了ActionBar，那么你不能在程序中获取了：getActionBar会返回Null。

自定义ActionBar

1.修改图标

默认的，ActionBar使用Activity的android:icon属性，还有一致的android:label属性。

你还有种方式，就是使用android:logo属性。不像方方正正的icon，logo的图像不会有任何宽度限制。

logo图像典型的给你的APP提供品牌。比较好的方式：当你有Logo的时候，你可以隐藏label。

如何在程序中隐藏标签label呢？

答：ActionBar actionBar = getActionBar(); 
actionBar.setDisplayShowTitleEnabled(false);

当你的Activity既指定了android:icon还指定了android:logo，那该如何呢？

答：经测试，logo会覆盖在icon之上。程序中你可以 actionBar.setDisplayUseLogoEnabled(displayLogo)。

如果你2个都看着不爽怎么办？

答：程序中：actionBar.setDisplayShowHomeEnabled(false);  这样icon和logo都没了。

注意：APP的icon/logo典型的被用来作为一个快捷的导航方式到main activity，通常你至少得保留一个。

如何修改logo旁的标题呢？

答：使用setTitle和setSubTitle。一个主标题，一个子标题。

actionBar.setSubtitle(“Inbox”); 
actionBar.setTitle(“Label:important”);

 

自定义背景

默认的ActionBar的背景颜色取决于activity指定的Theme。Holo Theme它的背景是黑色的。

你可以指定任意的Drawabel对象作为背景，使用setBackgroundDrawable方法：

ActionBar actionBar = getActionBar();
Resources r = getResources();
Drawable myDrawable = r.getDrawable(R.drawable.gradient_header);
actionBar.setBackgroundDrawable(myDrawable);

ActionBar会自动缩放你的背景图，所以通常好的方式，你的背景图最好是.9图。

覆盖模式

默认情况下，actionBar放在你的activity的顶部，且作为activity布局的一部分。设置成为覆盖模式后，actionBar相当于漂浮在activity之上，不干预activity的布局。

如何设置呢？

答：

@Override
public void onCreate(Bundle savedInstanceState) {
   super .onCreate(savedInstanceState);

   getWindow().requestFeature(Window.FEATURE_ACTION_BAR_OVERLAY);

   setContentView(R.layout.main);
}

Splite ActionBar模式

这个模式就是，你顶部放不下的action，我帮忙放在底部。

如何设置成Spite模式呢？

答： 

< activity
   android:label=”My Activity”
   android:name=”.ActionBarActivity”
   android:logo=”@drawable/ic_launcher”
   android:uiOptions=”splitActionBarWhenNarrow”>

自定义ActionBar去控制APP导航行为

Android提供了一系列方法，总的来说分为2类：

1.App icons 使用icon或者logo导航，典型的导航到APP的主界面。你也可以配置Icon去代表移动到上一级的意思。

2.Tabs和下拉列表 ActionBar支持内嵌的Tabs和下拉列表。

Icon导航可以用来导航Activity栈，然而Tabs和下拉列表被用来作为Activity内Fragments的转换。

配置ActionBar的Icon导航行为

在大多数情况，APP的icon应该被作为快捷方式，导航到主Activtiy，典型的说也就是Activtiy栈的根。为了使你的APP icon可以被点击，你必须调用ActionBar的setHomeButtonEnabled方法。

点击icon会被系统作为一个特殊的Menu Item的点击。所以你就可以在onOptionsItemSelected方法中去监听，它的id为android.R.id.home。

例子：

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

支持向上导航

传统的，Android APP在activity之间跳转完之后，可以使用返回按钮回退。

为了也支持这种模式，你可以配置app icon去提供“向上”导航。 
actionBar.setDisplayUseLogoEnabled(false); 
actionBar.setDisplayHomeAsUpEnabled(true); 
当向上导航的时候，通常使用icon而不是logo，所以这里setDisplayUseLogoEnabled(false)。

不得不说的一点：向上导航在样子上就多了个箭头，跟setHomeButtonEnabled本质上相同，都会被作为特殊的MenuItem，id都是android.R.id.home，也同样都需要在onOptionsItemSelected去监听，然后跳转。

具体怎么用，仁者见仁，智者见智。

使用导航Tabs

ActionBar提供导航TAB和下拉列表。值得注意的是，一次只能激活其中的一种导航。这些导航选择项被设计用来与Fragments更亲近。通过替换可见的Fragments从而达到修改Activity内容的目的。

导航TAB是TabWidget的替代品。

如何配置TABS呢？ 答：调用setNavigationMode方法，指定ActionBar.NAVIGATION_MODE_TABS。

actionBar.setNavigationMode(ActionBar.NAVIGATION_MODE_TABS); 
actionBar.setDisplayShowTitleEnabled(false);

通常使用TAB也会去隐藏标题。

使用Tab例子：

Tab tabOne = actionBar.newTab();

tabOne.setText(“First Tab”)
       .setIcon(R.drawable.ic_launcher)
       .setContentDescription(“Tab the First”)
       .setTabListener(
           new TabListener<MyFragment>
              ( this , R.id.fragmentContainer, MyFragment. class ));

actionBar.addTab(tabOne);

此外，你还可以使用setCustomView方法，自定义Tab布局，代替标准的文字+图片模式。

注意：setContentDescription方法是在Android 4.0（API 14）引入的，用来提供更细节的描述。

Tab的转换是由TabListener来操控的，当tab被选择、未选择、重新选择时，允许你创建Fragment事务作为回应。

下面看例子：

public static class TabListener<T extends Fragment>
  implements ActionBar.TabListener {

   private MyFragment fragment;
   private Activity activity;
   private Class<T> fragmentClass;

   private int fragmentContainer;

   public TabListener(Activity activity, int fragmentContainer,
                                     Class<T> fragmentClass) {

        this .activity = activity;
        this .fragmentContainer = fragmentContainer;
        this .fragmentClass = fragmentClass;
    }

   // Called when a new tab has been selected
   public void onTabSelected(Tab tab, FragmentTransaction ft) {
     if (fragment == null ) {
        String fragmentName = fragmentClass.getName();
         fragment =
           (MyFragment)Fragment.instantiate(activity, fragmentName);
        ft.add(fragmentContainer, fragment, null );
        fragment.setFragmentText(tab.getText());
    } else {
         ft.attach(fragment);
    }
  }

// Called on the currently selected tab when a different tag is
// selected.
public void onTabUnselected(Tab tab, FragmentTransaction ft) {
     if (fragment != null ) {
       ft.detach(fragment);
     }
}

    // Called when the selected tab is selected.
   public void onTabReselected(Tab tab, FragmentTransaction ft) {
       // TODO React to a selected tab being selected again.
    }
}

使用下拉列表导航

如何去配置呢？答：actionBar.setNavigationMode(ActionBar.NAVIGATION_MODE_LIST)。

这里的下拉列表就像一个Spinner。数据源+Adapter+…..很简单！ 

// Select the drop-down navigation mode.
actionBar.setNavigationMode(ActionBar.NAVIGATION_MODE_LIST);

// Create a new Spinner Adapter that contains the values to
// be displayed in the drop down.
ArrayAdapter dropDownAdapter =
  ArrayAdapter.createFromResource( this ,
                                         R.array.my_dropdown_values,
                                         android.R.layout.simple_list_item_1);

// Assign the callbacks to handle drop-down selections.
actionBar.setListNavigationCallbacks(dropDownAdapter,
  new OnNavigationListener() {
    public boolean onNavigationItemSelected( int itemPosition,
                                                     long itemId) {
    // TODO Modify your UI based on the position
    // of the drop down item selected.
    return true ;
  }
});

使用自定义的自定义的导航View

Android允许你创建自己的导航View：

actionBar.setDisplayShowCustomEnabled(true); 
actionBar.setCustomView(R.layout.my_custom_navigation);