底部导航栏

1.添加相应的文件

2.分别加入4个Fragment以及布局文件

3.MianActivity的引用

4.MainActivity的布局文件

 

添加相应的文件：

 a.先引入导航栏的依赖

implementation 'com.android.support:design:+'

  b.准备导航栏的图片素材（我这里的是4个主页，我准备了8个，4个为true的，4个为false的）

  c.创建一个menu文件，然后再里面创建一个Menu resource file文件

 1 <?xml version="1.0" encoding="utf-8"?>
 2 <menu xmlns:android="http://schemas.android.com/apk/res/android"
 3     xmlns:app="http://schemas.android.com/apk/res-auto">
 4     <item
 5         android:id="@+id/menu_home"
 6         android:title="首页"
 7         app:showAsAction="ifRoom"
 8         android:enabled="true"
 9         android:icon="@drawable/home_t"/>
10     <item
11         android:id="@+id/menu_classification"
12         android:title="分类"
13         app:showAsAction="ifRoom"
14         android:enabled="true"
15         android:icon="@drawable/classification_f"/>
16     <item
17         android:id="@+id/menu_shoppingcart"
18         android:title="购物车"
19         app:showAsAction="ifRoom"
20         android:enabled="true"
21         android:icon="@drawable/shoppingcart_f"/>
22     <item
23         android:id="@+id/menu_personal"
24         android:title="我的"
25         app:showAsAction="ifRoom"
26         android:enabled="true"
27         android:icon="@drawable/personal_f"/>
28 </menu>

 c.在drawable中创建一个bottom_navigtion_item_selector.xml文件

1 <?xml version="1.0" encoding="utf-8"?>
2 <selector xmlns:android="http://schemas.android.com/apk/res/android">
3 
4     <item android:color="#157AE2" android:state_checked="true" />
5     <item android:color="#CCCCCC" android:state_checked="false" />
6 </selector>

  d.创建一个绑定显示未选中导航栏描述字的类

 1 public class BottomNavigationViewHelper {
 2     @SuppressLint("RestrictedApi")
 3     public static void disableShiftMode(BottomNavigationView view) {
 4         BottomNavigationMenuView menuView = (BottomNavigationMenuView) view.getChildAt(0);
 5         try {
 6             Field shiftingMode = menuView.getClass().getDeclaredField("labelVisibilityMode");
 7             shiftingMode.setAccessible(true);
 8             shiftingMode.setInt(menuView, 1);//labelVisibilityMode
 9 //            shiftingMode.setBoolean(menuView, false);//mShiftingMode
10             shiftingMode.setAccessible(false);
11             for (int i = 0; i < menuView.getChildCount(); i++) {
12                 BottomNavigationItemView item = (BottomNavigationItemView) menuView.getChildAt(i);
13                 item.setShifting(false);
14                 item.setChecked(item.getItemData().isChecked());
15             }
16         } catch (NoSuchFieldException e) {
17             Log.e("BNVHelper", "Unable to get shift mode field", e);
18         } catch (IllegalAccessException e) {
19             Log.e("BNVHelper", "Unable to change value of shift mode", e);
20         }
21     }
22 }

分别加入4个Fragment以及布局文件（这里我发其中的一个碎片的代码）

 1 public class ClassificationFragment extends Fragment {
 2     private View view;
 3     @Nullable
 4     @Override
 5     public View onCreateView(@NonNull LayoutInflater inflater, @Nullable ViewGroup container, @Nullable Bundle savedInstanceState) {
 6         view = inflater.inflate(R.layout.fragment_classification,container,false);
 7 
 8         return view;
 9     }
10 }

MianActivity的引用（直接贴出MainActivity的代码）

 1 public class MainActivity extends AppCompatActivity {
 2     private BottomNavigationView bottomNavigationView;
 3     private int lastIndex;
 4     List<Fragment> mFragment;
 5     private Toolbar toolbar;
 6     @Override
 7     protected void onCreate(Bundle savedInstanceState) {
 8         super.onCreate(savedInstanceState);
 9         setContentView(R.layout.activity_main);
10         initDate();
11         initBottomNavigation();
12     }
13 
14     private void initDate(){
15         mFragment = new ArrayList<>();
16         mFragment.add(new HomeFragment());
17         mFragment.add(new ClassificationFragment());
18         mFragment.add(new ShoppingCartFragment());
19         mFragment.add(new PersonalFragment());
20         setFragmentPosition(0);
21     }
22 
23     private void initBottomNavigation(){
24         bottomNavigationView = findViewById(R.id.bv_bottomNavigation);
25         bottomNavigationView.setItemIconTintList(null); //取消图片默认颜色
26         BottomNavigationViewHelper.disableShiftMode(bottomNavigationView); //显示未选中导航栏的描述字
27         bottomNavigationView.setOnNavigationItemSelectedListener(new BottomNavigationView.OnNavigationItemSelectedListener() {
28             @Override
29             public boolean onNavigationItemSelected(@NonNull MenuItem menuItem) {
30                 resetToDefaultIcon();//重置到默认不选中图片
31                 switch (menuItem.getItemId()){
32                     case R.id.menu_home:
33                         menuItem.setIcon(R.drawable.home_t); //设置选中的图片
34                         setFragmentPosition(0); //选中的碎片
35                         break;
36                     case R.id.menu_classification:
37                         menuItem.setIcon(R.drawable.classification_t); //设置选中的图片
38                         setFragmentPosition(1);
39                         break;
40                     case R.id.menu_shoppingcart:
41                         menuItem.setIcon(R.drawable.shoppingcart_t); //设置选中的图片
42                         setFragmentPosition(2);
43                         break;
44                     case R.id.menu_personal:
45                         menuItem.setIcon(R.drawable.personal_t); //设置选中的图片
46                         setFragmentPosition(3);
47                         break;
48                         default:break;
49                 }
50                 return true;
51             }
52         });
53     }
54 
55     //重置图标
56     private void resetToDefaultIcon() {
57         MenuItem home =  bottomNavigationView.getMenu().findItem(R.id.menu_home);
58         home.setIcon(R.drawable.home_f);
59         MenuItem classification =  bottomNavigationView.getMenu().findItem(R.id.menu_classification);
60         classification.setIcon(R.drawable.classification_f);
61         MenuItem shoppingcart =  bottomNavigationView.getMenu().findItem(R.id.menu_shoppingcart);
62         shoppingcart.setIcon(R.drawable.shoppingcart_f);
63         MenuItem personal =  bottomNavigationView.getMenu().findItem(R.id.menu_personal);
64         personal.setIcon(R.drawable.personal_f);
65 
66     }
67 
68     //设置选中的Fragment
69     private void setFragmentPosition(int position){
70         FragmentTransaction fragmentTransaction = getSupportFragmentManager().beginTransaction();
71         Fragment currentFragment = mFragment.get(position);
72         Fragment lastFragment = mFragment.get(lastIndex);
73         lastIndex = position;
74         fragmentTransaction.hide(lastFragment);
75         if(!currentFragment.isAdded()){
76             getSupportFragmentManager().beginTransaction().remove(currentFragment).commit();
77             fragmentTransaction.add(R.id.ll_frameLayout,currentFragment);
78         }
79         fragmentTransaction.show(currentFragment);
80         fragmentTransaction.commitAllowingStateLoss();
81     }
82 }

MainActivity布局文件的代码

 1 <?xml version="1.0" encoding="utf-8"?>
 2 <RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
 3     xmlns:app="http://schemas.android.com/apk/res-auto"
 4     xmlns:tools="http://schemas.android.com/tools"
 5     android:layout_width="match_parent"
 6     android:layout_height="match_parent">
 7 
 8     <FrameLayout
 9         android:id="@+id/ll_frameLayout"
10         android:layout_width="match_parent"
11         android:layout_height="match_parent"
12         android:layout_above="@id/bv_bottomNavigation" />
13 
14     <com.google.android.material.bottomnavigation.BottomNavigationView
15         android:id="@+id/bv_bottomNavigation"
16         android:layout_width="match_parent"
17         android:layout_height="wrap_content"
18         android:layout_alignParentBottom="true"
19         android:background="@color/colorWhite"
20         app:itemIconTint="@drawable/bottom_navigation_item_selector"
21         app:itemTextColor="@drawable/bottom_navigation_item_title"
22         app:menu="@menu/main_bottom_navigation">
23 
24     </com.google.android.material.bottomnavigation.BottomNavigationView>
25 </RelativeLayout>

 

转载于:https://www.cnblogs.com/Mr-Deng/p/11583336.html