android 底部选项卡 fragment,Android FragmentTabHost底部选项卡实现

偏执的太偏执、 2022-10-05 01:52 227阅读 0赞

记录一下底部选项卡的实现，很常见的代码，大神勿嘲笑。

说一下思路，在activity底部要放上FragmentTabHost放上选项，几个无所谓，每个选项卡都对应一个fragment，点击选项卡颜色改变可以用selector(选择器)来实现，焦点选中的时候一个颜色，失去焦点的时候，另一个颜色。

首先，activity布局

android:layout\_width="match\_parent"android:layout\_height="wrap\_content"android:layout\_weight="1"android:id="@+id/fl">

android:layout\_width="match\_parent"android:layout\_height="wrap\_content"android:layout\_alignParentBottom="true"android:background="\#ffffff"android:gravity="center"android:orientation="vertical">

android:layout\_width="match\_parent"android:layout\_height="wrap\_content"android:layout\_below="@+id/fl"android:id="@+id/tabHost">

acitivity中主要代码的代码，其中view1,view2.....就是选项卡的内容，一般就是一张图片，下面一段文字(首页啥的)，标红的部分，就是每个界面的fragment，可以在各个fragment中写每个界面的代码

tabHost =(FragmentTabHost) findViewById(R.id.tabHost);

view= LayoutInflater.from(getBaseContext()).inflate(R.layout.pop\_window1,null);

view1= LayoutInflater.from(getBaseContext()).inflate(R.layout.shouye\_view,null);

view2= LayoutInflater.from(getBaseContext()).inflate(R.layout.shouye\_2\_view,null);

view3= LayoutInflater.from(getBaseContext()).inflate(R.layout.shouye\_3,null);

view4= LayoutInflater.from(getBaseContext()).inflate(R.layout.shouye\_4,null);

view5= LayoutInflater.from(getBaseContext()).inflate(R.layout.shouye\_5,null);try\{

tabHost.setup(this,getSupportFragmentManager(),R.id.fl);

Fragment mainFragment= newMianFragment();

TabHost.TabSpec tabSpec0=tabHost.newTabSpec(str\[0\]).setIndicator(view1);

tabHost.addTab(tabSpec0,mainFragment.getClass(),null);

Fragment SecondFragment= newSencondFragment();

TabHost.TabSpec tabSpec2=tabHost.newTabSpec(str\[1\]).setIndicator(view2);

tabHost.addTab(tabSpec2,SecondFragment.getClass(),null);

Fragment ShezhiFragmet= newShezhiFragment();

TabHost.TabSpec tabSpec1=tabHost.newTabSpec(str\[2\]).setIndicator(view3);

tabHost.addTab(tabSpec1,ShezhiFragmet.getClass(),null);

Fragment MoreFragment= newMoreFragment();

TabHost.TabSpec tabSpec4=tabHost.newTabSpec(str\[3\]).setIndicator(view4);

tabHost.addTab(tabSpec4,MoreFragment.getClass(),null);

Fragment MeFragment= newMeFragment();

TabHost.TabSpec tabSpec5=tabHost.newTabSpec(str\[4\]).setIndicator(view5);

tabHost.addTab(tabSpec5,MeFragment.getClass(),null);

\}catch(Exception e)\{

e.printStackTrace();

下面是选项卡的xml,标志的部分就是 选择器，标记的部分就是选择器，用来选项卡的颜色变化

android:layout\_marginTop="@dimen/y10"android:layout\_width="match\_parent"android:layout\_height="20dp"android:src="@drawable/shouye\_view\_select"android:id="@+id/img"/>

android:layout\_marginBottom="@dimen/y10"android:layout\_width="match\_parent"android:layout\_height="wrap\_content"android:layout\_gravity="center"android:gravity="center"android:textColor="@drawable/shouye\_1\_text"android:textSize="12sp"android:text="首页"/>

选择器代码：

就是有两张不同颜色的图片，焦点选中和不选中切换不同的图片，android:state\_selected="true"，就是焦点选中，

文字的选择器也是一样，切换不同的颜色

至此，选项卡的代码已经基本完成，调试一下就可以运行了