仿喜马拉雅app底部导航栏五个按钮-clipChildren属性

clipChildren属性

clipChildren属性表示是否限制子控件在该容器所在的范围内，clipChildren属性配合layout_gravity属性，可以用来设置多余部分的显示位置，我这里举一个简单的例子，比如喜马拉雅FM这个应用的首页：

大家注意看这个应用底部导航栏中中间一个是要比另外四个高的，这种效果很多人就会想到使用一个RelativeLayout布局来实现，其实不用那么麻烦，这种效果一个clipChildren属性就能实现，示例Demo如下：

1. <?xml version="1.0" encoding="utf-8"?>  
2. <RelativeLayout  
3.     xmlns:android="http://schemas.android.com/apk/res/android"  
4.     xmlns:tools="http://schemas.android.com/tools"  
5.     android:layout_width="match_parent"  
6.     android:layout_height="match_parent"  
7.     android:clipChildren="false"  
8.     tools:context="org.lenve.clipchildren.MainActivity">  
9.   
10.     <LinearLayout  
11.         android:layout_width="match_parent"  
12.         android:layout_height="48dp"  
13.         android:layout_alignParentBottom="true"  
14.         android:background="#03b9fc"  
15.         android:orientation="horizontal">  
16.   
17.         <ImageView  
18.             android:layout_width="0dp"  
19.             android:layout_height="match_parent"  
20.             android:layout_weight="1"  
21.             android:src="@mipmap/ic_launcher"/>  
22.   
23.         <ImageView  
24.             android:layout_width="0dp"  
25.             android:layout_height="match_parent"  
26.             android:layout_weight="1"  
27.             android:src="@mipmap/ic_launcher"/>  
28.   
29.         <ImageView  
30.             android:layout_width="0dp"  
31.             android:layout_height="72dp"  
32.             android:layout_gravity="bottom"  
33.             android:layout_weight="1"  
34.             android:src="@mipmap/ic_launcher"/>  
35.   
36.         <ImageView  
37.             android:layout_width="0dp"  
38.             android:layout_height="match_parent"  
39.             android:layout_weight="1"  
40.             android:src="@mipmap/ic_launcher"/>  
41.   
42.         <ImageView  
43.             android:layout_width="0dp"  
44.             android:layout_height="match_parent"  
45.             android:layout_weight="1"  
46.             android:src="@mipmap/ic_launcher"/>  
47.     </LinearLayout>  
48. </RelativeLayout>  

大家看只需要在根节点添加clipChildren属性，然后在第三个ImageView上添加layout_gravity属性即可，layout_gravity属性值为bottom表示控件大小超出后控件底部对齐。效果如下：