Android应用开发中Action bar编写的入门教程
从Android3.0开始除了我们重点讲解的Fragment外,ActionBar也是一个重要的内容,ActionBar主要是用于代替传统的标题栏,对于Android平板设备来说屏幕更大它的标题使用ActionBar来设计可以展示更多丰富的内容,方便操控。
ActionBar主要功能包含:
1.显示选项菜单
2.提供标签页的切换方式的导航功能,可以切换多个fragment.
3.提供下拉的导航条目.
4.提供交互式活动视图代替选项条目
5.使用程序的图标作为返回Home主屏或向上的导航操作。
提示在你的程序中应用ActionBar需要注意几点,SDK和最终运行的固件必须是Android3.0即honeycomb,在androidmanifest.xml文件中的uses-sdk元素中加入android:minSdkVersion或android:targetSdkVersion,类似
<manifestxmlns:android="http://schemas.android.com/apk/res/android" package="eoe.android.cwj" android:versionCode="1" android:versionName="1.0"> <uses-sdkandroid:minSdkVersion="honeycomb"/> <application...> </application> </manifest>
如果需要隐藏ActionBar可以在你的Activity的属性中设置主题风格为NoTitleBar在你的manifest文件中,下面的代码在3.0以前是隐藏标题,而在3.0以后就是隐藏ActionBar了,代码为:
<activityandroid:theme="@android:style/Theme.NoTitleBar">
一、添加活动条目ActionItems
对于活动条目大家可以在下图看到Android3.0的标题右部分可以变成工具栏,下面的Save和Delete就是两个ActionItems活动条目。
下面是一个menu的layout布局文件代码
<?xmlversion="1.0"encoding="utf-8"?> <menuxmlns:android="http://schemas.android.com/apk/res/android"> <itemandroid:id="@+id/menu_add" android:icon="@drawable/ic_menu_save" android:title="@string/menu_save" android:showAsAction="ifRoom|withText"/> </menu>
而其他代码类似Activity中的Menu,比如
@Override publicbooleanonOptionsItemSelected(MenuItemitem){ switch(item.getItemId()){ caseandroid.R.id.home: //当ActionBar的图标被单击时执行下面的Intent Intentintent=newIntent(this,Android123.class); startActivity(intent); break; } returnsuper.onOptionsItemSelected(item); }
对于ActionBar的创建,可以在你的Activity中重写onStart方法:
@Override protectedvoidonStart(){ super.onStart(); ActionBaractionBar=this.getActionBar(); actionBar.setDisplayOptions(ActionBar.DISPLAY_HOME_AS_UP,ActionBar.DISPLAY_HOME_AS_UP); }
调用getActionBar方式在你的Activity的onCreate中时需要注意必须在调用了setContentView之后。
二、添加活动视图ActionView
对于ActionView,我们可以在menu的布局文件使用中来自定义searchview布局,如下:
<itemandroid:id="@+id/menu_search" android:title="Search" android:icon="@drawable/ic_menu_search" android:showAsAction="ifRoom" android:actionLayout="@layout/searchview"/>
也可以直接指定Android系统中的SearchView控件,那么这时menu"_search的代码要这样写:
<itemandroid:id="@+id/menu_search" android:title="Search" android:icon="@drawable/ic_menu_search" android:showAsAction="ifRoom" android:actionViewClass="android.widget.SearchView"/>
大家注意上面的两种方法中一个属性是actionLayout制定一个layoutxml布局文件,一个是actionViewClass指定一个类,最终调用可以在Activity中响应onCreateOptionsMenu方法映射这个menu布局即可.
@Override publicbooleanonCreateOptionsMenu(Menumenu){ getMenuInflater().inflate(R.menu.options,menu); SearchViewsearchView=(SearchView)menu.findItem(R.id.menu_search).getActionView(); returnsuper.onCreateOptionsMenu(menu); }
三、添加标签Tabs
在ActionBar中实现标签页可以实现android.app.ActionBar.TabListener,重写onTabSelected、onTabUnselected和onTabReselected方法来关联Fragment。代码如下:
privateclassMyTabListenerimplementsActionBar.TabListener{ privateTabContentFragmentmFragment; publicTabListener(TabContentFragmentfragment){ mFragment=fragment; }@Override publicvoidonTabSelected(Tabtab,FragmentTransactionft){ ft.add(R.id.fragment_content,mFragment,null); } @Override publicvoidonTabUnselected(Tabtab,FragmentTransactionft){ ft.remove(mFragment); } @Override publicvoidonTabReselected(Tabtab,FragmentTransactionft){ } }
接下来我们创建ActionBar在Activity中,代码如下;
@Override protectedvoidonCreate(BundlesavedInstanceState){ super.onCreate(savedInstanceState); setContentView(R.layout.main); finalActionBaractionBar=getActionBar();//提示getActionBar方法一定在setContentView后面 actionBar.setNavigationMode(ActionBar.NAVIGATION_MODE_TABS); actionBar.setDisplayOptions(0,ActionBar.DISPLAY_SHOW_TITLE); FragmentartistsFragment=newArtistsFragment(); actionBar.addTab(actionBar.newTab().setText(R.string.tab_artists).setTabListener(newTabListener(artistsFragment))); FragmentalbumsFragment=newAlbumsFragment(); actionBar.addTab(actionBar.newTab().setText(R.string.tab_albums).setTabListener(newTabListener(albumsFragment))); }
四、添加下拉导航Drop-downNavigation:
创建一个SpinnerAdapter提供下拉选项,和Tab方式不同的是Drop-down只需要修改下setNavigationMode的模式,将ActionBar.NAVIGATION_MODE_TABS改为ActionBar.NAVIGATION_MODE_LIST,最终改进后的代码为
ActionBaractionBar=getActionBar(); actionBar.setNavigationMode(ActionBar.NAVIGATION_MODE_LIST); actionBar.setListNavigationCallbacks(mSpinnerAdapter,mNavigationCallback);
上面我们通过setListNavigationCallbacks方法绑定一个SpinnerAdapter控件,具体的OnNavigationListener代码示例为;
mOnNavigationListener=newOnNavigationListener(){ String[]strings=getResources().getStringArray(R.array.action_list); @Override publicbooleanonNavigationItemSelected(intposition,longitemId){ ListContentFragmentnewFragment=newListContentFragment(); FragmentTransactionft=openFragmentTransaction(); ft.replace(R.id.fragment_container,newFragment,strings[position]); ft.commit(); returntrue; } };
而其中的ListContentFragment的代码为:
publicclassListContentFragmentextendsFragment{ privateStringmText; @Override publicvoidonAttach(Activityactivity){ super.onAttach(activity); mText=getTag(); } @Override publicViewonCreateView(LayoutInflaterinflater,ViewGroupcontainer, BundlesavedInstanceState){ TextViewtext=newTextView(getActivity()); text.setText(mText); returntext; } }
五、实现切换Tabs标签;
Activity代码:
publicclassActionBarTabsextendsActivity{ @Override protectedvoidonCreate(BundlesavedInstanceState){ super.onCreate(savedInstanceState); setContentView(R.layout.action_bar_tabs); } publicvoidonAddTab(Viewv){ finalActionBarbar=getActionBar(); finalinttabCount=bar.getTabCount(); finalStringtext="Tab"+tabCount; bar.addTab(bar.newTab().setText(text) .setTabListener(newTabListener(newTabContentFragment(text)))); } publicvoidonRemoveTab(Viewv){ finalActionBarbar=getActionBar(); bar.removeTabAt(bar.getTabCount()-1); } publicvoidonToggleTabs(Viewv){ finalActionBarbar=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); } } publicvoidonRemoveAllTabs(Viewv){ getActionBar().removeAllTabs(); } privateclassTabListenerimplementsActionBar.TabListener{ privateTabContentFragmentmFragment; publicTabListener(TabContentFragmentfragment){ mFragment=fragment; } publicvoidonTabSelected(Tabtab,FragmentTransactionft){ ft.add(R.id.fragment_content,mFragment,mFragment.getText()); } publicvoidonTabUnselected(Tabtab,FragmentTransactionft){ ft.remove(mFragment); } publicvoidonTabReselected(Tabtab,FragmentTransactionft){ Toast.makeText(ActionBarTabs.this,"Reselected!",Toast.LENGTH_SHORT).show(); } } privateclassTabContentFragmentextendsFragment{ privateStringmText; publicTabContentFragment(Stringtext){ mText=text; } publicStringgetText(){ returnmText; } @Override publicViewonCreateView(LayoutInflaterinflater,ViewGroupcontainer, BundlesavedInstanceState){ ViewfragView=inflater.inflate(R.layout.action_bar_tab_content,container,false); TextViewtext=(TextView)fragView.findViewById(R.id.text); text.setText(mText); returnfragView; } } }
涉及的布局文件action_bar_tabs.xml代码为:
<?xmlversion="1.0"encoding="utf-8"?> <LinearLayoutxmlns:android="http://schemas.android.com/apk/res/android" android:layout_width="match_parent" android:layout_height="match_parent" android:orientation="vertical"> <FrameLayoutandroid:id="@+id/fragment_content" android:layout_width="match_parent" android:layout_height="0dip" android:layout_weight="1"/> <LinearLayoutandroid:layout_width="match_parent" android:layout_height="0dip" android:layout_weight="1" android:orientation="vertical"> <Buttonandroid:id="@+id/btn_add_tab" android:layout_width="wrap_content" android:layout_height="wrap_content" android:text="@string/btn_add_tab" android:onClick="onAddTab"/> <Buttonandroid:id="@+id/btn_remove_tab" android:layout_width="wrap_content" android:layout_height="wrap_content" android:text="@string/btn_remove_tab" android:onClick="onRemoveTab"/> <Buttonandroid:id="@+id/btn_toggle_tabs" android:layout_width="wrap_content" android:layout_height="wrap_content" android:text="@string/btn_toggle_tabs" android:onClick="onToggleTabs"/> <Buttonandroid: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>
布局文件action_bar_tab_content.xml;
<?xmlversion="1.0"encoding="utf-8"?> <TextViewxmlns:android="http://schemas.android.com/apk/res/android" android:id="@+id/text" android:layout_width="wrap_content" android:layout_height="wrap_content"/>