android 底部Tab添加水波纹效果

  像今日头条和360手机助手底部Tab 都会添加一些水波纹效果，这样能增加用户体验，这里浅谈添加Ripple 的三种方式：

 1，有边界的水波纹

  android:background="?android:attr/selectableItemBackground"

效果如下图所示：

2，无边界的Ripple

  android:background="?android:attr/selectableItemBackgroundBorderless"

很明显，无边家的效果好一些。

3，自定义Ripple

在Drawable 文件夹下创建tab_ripple.xml

看看视觉效果：

ripple 颜色改成蓝色，效果又好看一些。

布局源码：

1，相关style：

style 相关抽取能让xml 更简洁。

2，布局：

底部bottom 布局：

相关Activity 布局：

几个selector:

tab_selector_msg:

tab_selector_contact:

tab_selector_find:

tab_selector_setting:

selector_blue:

图片么自己找。。。。

主界面代码：

package com.dhl.mdstudy;

import android.support.v7.app.AppCompatActivity;
import android.os.Bundle;
import android.view.View;
import android.widget.LinearLayout;

public class BottomRippleActivity extends AppCompatActivity {

    private LinearLayout tab_menu_01,tab_menu_02,tab_menu_03,tab_menu_04 ;
    private View currentBtn ;
    @Override
    protected void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        setContentView(R.layout.activity_bottom_ripple);
        bindViews();
    }
     private void  bindViews()
    {
        tab_menu_01 = (LinearLayout) findViewById(R.id.tab_menu_01);
        tab_menu_02 = (LinearLayout)findViewById(R.id.tab_menu_02) ;
        tab_menu_03 = (LinearLayout)findViewById(R.id.tab_menu_03);
        tab_menu_04 = (LinearLayout)findViewById(R.id.tab_menu_04);
        tab_menu_01.setSelected(true);
        currentBtn = tab_menu_01;
        tab_menu_01.setOnClickListener(new View.OnClickListener() {
            @Override
            public void onClick(View v) {
                tab_menu_01.setSelected(true);
                setCurrentBtn(tab_menu_01);
                //currentBtn = tab_menu_01;
            }
        });
        tab_menu_02.setOnClickListener(new View.OnClickListener() {
            @Override
            public void onClick(View v) {
                tab_menu_02.setSelected(true);
                setCurrentBtn(tab_menu_02);
            }
        });
        tab_menu_03.setOnClickListener(new View.OnClickListener() {
            @Override
            public void onClick(View v) {
                tab_menu_03.setSelected(true);
                setCurrentBtn(tab_menu_03);
            }
        });
        tab_menu_04.setOnClickListener(new View.OnClickListener() {
            @Override
            public void onClick(View v) {
                tab_menu_04.setSelected(true);
                setCurrentBtn(tab_menu_04);
            }
        });
    }

    private void setCurrentBtn(View view)
    {

        if(currentBtn !=null)
        {
            if(currentBtn == view)
            {
                return ;
            }
            currentBtn.setSelected(false);
        }

        currentBtn = view;
    }
}