使用Bottom Navigation Activity实现Android底部导航栏

最近看到Android Studio里新建Activity时共选择模板中Bottom Navigation Activity可以实现Android底部导航的效果，在网上没啥参考资料，于是自己搞个教程方便大家学习指正哈。话不多说，直接效果图:（Android Studio：2.3.1）

步骤：

1.新建Bottom Navigation Activity,包含layout文件activity_navigation.xml和class文件NavigationActivity：

activity_navigation.xml代码：

<?xml version="1.0" encoding="utf-8"?>

NavigationActivity.java代码：

package com.lin.coursetwo;import android.app.FragmentTransaction;import android.os.Bundle;import android.support.annotation.NonNull;import android.support.design.widget.BottomNavigationView;import android.support.v7.app.AppCompatActivity;import android.view.MenuItem;import android.widget.TextView;import com.lin.coursetwo.fragment.FragmentOne;import com.lin.coursetwo.fragment.FragmentThree;import com.lin.coursetwo.fragment.FragmentTwo;public class NavigationActivity extends AppCompatActivity {    private TextView mTextMessage;    private FragmentOne fragmentOne;    private FragmentTwo fragmentTwo;    private FragmentThree fragmentThree;    private BottomNavigationView.OnNavigationItemSelectedListener mOnNavigationItemSelectedListener            = new BottomNavigationView.OnNavigationItemSelectedListener() {        @Override        public boolean onNavigationItemSelected(@NonNull MenuItem item) {            switch (item.getItemId()) {                case R.id.navigation_home:                    mTextMessage.setText(R.string.title_home);                    showNav(R.id.navigation_home);                    return true;                case R.id.navigation_dashboard:                    mTextMessage.setText(R.string.title_dashboard);                    showNav(R.id.navigation_dashboard);                    return true;                case R.id.navigation_notifications:                    mTextMessage.setText(R.string.title_notifications);                    showNav(R.id.navigation_notifications);                    return true;            }            return false;        }    };    @Override    protected void onCreate(Bundle savedInstanceState) {        super.onCreate(savedInstanceState);        setContentView(R.layout.activity_navigation);        init();        mTextMessage = (TextView) findViewById(R.id.message);        BottomNavigationView navigation = (BottomNavigationView) findViewById(R.id.navigation);        navigation.setOnNavigationItemSelectedListener(mOnNavigationItemSelectedListener);    }

    //init（）用来初始化组件    private void init(){        fragmentOne=new FragmentOne();        fragmentTwo=new FragmentTwo();        fragmentThree=new FragmentThree();        FragmentTransaction beginTransaction=getFragmentManager().beginTransaction();        beginTransaction.add(R.id.content,fragmentOne).add(R.id.content,fragmentTwo).add(R.id.content,fragmentThree);//开启一个事务将fragment动态加载到组件        beginTransaction.hide(fragmentOne).hide(fragmentTwo).hide(fragmentThree);//隐藏fragment        beginTransaction.addToBackStack(null);//返回到上一个显示的fragment        beginTransaction.commit();//每一个事务最后操作必须是commit（），否则看不见效果        showNav(R.id.navigation_home);    }

    private void showNav(int navid){        FragmentTransaction beginTransaction=getFragmentManager().beginTransaction();        switch (navid){            case R.id.navigation_home:                beginTransaction.hide(fragmentTwo).hide(fragmentThree);                beginTransaction.show(fragmentOne);                beginTransaction.addToBackStack(null);                beginTransaction.commit();                break;            case R.id.navigation_dashboard:                beginTransaction.hide(fragmentOne).hide(fragmentThree);                beginTransaction.show(fragmentTwo);                beginTransaction.addToBackStack(null);                beginTransaction.commit();                break;            case R.id.navigation_notifications:                beginTransaction.hide(fragmentTwo).hide(fragmentOne);                beginTransaction.show(fragmentThree);                beginTransaction.addToBackStack(null);                beginTransaction.commit();                break;        }    }}

2.新建三个Fragment类：FragmentOne、FragmentTwo、FragmentThree和对应的三个layout文件：fragment_one.xml、fragment_two.xml、fragment_three.xml

FragmentOne代码：

package com.lin.coursetwo.fragment;import android.app.Fragment;import android.os.Bundle;import android.support.annotation.Nullable;import android.view.LayoutInflater;import android.view.View;import android.view.ViewGroup;import android.widget.TextView;import com.lin.coursetwo.R;public class FragmentOne extends Fragment {    @Nullable    @Override    public View onCreateView(LayoutInflater inflater, @Nullable ViewGroup container, Bundle savedInstanceState) {        View view=inflater.inflate(R.layout.fragment_one,container,false);        return view;    }}

FragmentTwo代码：

package com.lin.coursetwo.fragment;import android.app.Fragment;import android.os.Bundle;import android.support.annotation.Nullable;import android.view.LayoutInflater;import android.view.View;import android.view.ViewGroup;import android.widget.TextView;import com.lin.coursetwo.R;public class FragmentTwo extends Fragment {    @Nullable    @Override    public View onCreateView(LayoutInflater inflater, @Nullable ViewGroup container, Bundle savedInstanceState) {        View view=inflater.inflate(R.layout.fragment_two,container,false);        return view;    }}

FragmentThree代码：

package com.lin.coursetwo.fragment;import android.app.Fragment;import android.os.Bundle;import android.support.annotation.Nullable;import android.view.LayoutInflater;import android.view.View;import android.view.ViewGroup;import android.widget.TextView;import com.lin.coursetwo.R;public class FragmentThree extends Fragment {    @Nullable    @Override    public View onCreateView(LayoutInflater inflater, @Nullable ViewGroup container, Bundle savedInstanceState) {        View view=inflater.inflate(R.layout.fragment_three,container,false);        return view;    }}

fragment_one.xml代码：

<?xml version="1.0" encoding="utf-8"?>

fragment_two.xml代码：

<?xml version="1.0" encoding="utf-8"?>

fragment_three.xml代码：

<?xml version="1.0" encoding="utf-8"?>

至此：一个简易的android底部导航功能就实现了，当然还有许多需要修改的地方，但整体的架构已经出来，希望大家能够参考指正，给我们一个新思路。

更多相关文章

随机推荐