Android實(shí)現(xiàn)底部狀態(tài)欄切換的兩種方式
Android開發(fā)過(guò)程中,特別是新開的項(xiàng)目,底部狀態(tài)欄的切換使用的頻率非常的高,主要的實(shí)現(xiàn)方式有:
(1)、TabLayout + Fragment
(2)、FragmentTabHost + Fragment
(3)、BottomNavigationView + Fragment
(4)、RidioGroup + Fragment
這里我先介紹前面兩種實(shí)現(xiàn)方式,后面兩種后期再貼出實(shí)現(xiàn)方式。
一、使用TabLayout + Fragment + ViewPager實(shí)現(xiàn)
1、實(shí)現(xiàn)步驟:
(1)、布局文件中定義TabLayout控件
(2)、定義切換的每個(gè)Fragment布局文件
(3)、定義切換的每個(gè)Fragment的Java類
(4)、定義TabLayoutMainActivity類
(5)、效果圖演示
2、實(shí)現(xiàn)過(guò)程:
(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)、定義切換的每個(gè)Fragment布局文件(fragment_frist.xml)
這里有四個(gè)Tab類別(首頁(yè)、娛樂(lè)、游戲、我的),布局都類似,這里只貼出其中一個(gè)
<?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="首頁(yè)" android:textColor="#000"/> </RelativeLayout>
(3)、定義切換的每個(gè)Fragment的Java類(FristFragment.class)
這里的Java 類實(shí)現(xiàn)方式也相似,貼出其中一個(gè)
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標(biāo)題
private String[] title = new String[]{"首頁(yè)", "娛樂(lè)", "游戲", "我的"};
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();//隱藏掉整個(gè)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);
/* //設(shè)置方式一:
//獲取底部的單個(gè)Tab
tabAtOne = tabLayout.getTabAt(0);
tabAttwo = tabLayout.getTabAt(1);
tabAtthree = tabLayout.getTabAt(2);
tabAtfour = tabLayout.getTabAt(3);
//設(shè)置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);*/
//設(shè)置方式二:
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切換時(shí)導(dǎo)航欄圖片處理
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();//娛樂(lè)
} else if (position == 2) {
return new ThirtlyFragment();//游戲
} else if (position == 3) {
return new FourthlyFragment();//我的
}
return new FristFragment();//首頁(yè)
}
@Override
public int getCount() {
return title.length;
}
@Override
public CharSequence getPageTitle(int position) {
return title[position];
}
}
}
(5)、效果圖演示

二、使用FragmentTabHost+ Fragment + ViewPager實(shí)現(xiàn)
1、實(shí)現(xiàn)步驟:
(1)、布局文件中定義FragmentTabHost控件
(2)、定義底部菜單欄布局
(3)、定義切換的每個(gè)Fragment布局文件
(4)、定義切換的每個(gè)Fragment的Java類
(5)、切換按鈕的圖片
(6)、定義FragmentTabHostMainActivity類
(7)、效果圖演示
2、實(shí)現(xiàn)過(guò)程:
(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="首頁(yè)" /> </LinearLayout>
(3)、定義切換的每個(gè)Fragment布局文件(fragment_frist.xml)
這里有四個(gè)Tab類別(首頁(yè)、娛樂(lè)、游戲、我的),布局都類似,這里只貼出其中一個(gè)
<?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="首頁(yè)" android:textColor="#000"/> </RelativeLayout>
(4)、定義切換的每個(gè)Fragment的Java類(FristFragment.class)
這里的Java 類實(shí)現(xiàn)方式也相似,貼出其中一個(gè)
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)
這里有四個(gè)是相似的,只貼出其中一個(gè)
<?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標(biāo)題
private String[] title = new String[]{"首頁(yè)", "娛樂(lè)", "游戲", "我的"};
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的個(gè)數(shù)
int count = title.length;
for (int i = 0; i < count; i++) {
//設(shè)置每個(gè)TabHost布局
TabHost.TabSpec tabSpec = tabHost.newTabSpec(title[i])
.setIndicator(getTabItemView(i));
//item與fragment關(guān)聯(lián)
tabHost.addTab(tabSpec, fragmentArry[i], null);
tabHost.setTag(i);
}
//初始化TabHost文字顏色
upDateTab(tabHost);
//給ViewPager設(shè)置適配器
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"));
}
}
}
/**
* 設(shè)置每個(gè)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);//設(shè)置View覆蓋子類控件而直接獲得焦點(diǎn)
tabHost.setCurrentTab(position);//根據(jù)位置Postion設(shè)置當(dāng)前的Tab
widget.setDescendantFocusability(oldFocusability);//設(shè)置取消分割線
}
@Override
public void onPageScrollStateChanged(int state) {
}
@Override
public void onTabChanged(String tabId) {
int position = tabHost.getCurrentTab();
viewPager.setCurrentItem(position);//把選中的Tab的位置賦給適配器,讓它控制頁(yè)面切換
upDateTab(tabHost);//設(shè)置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)、效果圖演示

三、總結(jié)
以上所述是小編給大家介紹的Android實(shí)現(xiàn)底部狀態(tài)欄切換的兩種方式,希望對(duì)大家有所幫助,如果大家有任何疑問(wèn)請(qǐng)給我留言,小編會(huì)及時(shí)回復(fù)大家的。在此也非常感謝大家對(duì)腳本之家網(wǎng)站的支持!
如果你覺(jué)得本文對(duì)你有幫助,歡迎轉(zhuǎn)載,煩請(qǐng)注明出處,謝謝!
- Android編程實(shí)現(xiàn)播放視頻時(shí)切換全屏并隱藏狀態(tài)欄的方法
- Android編程中沉浸式狀態(tài)欄的三種實(shí)現(xiàn)方式詳解
- Android 實(shí)現(xiàn)背景圖和狀態(tài)欄融合方法
- android開發(fā)修改狀態(tài)欄背景色和圖標(biāo)顏色的示例
- Android使用Notification在狀態(tài)欄上顯示通知
- Android沉浸式狀態(tài)欄 + actionBar漸變 + scrollView頂部伸縮效果
- Android Studio實(shí)現(xiàn)標(biāo)題欄和狀態(tài)欄的隱藏
相關(guān)文章
Android 滑動(dòng)Scrollview標(biāo)題欄漸變效果(仿京東toolbar)
這篇文章主要介紹了Android 滑動(dòng)Scrollview標(biāo)題欄漸變效果(仿京東toolbar),本文給大家介紹的非常詳細(xì),對(duì)大家的學(xué)習(xí)或工作具有一定的參考借鑒價(jià)值,需要的朋友可以參考下2021-01-01
Android實(shí)現(xiàn)無(wú)標(biāo)題欄全屏的方法
這篇文章主要介紹了Android實(shí)現(xiàn)無(wú)標(biāo)題欄全屏的三種方法,感興趣的小伙伴們可以參考一下2016-07-07
Android RadioGroup多行顯示效果 解決單選問(wèn)題
這篇文章主要為大家詳細(xì)介紹了Android RadioGroup多行顯示效果,解決單選問(wèn)題,文中示例代碼介紹的非常詳細(xì),具有一定的參考價(jià)值,感興趣的小伙伴們可以參考一下2019-11-11
android 開發(fā) 文件讀寫應(yīng)用案例分析
在Android應(yīng)用中保存文件會(huì)使用到文件讀寫技術(shù),本文將詳細(xì)介紹,需要的朋友可以參考下2012-12-12
Android上傳文件到Web服務(wù)器 PHP接收文件
這篇文章主要為大家詳細(xì)介紹了Android上傳文件到Web服務(wù)器,PHP接收文件的相關(guān)資料,具有一定的參考價(jià)值,感興趣的小伙伴們可以參考一下2017-03-03
android studio更新gradle錯(cuò)誤構(gòu)建項(xiàng)目失敗的解決方法
這篇文章主要介紹了android studio更新gradle錯(cuò)誤構(gòu)建項(xiàng)目失敗的解決方法,本文給大家介紹的非常詳細(xì),對(duì)大家的學(xué)習(xí)或工作具有一定的參考借鑒價(jià)值,需要的朋友可以參考下2020-03-03
android 跳轉(zhuǎn)到應(yīng)用通知設(shè)置界面的示例
本篇文章主要介紹了android 跳轉(zhuǎn)到應(yīng)用通知設(shè)置界面的示例,小編覺(jué)得挺不錯(cuò)的,現(xiàn)在分享給大家,也給大家做個(gè)參考。一起跟隨小編過(guò)來(lái)看看吧2017-10-10
自定義RadioButton和ViewPager實(shí)現(xiàn)TabHost帶滑動(dòng)的頁(yè)卡效果
在工作中又很多需求都不是android系統(tǒng)自帶的控件可以達(dá)到效果的所以這個(gè)時(shí)候就要自定義控件來(lái)達(dá)到效果:使用自定義RadioButton和ViewPager實(shí)現(xiàn)TabHost帶滑動(dòng)的頁(yè)卡效果2013-01-01

