Android之底部导航栏BottomNavigationBar

来源:互联网 发布:淘宝店铺是怎么排名的 编辑:程序博客网 时间:2024/06/07 21:45
使用步骤
  1. android studio中build.gradle中添加
dependencies { compile 'com.ashokvarma.android:bottom-navigation-bar:1.3.0' }
  1. 布局文件中添加引用
<com.ashokvarma.bottomnavigation.BottomNavigationBar        android:id="@+id/bottomNavigationBar"        android:layout_width="match_parent"        android:layout_height="wrap_content"        android:layout_gravity="bottom"/>`
  1. 在代码中调用即可

    BottomNavigationBar bottomNavigationBar = (BottomNavigationBar) findViewById(R.id.bottomNavigationBar);    bottomNavigationBar.setMode(BottomNavigationBar.MODE_FIXED);    bottomNavigationBar.setBackgroundStyle(BottomNavigationBar.BACKGROUND_STYLE_RIPPLE);    bottomNavigationBar.addItem(new BottomNavigationItem(R.drawable.ic_default, "Home").setActiveColorResource(R.color.colorAccent))            .addItem(new BottomNavigationItem(R.drawable.ic_download, "Second").setActiveColorResource(R.color.colorPrimary))            .addItem(new BottomNavigationItem(R.drawable.ic_error_page, "Thr").setActiveColorResource(R.color.colorPrimaryDark))            .addItem(new BottomNavigationItem(R.mipmap.ic_launcher, "four").setActiveColorResource(R.color.colorFour))            .setFirstSelectedPosition(0)            .initialise();
  2. 设置监听器,做出相应的处理

    bottomNavigationBar.setTabSelectedListener(this);//点击选择的@Overridepublic void onTabSelected(int position) {    if (fragments != null) {        if (position < fragments.size()) {            FragmentManager fm = getSupportFragmentManager();            FragmentTransaction ft = fm.beginTransaction();            Fragment fragment = fragments.get(position);            if (fragment.isAdded()) {                ft.replace(R.id.layFrame, fragment);            } else {                ft.add(R.id.layFrame, fragment);            }            ft.commitAllowingStateLoss();        }    }}@Overridepublic void onTabUnselected(int position) {    if (fragments != null) {        if (position < fragments.size()) {            FragmentManager fm = getSupportFragmentManager();            FragmentTransaction ft = fm.beginTransaction();            Fragment fragment = fragments.get(position);            ft.remove(fragment);            ft.commitAllowingStateLoss();        }    }}@Overridepublic void onTabReselected(int position) {}

    显示效果

  3. BottomNavigationBar.MODE_FIXED + BottomNavigationBar.BACKGROUND_STYLE_RIPPLE

    Markdown

  4. BottomNavigationBar.MODE_FIXED + BottomNavigationBar.BACKGROUND_STYLE_STATIC

Markdown
3. BottomNavigationBar.MODE_FIXED + BottomNavigationBar.BACKGROUND_STYLE_STATIC

Markdown
4. BottomNavigationBar.MODE_SHIFTING + BottomNavigationBar.BACKGROUND_STYLE_RIPPLE

Markdown

*案例完整代码:
1. activity_main.xml

<?xml version="1.0" encoding="utf-8"?><LinearLayout    xmlns:android="http://schemas.android.com/apk/res/android"    xmlns:tools="http://schemas.android.com/tools"    android:id="@+id/activity_main"    android:layout_width="match_parent"    android:layout_height="match_parent"    android:orientation="vertical"    tools:context="com.xiaojiu.bottomnavigationbardemo.MainActivity">    <android.support.design.widget.AppBarLayout        android:id="@+id/app_bar"        android:layout_width="match_parent"        android:layout_height="?attr/actionBarSize"        android:fitsSystemWindows="true"        android:theme="@style/AppTheme.AppBarOverlay">        <android.support.v7.widget.Toolbar            android:id="@+id/toolbar"            android:layout_width="match_parent"            android:layout_height="?attr/actionBarSize"/>    </android.support.design.widget.AppBarLayout>    <FrameLayout        android:id="@+id/layFrame"        android:layout_width="match_parent"        android:layout_height="0dp"        android:layout_weight="1"/>    <com.ashokvarma.bottomnavigation.BottomNavigationBar        android:id="@+id/bottomNavigationBar"        android:layout_width="match_parent"        android:layout_height="wrap_content"        android:layout_gravity="bottom"/></LinearLayout>
  1. MainActivity
package com.xiaojiu.bottomnavigationbardemo;import android.support.v4.app.Fragment;import android.support.v4.app.FragmentManager;import android.support.v4.app.FragmentTransaction;import android.support.v7.app.AppCompatActivity;import android.os.Bundle;import android.support.v7.widget.Toolbar;import android.view.Menu;import android.view.MenuItem;import com.ashokvarma.bottomnavigation.BottomNavigationBar;import com.ashokvarma.bottomnavigation.BottomNavigationItem;import java.util.ArrayList;public class MainActivity extends AppCompatActivity implements BottomNavigationBar.OnTabSelectedListener {    private ArrayList<Fragment> fragments;    private BottomNavigationBar bottomNavigationBar;    @Override    protected void onCreate(Bundle savedInstanceState) {        super.onCreate(savedInstanceState);        setContentView(R.layout.activity_main);        Toolbar toolbar = (Toolbar) findViewById(R.id.toolbar);        setSupportActionBar(toolbar);        bottomNavigationBar = (BottomNavigationBar) findViewById(R.id.bottomNavigationBar);        bottomNavigationBar.setMode(BottomNavigationBar.MODE_FIXED);        bottomNavigationBar.setBackgroundStyle(BottomNavigationBar.BACKGROUND_STYLE_RIPPLE);        bottomNavigationBar.addItem(new BottomNavigationItem(R.drawable.ic_default, "Home").setActiveColorResource(R.color.colorAccent))                .addItem(new BottomNavigationItem(R.drawable.ic_download, "Second").setActiveColorResource(R.color.colorPrimary))                .addItem(new BottomNavigationItem(R.drawable.ic_error_page, "Thr").setActiveColorResource(R.color.colorPrimaryDark))                .addItem(new BottomNavigationItem(R.mipmap.ic_launcher, "four").setActiveColorResource(R.color.colorFour))                .setFirstSelectedPosition(0)                .initialise();        fragments = getFragments();        setDefaultFragment();        bottomNavigationBar.setTabSelectedListener(this);    }    private ArrayList<Fragment> getFragments() {        ArrayList<Fragment> fragments = new ArrayList<>();        fragments.add(HomeFragment.newInstance("Home"));        fragments.add(SecondFragment.newInstance("Second"));        fragments.add(ThreeFragment.newInstance("three"));        fragments.add(FourFragment.newInstance("Four"));        return fragments;    }    /**     * 设置默认的     */    private void setDefaultFragment() {        FragmentManager fm = getSupportFragmentManager();        FragmentTransaction transaction = fm.beginTransaction();        transaction.replace(R.id.layFrame, fragments.get(0));        transaction.commit();    }    @Override    public void onTabSelected(int position) {        if (fragments != null) {            if (position < fragments.size()) {                FragmentManager fm = getSupportFragmentManager();                FragmentTransaction ft = fm.beginTransaction();                Fragment fragment = fragments.get(position);                if (fragment.isAdded()) {                    ft.replace(R.id.layFrame, fragment);                } else {                    ft.add(R.id.layFrame, fragment);                }                ft.commitAllowingStateLoss();            }        }    }    @Override    public void onTabUnselected(int position) {        if (fragments != null) {            if (position < fragments.size()) {                FragmentManager fm = getSupportFragmentManager();                FragmentTransaction ft = fm.beginTransaction();                Fragment fragment = fragments.get(position);                ft.remove(fragment);                ft.commitAllowingStateLoss();            }        }    }    @Override    public void onTabReselected(int position) {    }    @Override    public boolean onCreateOptionsMenu(Menu menu) {        // Inflate the menu; this adds items to the action bar if it is present.        getMenuInflater().inflate(R.menu.menu_scrolling, menu);        return true;    }    @Override    public boolean onOptionsItemSelected(MenuItem item) {        // Handle action bar item clicks here. The action bar will        // automatically handle clicks on the Home/Up button, so long        // as you specify a parent activity in AndroidManifest.xml.        int id = item.getItemId();        //在BACKGROUND_STYLE_STATIC 模式下颜色是底部导航栏背景色,        // BACKGROUND_STYLE_RIPPLE模式下是图标和文字的颜色(选中/未选中)        //noinspection SimplifiableIfStatement        if (id == R.id.take_pic) {            bottomNavigationBar.setMode(BottomNavigationBar.MODE_FIXED);            bottomNavigationBar.setBackgroundStyle(BottomNavigationBar.BACKGROUND_STYLE_RIPPLE);            return true;        } else if (id == R.id.multi_select) {            bottomNavigationBar.setMode(BottomNavigationBar.MODE_FIXED);            bottomNavigationBar.setBackgroundStyle(BottomNavigationBar.BACKGROUND_STYLE_STATIC);            return true;        } else if (id == R.id.theme_color_pick) {            bottomNavigationBar.setMode(BottomNavigationBar.MODE_SHIFTING);            bottomNavigationBar.setBackgroundStyle(BottomNavigationBar.BACKGROUND_STYLE_STATIC);            return true;        } else if (id == R.id.theme_color_four) {            bottomNavigationBar.setMode(BottomNavigationBar.MODE_SHIFTING);            bottomNavigationBar.setBackgroundStyle(BottomNavigationBar.BACKGROUND_STYLE_RIPPLE);            return true;        }        return super.onOptionsItemSelected(item);    }}

至于用到的toolbar网上很多资料,不再啰嗦

Demo地址:

https://github.com/mijiaxiaojiu/bottomNavigationBar.git
阅读全文
0 0
原创粉丝点击