0X01 在 build.gradle 中引入 design 包

在APP内的 guild.gradle 的 dependencies 中插入
compile 'com.android.support:design:25.3.1'

0X02 在 menu 中建立 item 选项

item 是导航栏里的选项

0x01

在 res 文件夹下新建 menu 文件夹

0x02

在 menu 文件夹下建立 item.xml

这里我建立的是 navigation.xml

0x03

在 item.xml 里添加 item，xml 代码如下：

<?xml version="1.0" encoding="utf-8"?>
<menu xmlns:android="http://schemas.android.com/apk/res/android">
    <item
        android:id="@+id/navigation_home"
        android:icon="@drawable/ic_home_black_24dp"
        android:title="主页" />

    <item
        android:id="@+id/navigation_community"
        android:icon="@drawable/ic_favorite_black_24dp"
        android:title="社区" />

    <item
        android:id="@+id/navigation_notifications"
        android:icon="@drawable/ic_notifications_black_24dp"
        android:title="消息" />

    <item
        android:id="@+id/navigation_me"
        android:icon="@drawable/ic_person_black_24dp"
        android:title="个人" />
</menu>

这里的icon是用的AS自带的image，需要新建 Vector Asset，具体步骤：

0x03.1

这是右键菜单

0x03.2

点击 icon 图标

0x03.3

选到你想要的图标后点 next ，再点 finish ,然后就可以在代码里调用这个图标了

1X01 在布局 XML 中插入 BottomNavigationView

因为它是底部导航栏，那么就把他放在布局的最下面，这里我用的 LinearLayout ,选垂直布局，
TextView 的高度是按权重获得最大高度，让他占满除Navigation以外的所有空间，详细代码：

<?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"
    android:orientation="vertical"
    xmlns:tools="http://schemas.android.com/tools"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    tools:context="cc.jethro.bottomnavigationviewtest.MainActivity">

    <TextView
        android:padding="16dp"
        android:id="@+id/content_view"
        android:layout_width="match_parent"
        android:layout_height="0dp"
        android:layout_weight="1"
        android:text="主页"
        android:textSize="40dp"/>


    <android.support.design.widget.BottomNavigationView
        android:background="?android:attr/windowBackground"
        android:id="@+id/navigation_view"
        app:menu="@menu/navigation"
        android:layout_width="match_parent"
        android:layout_height="wrap_content">

    </android.support.design.widget.BottomNavigationView>

</LinearLayout>

1X02 在 Activity 中对 navigation 进行配置

package cc.jethro.bottomnavigationviewtest;

import android.support.annotation.NonNull;
import android.support.design.widget.BottomNavigationView;
import android.support.v7.app.AppCompatActivity;
import android.os.Bundle;
import android.view.MenuItem;
import android.widget.TextView;

public class MainActivity extends AppCompatActivity {

    TextView textView ;
    BottomNavigationView navigationView ; //底部导航栏view

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

        textView = (TextView) findViewById(R.id.content_view);


        navigationView = (BottomNavigationView) findViewById(R.id.navigation_view);

        //为navigation设置监听
        navigationView.setOnNavigationItemSelectedListener(
                new BottomNavigationView.OnNavigationItemSelectedListener() {
            @Override
            public boolean onNavigationItemSelected(@NonNull MenuItem item) {

                switch (item.getItemId()) { //读取选择的item的id

                    case R.id.navigation_home: //当选中的item的id是 navigation_home 时，把text设置为主页
                        textView.setText("主页");//id是在menu下建立item时申明的
                        break;
                    case R.id.navigation_community: //当选中的item的id是 navigation_community 时，把text设置为社区
                        textView.setText("社区");
                        break;
                    case R.id.navigation_notifications:
                        textView.setText("消息");
                        break;
                    case R.id.navigation_me:
                        textView.setText("个人");
                        break;
                }

                return true; //一定要返回true，否则会选择不了item
            }
        });
    }
}

OK 就这么简单，下一篇文章将结合fragment进行进阶使用

jethro's Blog

BottomNavigationView 的简单使用