即时通讯

项目杂谈–即时通讯（BottomNavigationBar）

先给大家上一张图吧

想必这个挺实用的就是仿了qq，有menu菜单的使用，还有底部导航栏的使用，
一般底部导航栏我们是自己写的，今天借助了第三方开源项目
https://github.com/Ashok-Varma/BottomNavigation
这个确实挺好用的。
在使用这个开源项目之前，请大家好好的阅读一下里面的内容。大牛写的东西果然很实用的。

现在来介绍一下这个项目吧，使用之前，先在你的android studio中添加一行依赖，添加完成就可以进行使用了，将布局拷贝到你的布局当中，让其处于底部即可。

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

接下来，按照文档下来进行操作即可，

    BottomNavigationItem conversationItem =new BottomNavigationItem(R.mipmap.conversation_selected_2,"消息");    BottomNavigationItem contactItem=new BottomNavigationItem(R.mipmap.contact_selected_2,"联系人");    BottomNavigationItem pluginItem =new BottomNavigationItem(R.mipmap.plugin_selected_2,"动态");    mBottomNavigationBar.addItem(conversationItem);    mBottomNavigationBar.addItem(contactItem);    mBottomNavigationBar.addItem(pluginItem);

通过创建不同的BottomNavigationItem ，分别指定文字和图片，这样就创建好了底部的导航栏，然后将这些item添加到BottomNavigationBar中去。

最重要的一步: 初始化BottomNavigation

      mBottomNavigationBar.initialise();

看到上图，是不是觉得当点击的时候，图片会变颜色，一开始还以为是一个选择器，其实不是的，其实是我们指定的两个颜色，一个是选中，一个是默认。通过源码分析，还是去拿了res目录下的color，这个color可以由我们自己去设置，一般设置的话都是参考应用的主色调。所以在设计应用的时候。

            /**     * @param activeColor res code for the default active color     * @return this, to allow builder pattern     */    public BottomNavigationBar setActiveColor(@ColorRes int activeColor) {        this.mActiveColor = ContextCompat.getColor(getContext(), activeColor);        return this;    }           /**             * @param inActiveColor res code for the default in-active color             * @return this, to allow builder pattern             */            public BottomNavigationBar setInActiveColor(@ColorRes int inActiveColor) {                this.mInActiveColor = ContextCompat.getColor(getContext(), inActiveColor);                return this;            }

接下来，就是点击事件了，当然这个控件同样也有它自己的点击事件监听

 mBottomNavigationBar.setTabSelectedListener(this);

相应的会去实现三个方法,在咱这个项目中，就是在选中的时候，进行fragment的显示。条目未被选中的时候，进行fragment的隐藏了。

  //条目被选中    @Override    public void onTabSelected(int position) {    }    //条目未被选中    @Override    public void onTabUnselected(int position) {    }    //条目被再次选中    @Override    public void onTabReselected(int position) {    }

接下来说一说：menu菜单，本来是actionbar中可以指定menu，由于actionbar的局限性，位置不能改变，所以引入一个toolbar。。那么toolbar，作为不同控件不需要去设置主题，如果需要，代替actionbar去使用，就需要去配置要给noactionbar的主题了。

顺带着讲了一下menu菜单，其实这个也挺简单的，无非创建一个menu文件夹。指定一些我们需要的菜单，例如上图所示》添加好友，分享好友，关于我们这三个菜单，在res/menu/main.xml中指定我们所要的菜单

<?xml version="1.0" encoding="utf-8"?><menu xmlns:android="http://schemas.android.com/apk/res/android">    <item android:id="@+id/add_friend"            android:title="添加好友"            android:icon="@mipmap/add_friend_pressed"        />    <item android:title="分享好友"          android:icon="@mipmap/scan_pressed"              android:id="@+id/share_friend"/>    <item        android:title="关于我们"        android:icon="@mipmap/about"        android:id="@+id/aboutme"        /></menu>

上一步做完之后，可以来到我们的activity中复写相应的方法

@Override    public boolean onCreateOptionsMenu(Menu menu) {//            return super.onCreateOptionsMenu(menu); //return //  将我们定义好的main.xml通过菜单布局管理填充成一个view视图        getMenuInflater().inflate(R.menu.main,menu);        return true;    }

当然上诉还是不够的，因为onCreateOptionsMenu只会创建一次，意味着我们再次点击可能就不会在创建菜单布局视图了，因此我们需要去重写另外一个方法.,一并解决了图标不显示的问题。

  //menu是默认不显示图标的，这个方法调用，是在点击这个menu建，然后展示menu    @Override    public boolean onPrepareOptionsMenu(Menu menu) {        MenuBuilder builder = (MenuBuilder) menu;        builder.setOptionalIconsVisible(true);        return true;    }

当然还需要对这个菜单进行点击操作，那么就需要去复写另外一个方法了

//true :代表这个点击事件被相应item消费，拦截下来自己处理了，false，代表没有被消费，按照正常的顺序向下走    @Override    public boolean onOptionsItemSelected(MenuItem item) {        switch (item.getItemId()) {            case R.id.aboutme:                Toast.makeText(this, "关于我们", Toast.LENGTH_SHORT)                     .show();                break;            case R.id.share_friend:                Toast.makeText(this, "分享好友", Toast.LENGTH_SHORT)                     .show();                 break;            case R.id.add_friend://                TODO                break;        }        return true;    }

注意一点就是，没有给出toolbar的布局，其实toolbar中的弹出主题是会影响我们的菜单的背景的，如果不指定 app:popupTheme=”@style/ThemeOverlay.AppCompat.Light”，那么就会使用默认的样式