安卓 实现一个底部导航栏(新手笔记-2)

时间:2021-07-24 11:20:32

Google官方给了一种实现方法叫做——BottomNavigationBar,我们使用就可以了。

首先注入依赖(我用的Android Studio 可以直接使用Gradle惹),Gradle就和maven这些的差不多,你给出一个包,使用AS自动帮你下载了,找到build.gradle(Module:app),在dependencies中添加代码:

compile 'com.ashokvarma.android:bottom-navigation-bar:1.4.1'

然后写界面的layout:

<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
    android:orientation="vertical" android:layout_width="match_parent"
    android:layout_height="match_parent">

    <!--给上面的fragment占位置-->
    <FrameLayout
        android:id="@+id/content"
        android:layout_width="match_parent"
        android:layout_height="0dp"
        android:layout_weight="1">
    </FrameLayout>

    <!--这是一种分割线做法。。。觉得很神奇-->
    <View
        android:layout_width="match_parent"
        android:layout_height="0.5dp"
        android:background="@color/colorPrimary"/>

    <com.ashokvarma.bottomnavigation.BottomNavigationBar
        android:id="@+id/bottom_navigation_bar"
        android:layout_width="match_parent"
        android:layout_height="wrap_content"/>


</LinearLayout>

界面的Activity:

public class MainActivity extends AppCompatActivity {

    BottomNavigationBar bottomNavigationBar;

    @Override
    protected void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        setContentView(R.layout.activity_main);

        bottomNavigationBar = findViewById(R.id.bottom_navigation_bar);

        //这是下面的一整个NavigationBar导航栏的设置
        bottomNavigationBar
                .setInActiveColor(R.color.green) //未选中状态颜色
                .setActiveColor(R.color.blue)  //选中状态颜色
                .setMode(BottomNavigationBar.MODE_FIXED) //导航栏模式
                .setBackgroundStyle(BottomNavigationBar.BACKGROUND_STYLE_STATIC) //导航栏背景模式(图标的动画样式和这个有关系 变大了)
                .addItem(new BottomNavigationItem(R.drawable.bottom_1, "first"/*选中的图片样式以及文字*/).setInactiveIconResource(R.drawable.ic_launcher_background)/*未选中时样式*/)
                .addItem(new BottomNavigationItem(R.drawable.bottom_2, "second").setInactiveIconResource(R.drawable.ic_launcher_background))
                .addItem(new BottomNavigationItem(R.drawable.bottom_3, "third").setInactiveIconResource(R.drawable.ic_launcher_background))
                .setFirstSelectedPosition(0)//初始化之后第一个选中的位置
                .initialise();

        //给底部导航栏的各种点击事件进行设置监听器,实现各种功能
        bottomNavigationBar.setTabSelectedListener(new BottomNavigationBar.OnTabSelectedListener() {
            @Override
            public void onTabSelected(int position) { //选中 -> 未选中
                Toast.makeText(MainActivity.this, "You click " + position, Toast.LENGTH_SHORT).show() ;
            }

            @Override
            public void onTabUnselected(int position) { //未选中 -> 选中

            }

            @Override
            public void onTabReselected(int position) { //选中 -> 选中

            }
        });

    }
}