Android实现主页底部菜单中间tab图案凸起

最近公司提出新的UI修改方案，就是下首页底部tab中间一个tab图案向上突出一部分，如图demo所示：

因为原来的代码底部导航栏使用的是：LinearLayout  + ImageView + TextView 组合，所以：在这里用到了一个及其重要的属性：

android:clipChildren=”false”。（放在其父布局使其生效，达到想要的效果）

意为是否允许子View超出父View的范围，Boolean型true 、false ，默认true不允许；

下面整个xml文件：

<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:tools="http://schemas.android.com/tools"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:clipChildren="false"
    tools:context=".activity.MainActivity">
    <FrameLayout
        android:id="@+id/fl_layout"
        android:layout_width="match_parent"
        android:layout_height="match_parent"
        android:layout_above="@+id/lin" />

    <LinearLayout
        android:id="@+id/lin"
        android:layout_width="match_parent"
        android:layout_height="50dp"
        android:orientation="horizontal"
        android:elevation="10dp"
        android:background="#fff"
        android:gravity="bottom"
        android:layout_alignParentBottom="true">

        <LinearLayout
            android:id="@+id/ll_tab_one"
            android:layout_width="0dp"
            android:layout_height="match_parent"
            android:layout_weight="1"
            android:gravity="bottom|center_horizontal"
            android:orientation="vertical">
            <ImageView
                android:id="@+id/iv_tab_one"
                android:layout_width="wrap_content"
                android:layout_height="wrap_content"
                android:src="@mipmap/ic_tab_home_selected"/>
            <TextView
                android:id="@+id/tv_tab_one"
                android:layout_width="wrap_content"
                android:layout_height="wrap_content"
                android:layout_marginTop="5dp"
                android:paddingBottom="2dp"
                android:textColor="@color/colorAccent"
                android:text="