Android实现底部状态栏切换的两种方式
android开发过程中,特别是新开的项目,底部状态栏的切换使用的频率非常的高,主要的实现方式有:
(1)、tablayout + fragment
(2)、fragmenttabhost + fragment
(3)、bottomnavigationview + fragment
(4)、ridiogroup + fragment
这里我先介绍前面两种实现方式,后面两种后期再贴出实现方式。
一、使用tablayout + fragment + viewpager实现
1、实现步骤:
(1)、布局文件中定义tablayout控件
(2)、定义切换的每个fragment布局文件
(3)、定义切换的每个fragment的java类
(4)、定义tablayoutmainactivity类
(5)、效果图演示
2、实现过程:
(1)、布局文件中定义tablayout控件(activity_main.xml)
<?xml version="1.0" encoding="utf-8"?> <linearlayout 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" android:layout_width="match_parent" android:layout_height="match_parent" android:orientation="vertical" tools:context="com.showly.bottomnavigationbardemo.tablayoutmainactivity"> <android.support.v4.view.viewpager android:id="@+id/viewpager_content_view" android:layout_width="match_parent" android:layout_height="0dp" android:layout_weight="1" android:scrollbars="none" /> <android.support.design.widget.tablayout android:id="@+id/tab_layout_view" android:layout_width="match_parent" android:layout_height="50dp" app:tabgravity="fill" app:tabindicatorheight="0dp" app:tabmode="fixed" app:tabselectedtextcolor="#fb8081" app:tabtextcolor="#a0a0a0" /> </linearlayout>
(2)、定义切换的每个fragment布局文件(fragment_frist.xml)
这里有四个tab类别(首页、娱乐、游戏、我的),布局都类似,这里只贴出其中一个
<?xml version="1.0" encoding="utf-8"?> <relativelayout xmlns:android="http://schemas.android.com/apk/res/android" android:layout_width="match_parent" android:layout_height="match_parent" android:background="#fff" android:orientation="vertical"> <textview android:layout_width="wrap_content" android:layout_height="wrap_content" android:layout_centerinparent="true" android:text="首页" android:textcolor="#000"/> </relativelayout>
(3)、定义切换的每个fragment的java类(fristfragment.class)
这里的java 类实现方式也相似,贴出其中一个
package com.showly.bottomnavigationbardemo.fragment; import android.os.bundle; import android.support.annotation.nullable; import android.support.v4.app.fragment; import android.view.layoutinflater; import android.view.view; import android.view.viewgroup; import com.showly.bottomnavigationbardemo.r; public class fristfragment extends fragment { @nullable @override public view oncreateview(layoutinflater inflater, @nullable viewgroup container, bundle savedinstancestate) { view view = inflater.inflate(r.layout.fragment_frist, null); return view; } }
(4)、定义tablayoutmainactivity类(tablayoutmainactivity.class)
package com.showly.bottomnavigationbardemo; import android.os.bundle; import android.support.design.widget.tablayout; import android.support.v4.app.fragment; import android.support.v4.app.fragmentmanager; import android.support.v4.app.fragmentpageradapter; import android.support.v4.view.viewpager; import android.support.v7.app.appcompatactivity; import com.showly.bottomnavigationbardemo.fragment.fourthlyfragment; import com.showly.bottomnavigationbardemo.fragment.fristfragment; import com.showly.bottomnavigationbardemo.fragment.secondfragment; import com.showly.bottomnavigationbardemo.fragment.thirtlyfragment; public class tablayoutmainactivity extends appcompatactivity { //未选中的tab图片 private int[] unselecttabres = new int[]{r.drawable.i8live_menu_home_normal , r.drawable.i8live_menu_information_normal, r.drawable.i8live_menu_game_normal, r.drawable.i8live_menu_personl_normal}; //选中的tab图片 private int[] selecttabres = new int[]{r.drawable.i8live_menu_home_press, r.drawable.i8live_menu_information_press , r.drawable.i8live_menu_game_press, r.drawable.i8live_menu_personl_press}; //tab标题 private string[] title = new string[]{"首页", "娱乐", "游戏", "我的"}; private viewpager viewpager; private tablayout tablayout; private tablayout.tab tabatone; private tablayout.tab tabattwo; private tablayout.tab tabatthree; private tablayout.tab tabatfour; @override protected void oncreate(bundle savedinstancestate) { super.oncreate(savedinstancestate); getsupportactionbar().hide();//隐藏掉整个actionbar setcontentview(r.layout.activity_main); initview(); initdata(); initlistener(); } private void initview() { viewpager = (viewpager) findviewbyid(r.id.viewpager_content_view); tablayout = (tablayout) findviewbyid(r.id.tab_layout_view); //使用适配器将viewpager与fragment绑定在一起 viewpager.setadapter(new myfragmentpageradapter(getsupportfragmentmanager())); //将tablayout与viewpager绑定 tablayout.setupwithviewpager(viewpager); /* //设置方式一: //获取底部的单个tab tabatone = tablayout.gettabat(0); tabattwo = tablayout.gettabat(1); tabatthree = tablayout.gettabat(2); tabatfour = tablayout.gettabat(3); //设置tab图片 tabatone.seticon(r.drawable.i8live_menu_home_press); tabattwo.seticon(r.drawable.i8live_menu_information_normal); tabatthree.seticon(r.drawable.i8live_menu_game_normal); tabatfour.seticon(r.drawable.i8live_menu_personl_normal);*/ //设置方式二: for (int i = 0; i < title.length; i++) { if (i == 0) { tablayout.gettabat(0).seticon(selecttabres[0]); } else { tablayout.gettabat(i).seticon(unselecttabres[i]); } } } private void initdata() { } private void initlistener() { //tablayout切换时导航栏图片处理 tablayout.addontabselectedlistener(new tablayout.ontabselectedlistener() { @override public void ontabselected(tablayout.tab tab) {//选中图片操作 for (int i = 0; i < title.length; i++) { if (tab == tablayout.gettabat(i)) { tablayout.gettabat(i).seticon(selecttabres[i]); viewpager.setcurrentitem(i); } } } @override public void ontabunselected(tablayout.tab tab) {//未选中图片操作 for (int i = 0; i < title.length; i++) { if (tab == tablayout.gettabat(i)) { tablayout.gettabat(i).seticon(unselecttabres[i]); } } } @override public void ontabreselected(tablayout.tab tab) { } }); } //自定义适配器 public class myfragmentpageradapter extends fragmentpageradapter { public myfragmentpageradapter(fragmentmanager fm) { super(fm); } @override public fragment getitem(int position) { if (position == 1) { return new secondfragment();//娱乐 } else if (position == 2) { return new thirtlyfragment();//游戏 } else if (position == 3) { return new fourthlyfragment();//我的 } return new fristfragment();//首页 } @override public int getcount() { return title.length; } @override public charsequence getpagetitle(int position) { return title[position]; } } }
(5)、效果图演示
二、使用fragmenttabhost+ fragment + viewpager实现
1、实现步骤:
(1)、布局文件中定义fragmenttabhost控件
(2)、定义底部菜单栏布局
(3)、定义切换的每个fragment布局文件
(4)、定义切换的每个fragment的java类
(5)、切换按钮的图片
(6)、定义fragmenttabhostmainactivity类
(7)、效果图演示
2、实现过程:
(1)、布局文件中定义fragmenttabhost控件(fragment_tabhost_activity.xml)
<?xml version="1.0" encoding="utf-8"?> <linearlayout xmlns:android="http://schemas.android.com/apk/res/android" android:layout_width="match_parent" android:layout_height="match_parent" android:background="#fff" android:orientation="vertical"> <android.support.v4.view.viewpager android:id="@+id/vp_pager" android:layout_width="match_parent" android:layout_height="0dp" android:layout_weight="1" android:scrollbars="none" /> <android.support.v4.app.fragmenttabhost android:id="@android:id/tabhost" android:layout_width="match_parent" android:background="#3000" android:layout_height="65dp"> <framelayout android:id="@android:id/tabcontent" android:layout_width="wrap_content" android:layout_height="wrap_content" /> </android.support.v4.app.fragmenttabhost> </linearlayout>
(2)、定义底部菜单栏布局(tab_content.xml)
<?xml version="1.0" encoding="utf-8"?> <linearlayout xmlns:android="http://schemas.android.com/apk/res/android" android:layout_width="match_parent" android:layout_height="match_parent" android:padding="2dp" android:orientation="vertical"> <imageview android:id="@+id/iv_imageview" android:layout_width="wrap_content" android:layout_height="wrap_content" android:layout_gravity="center_horizontal" android:background="@drawable/i8live_menu_home_normal" /> <textview android:id="@+id/tv_item" android:layout_width="wrap_content" android:layout_height="wrap_content" android:layout_gravity="center_horizontal" android:layout_margintop="5dp" android:text="首页" /> </linearlayout>
(3)、定义切换的每个fragment布局文件(fragment_frist.xml)
这里有四个tab类别(首页、娱乐、游戏、我的),布局都类似,这里只贴出其中一个
<?xml version="1.0" encoding="utf-8"?> <relativelayout xmlns:android="http://schemas.android.com/apk/res/android" android:layout_width="match_parent" android:layout_height="match_parent" android:background="#fff" android:orientation="vertical"> <textview android:layout_width="wrap_content" android:layout_height="wrap_content" android:layout_centerinparent="true" android:text="首页" android:textcolor="#000"/> </relativelayout>
(4)、定义切换的每个fragment的java类(fristfragment.class)
这里的java 类实现方式也相似,贴出其中一个
package com.showly.bottomnavigationbardemo.fragment; import android.os.bundle; import android.support.annotation.nullable; import android.support.v4.app.fragment; import android.view.layoutinflater; import android.view.view; import android.view.viewgroup; import com.showly.bottomnavigationbardemo.r; public class fristfragment extends fragment { @nullable @override public view oncreateview(layoutinflater inflater, @nullable viewgroup container, bundle savedinstancestate) { view view = inflater.inflate(r.layout.fragment_frist, null); return view; } }
(5)、切换按钮的图片(tab_main.xml)
这里有四个是相似的,只贴出其中一个
<?xml version="1.0" encoding="utf-8"?> <selector xmlns:android="http://schemas.android.com/apk/res/android"> <!-- 切换选中之后的图片--> <item android:drawable="@drawable/i8live_menu_home_press" android:state_selected="true"/> <!-- 未选中的图片--> <item android:drawable="@drawable/i8live_menu_home_normal"/> </selector>
(6)、定义fragmenttabhostmainactivity类(fragmenttabhostmainactivity.class)
package com.showly.bottomnavigationbardemo; import android.graphics.color; import android.os.bundle; import android.support.annotation.nullable; import android.support.v4.app.fragment; import android.support.v4.app.fragmentactivity; import android.support.v4.app.fragmentmanager; import android.support.v4.app.fragmentpageradapter; import android.support.v4.app.fragmenttabhost; import android.support.v4.view.viewpager; import android.view.layoutinflater; import android.view.view; import android.view.viewgroup; import android.widget.imageview; import android.widget.tabhost; import android.widget.tabwidget; import android.widget.textview; import com.showly.bottomnavigationbardemo.fragment.fourthlyfragment; import com.showly.bottomnavigationbardemo.fragment.fristfragment; import com.showly.bottomnavigationbardemo.fragment.secondfragment; import com.showly.bottomnavigationbardemo.fragment.thirtlyfragment; import java.util.arraylist; import java.util.list; public class fragmenttabhostmainactivity extends fragmentactivity implements viewpager.onpagechangelistener, tabhost.ontabchangelistener { private int[] selecttabres = new int[]{r.drawable.tab_main, r.drawable.tab_infomation , r.drawable.tab_game, r.drawable.tab_personal}; //tab标题 private string[] title = new string[]{"首页", "娱乐", "游戏", "我的"}; private class fragmentarry[] = {fristfragment.class, secondfragment.class, thirtlyfragment.class, fourthlyfragment.class}; private list<fragment> fragmentlist = new arraylist(); private viewpager viewpager; private fragmenttabhost tabhost; @override protected void oncreate(@nullable bundle savedinstancestate) { super.oncreate(savedinstancestate); setcontentview(r.layout.fragment_tabhost_activity); initview(); initdata(); initlistener(); } /** * 初始化fragment并给viewpager添加适配器 */ private void initvaper() { fristfragment fristfragment = new fristfragment(); secondfragment secondfragment = new secondfragment(); thirtlyfragment thirtlyfragment = new thirtlyfragment(); fourthlyfragment fourthlyfragment = new fourthlyfragment(); fragmentlist.add(fristfragment); fragmentlist.add(secondfragment); fragmentlist.add(thirtlyfragment); fragmentlist.add(fourthlyfragment); //viewpager添加适配器 viewpager.setadapter(new myfragmentadapter(getsupportfragmentmanager(), fragmentlist)); tabhost.gettabwidget().setdividerdrawable(null); } private void initview() { viewpager = (viewpager) findviewbyid(r.id.vp_pager); tabhost = (fragmenttabhost) findviewbyid(android.r.id.tabhost);//绑定tabhost tabhost.setup(this, getsupportfragmentmanager(), r.id.vp_pager);//tabhost绑定viewpager //获取item的个数 int count = title.length; for (int i = 0; i < count; i++) { //设置每个tabhost布局 tabhost.tabspec tabspec = tabhost.newtabspec(title[i]) .setindicator(gettabitemview(i)); //item与fragment关联 tabhost.addtab(tabspec, fragmentarry[i], null); tabhost.settag(i); } //初始化tabhost文字颜色 updatetab(tabhost); //给viewpager设置适配器 initvaper(); } /** * 更新文字颜色。 * * @param mtabhost */ private void updatetab(fragmenttabhost mtabhost) { for (int i = 0; i < mtabhost.gettabwidget().getchildcount(); i++) { textview tv = (textview) mtabhost.gettabwidget().getchildat(i).findviewbyid(r.id.tv_item); if (mtabhost.getcurrenttab() == i) {//选中 tv.settextcolor(color.parsecolor("#ff5959")); } else {//不选中 tv.settextcolor(color.parsecolor("#777777")); } } } /** * 设置每个item布局 */ private view gettabitemview(int i) { view view = layoutinflater.from(this).inflate(r.layout.tab_content, null); imageview itemimg = (imageview) view.findviewbyid(r.id.iv_imageview); textview itemtext = (textview) view.findviewbyid(r.id.tv_item); itemimg.setbackgroundresource(selecttabres[i]); itemtext.settext(title[i]); return view; } private void initdata() { } private void initlistener() { viewpager.addonpagechangelistener(this); tabhost.setontabchangedlistener(this); } @override public void onpagescrolled(int position, float positionoffset, int positionoffsetpixels) { } @override public void onpageselected(int position) { tabwidget widget = tabhost.gettabwidget(); int oldfocusability = widget.getdescendantfocusability(); widget.setdescendantfocusability(viewgroup.focus_block_descendants);//设置view覆盖子类控件而直接获得焦点 tabhost.setcurrenttab(position);//根据位置postion设置当前的tab widget.setdescendantfocusability(oldfocusability);//设置取消分割线 } @override public void onpagescrollstatechanged(int state) { } @override public void ontabchanged(string tabid) { int position = tabhost.getcurrenttab(); viewpager.setcurrentitem(position);//把选中的tab的位置赋给适配器,让它控制页面切换 updatetab(tabhost);//设置tabhost文字颜色 } /** * 适配器 * */ public class myfragmentadapter extends fragmentpageradapter { list<fragment> list; public myfragmentadapter(fragmentmanager fm, list<fragment> list) { super(fm); this.list = list; } @override public fragment getitem(int position) { return list.get(position); } @override public int getcount() { return list.size(); } }
(7)、效果图演示
三、总结
以上所述是小编给大家介绍的android实现底部状态栏切换的两种方式,希望对大家有所帮助