ActionBar 是 Android 3.0(API level 11) 引入的一个新控件,它代表了应用程序标题栏,ActionBar好处是应用可以根据设备显示空间动态调整你想要添加的图片文字或控件等,这里只是使用它的搜索功能。而侧边栏是Android应用中常见的界面效果,可随主屏在左侧或右侧联动,drawerLayout是android.support.v4.widget.DrawerLayout包中,它实现了侧滑菜单效果的控件,使用DrawerLayout可以轻松的实现抽屉效果。而滑动不同的标签切换不同的界面也是常用的,使用ViewPager自带PagerTabStrip(可滑动)与PagerTitleStrip(不可滑动)也可以轻松的实现。
效果图:
布局文件:
<?xml version="1.0" encoding="utf-8"?>
<android.support.v4.widget.DrawerLayout
xmlns:android="http://schemas.android.com/apk/res/android"
android:id="@+id/drawer"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:background="#DDDDDD">
<!--主内容界面 PagerTabStrip必须是ViewPager子view-->
<android.support.v4.view.ViewPager
android:layout_width="match_parent"
android:layout_height="match_parent"
android:id="@+id/vp_tab"
>
<!--ActinBar下的标签-->
<android.support.v4.view.PagerTabStrip
android:id="@+id/pager_tab_strip"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_gravity="top"
android:background="#ffffff"
android:textColor="#000"
android:paddingTop="4dp"
android:paddingBottom="4dp" />
</android.support.v4.view.ViewPager>
<!--侧滑菜单内容-->
<FrameLayout
android:id="@+id/left_layout"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:layout_gravity="start"
android:background="@android:color/darker_gray"
/>
</android.support.v4.widget.DrawerLayout>
activity:
public class MainActivity extends AppCompatActivity implements SearchView.OnQueryTextListener {
private DrawerLayout mDrawerLayout;
private ActionBarDrawerToggle mDrawerToggle;
private ViewPager vp_tab;
private PagerTabStrip pagerTabStrip;
private String[] tabTitle;
private FrameLayout left_layout;
final private int REQUEST_CODE_ASK_PERMISSIONS = 123;
@Override
protected void onCreate(Bundle savedInstanceState) {
initView();
initActionBar();
initData();
}
protected void initView() {
setContentView(R.layout.activity_main);
vp_tab = (ViewPager) findViewById(R.id.vp_tab);
left_layout = (FrameLayout) findViewById(R.id.left_layout);
pagerTabStrip = (PagerTabStrip) findViewById(R.id.pager_tab_strip);
//设置tab下划线颜色
pagerTabStrip.setTabIndicatorColor(getResources().getColor(R.color.indicatorColor));
}
@Override
protected void initActionBar() {
getSupportActionBar().setDisplayHomeAsUpEnabled(true);
mDrawerLayout = (DrawerLayout) findViewById(R.id.drawer);
//抽屉切换器与android.R.id.home(ActionBar返回图标)动作条 绑定交互
//改变android.R.id.home返回图标。
//监听Drawer拉出、隐藏;
mDrawerToggle = new ActionBarDrawerToggle(this, mDrawerLayout, R.string.drawer_open,
R.string.drawer_close);
//同步更新Drawer拉出、隐藏,带有android.R.id.home动画效果。
mDrawerToggle.syncState();
// 给抽屉Layout绑定切换器监听
mDrawerLayout.addDrawerListener(mDrawerToggle);
}
protected void initData() {
//获取values/string.xml的字符数组
tabTitle = getResource().getStringArray(R.array.tab_names);
//填充Viewpager适配器
vp_tab.setAdapter(new MyAdapter(getSupportFragmentManager()));
}
public class MyAdapter extends FragmentPagerAdapter{
public MyAdapter(FragmentManager fm) {
super(fm);
}
@Override
public Fragment getItem(int position) {
return new HomeFragmet1();
}
@Override
public int getCount() {
return tabTitle.length;
}
//返回标签的文本
@Override
public CharSequence getPageTitle(int position) {
return tabTitle[position];
}
}
//添加右上角搜索功能
@Override
public boolean onCreateOptionsMenu(Menu menu) {
//main搜索功能布局
getMenuInflater().inflate(R.menu.main, menu);
//SearchView用于监听ActinBar搜索框文本内容
SearchView searchView = (SearchView) menu.findItem(R.id.ab_search).getActionView();
searchView.setOnQueryTextListener(this);
return super.onCreateOptionsMenu(menu);
}
//重写此方法,点击左上角三横杠才能跳出DrawerLayout
@Override
public boolean onOptionsItemSelected(MenuItem item) {
return mDrawerToggle.onOptionsItemSelected(item) || super.onOptionsItemSelected(item);
}
//搜索提交时调用
@Override
public boolean onQueryTextSubmit(String query) {
Toast.makeText(this, query, Toast.LENGTH_SHORT).show();
return true;
}
//搜索文本时调用
@Override
public boolean onQueryTextChange(String newText) {
Toast.makeText(this, newText, Toast.LENGTH_SHORT).show();
return true;
}
}
实现actionBar的搜索功能要在res/下新建menu文件夹
main.xml
<menu xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:app="http://schemas.android.com/apk/res-auto"
xmlns:tools="http://schemas.android.com/tools"
tools:context=".MainActivity" >
<item
android:id="@+id/ab_search"
android:orderInCategory="80"
android:title="action_search"
app:actionViewClass="android.support.v7.widget.SearchView"
app:showAsAction="ifRoom"/>
</menu>