Android实现底部tabbar按钮突出效果

在某些情况下，我们可能需要使底部tabbar的中间按钮突出，即类似于如下的效果：

闲鱼底部tabbar按钮突出效果.png

在android要实现该效果，十分简单，只需要在按钮的父布局将android:clipChildren属性设置为false：

<RadioGroup
    android:layout_width="match_parent"
    android:layout_height="70dp"
    android:clipChildren="false">
    ...
  </RadioGroup>

并设置按钮的layout_gravity为bottom:

<RadioButton
    android:layout_width="match_parent"
    android:layout_height="90dp"
    android:layout_gravity="bottom" />

示例布局文件如下：

<RadioGroup
    android:layout_width="match_parent"
    android:layout_height="70dp"
    android:clipChildren="false">

    <RadioButton
        android:layout_width="match_parent"
        android:layout_height="match_parent"
        android:layout_gravity="bottom"
        android:drawableTop="@mipmap/ic_home"
        android:button="@null"
        android:text="首页" />

    <RadioButton
        android:layout_width="match_parent"
        android:layout_height="90dp"
        android:layout_gravity="bottom"
        android:drawableTop="@mipmap/ic_home"
        android:button="@null"
        android:text="精选" />
    
    <RadioButton
        android:layout_width="match_parent"
        android:layout_height="match_parent"
        android:layout_gravity="bottom"
        android:drawableTop="@mipmap/ic_home"
        android:button="@null"
        android:text="发布" />

   <RadioButton
        android:layout_width="match_parent"
        android:layout_height="match_parent"
        android:layout_gravity="bottom"
        android:drawableTop="@mipmap/ic_home"
        android:button="@null"
        android:text="发现" />

 <RadioButton
        android:layout_width="match_parent"
        android:layout_height="match_parent"
        android:layout_gravity="bottom"
        android:drawableTop="@mipmap/ic_home"
        android:button="@null"
        android:text="我的"/>

  </RadioGroup>

其中android:clipChildren属性的作用为是否限制子View不超过父布局，默认情况下是为true。当该属性为true时，子View超出父布局的部分会被裁剪。因此，将该属性设置为false，父布局不再裁剪子View超出父布局的部分，就能实现突出按钮的效果了。