Android相对布局实现各种梅花效果

一、效果图如下：

第一部是往drawable文件夹里放一个图片名为icon.png的图片，首先在这里说明Android只能放扩展名为png、jpg、gif的图片；

然后编写main.xml文件，代码如下：

[html] view plaincopy

1. <?xml version="1.0" encoding="utf-8"?>  
2. <RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"  
3.     android:layout_width="match_parent"  
4.     android:layout_height="match_parent" >  
5.     <ImageButton   
6.         android:layout_width="wrap_content"  
7.         android:layout_height="wrap_content"  
8.         android:background="@drawable/icon"  
9.         android:layout_centerInParent="true"  
10.         android:id="@+id/image0"/>  
11.     <ImageButton   
12.         android:layout_width="wrap_content"  
13.         android:layout_height="wrap_content"  
14.         android:background="@drawable/icon"  
15.         android:layout_above="@id/image0"  
16.         android:layout_toLeftOf="@id/image0"  
17.         android:id="@+id/image1"/>  
18.     <ImageButton   
19.         android:layout_width="wrap_content"  
20.         android:layout_height="wrap_content"  
21.         android:background="@drawable/icon"  
22.         android:layout_above="@id/image0"  
23.         android:layout_toRightOf="@id/image0"  
24.         android:id="@+id/image1"/>  
25.     <ImageButton   
26.         android:layout_width="wrap_content"  
27.         android:layout_height="wrap_content"  
28.         android:background="@drawable/icon"  
29.         android:layout_below="@id/image0"  
30.         android:layout_toLeftOf="@id/image0"  
31.         android:id="@+id/image1"/>  
32.     <ImageButton   
33.         android:layout_width="wrap_content"  
34.         android:layout_height="wrap_content"  
35.         android:background="@drawable/icon"  
36.         android:layout_below="@id/image0"  
37.         android:layout_toRightOf="@id/image0"  
38.         android:id="@+id/image1"/>  
39. </RelativeLayout>  

说明：

android:layout_above 将该控件的底部 至于给定Id的控件 之上

android:layout_below 将该控件的顶部至于给定ID的控件之下

android:layout_toLeftOf 将该控件的右边缘和给定ID的控件的左边缘对齐

android:layout_toRightOf将该控件的左边缘和给定ID的控件的右边缘对齐

 

android:layout_alignBaseline将该 控件的baseline 和给定ID的控件 的baseline对齐

android:layout_alignBottom将该控件的底部边缘与给定ID控件的底部边缘对齐

android:layout_alignLeft将该控件的左边缘与给定ID控件的左边缘对齐

android:layout_alignRight将该控件的右边缘与给定ID控件的右边缘对齐

android:layout_alignTop将该控件的顶部边缘与给定ID控件的顶部边缘对齐

 

android:alignParentBottom 如果该值为true，则将该控件的底部和父控件的底部对齐

android:layout_alignParentLeft 如果该什为true, 则将该控件的左边和父控件的左边对齐

android:layout_alignParentRight 如果该什为true, 则将该控件的右边和父控件的右边对齐

android:layout_alignParentTop 如果该什为true, 则将该控件的顶部和父控件的顶部对齐

 

android:layout_centerHorizontal如果值为真，该控件将被至于水平方向的中央

android:layout_inParent如果值为真，该控件将被至于父控件水平方向和垂直方向的中央

android:layout_centerVertical如果值为真，该控件将被至于垂直方向的中央

二、效果如图：

首先往drawable文件夹里放一个图片名为leaf.png的图片

编写main.xml文件，代码如下：

[html] view plaincopy

1. <?xml version="1.0" encoding="utf-8"?>  
2. <RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"  
3.     android:orientation="vertical"  
4.     android:layout_width="fill_parent"  
5.     android:layout_height="fill_parent"  
6.     >  
7. <!-- 定义该组件位于父容器中间 -->   
8. <TextView   
9.     android:id="@+id/view01"  
10.     android:layout_width="wrap_content"   
11.     android:layout_height="wrap_content"   
12.     android:background="@drawable/leaf"  
13.     android:layout_centerInParent="true"  
14.     />  
15. <!-- 定义该组件位于view01组件的上方 -->  
16. <TextView   
17.     android:id="@+id/view02"  
18.     android:layout_width="wrap_content"   
19.     android:layout_height="wrap_content"   
20.     android:background="@drawable/leaf"  
21.     android:layout_above="@id/view01"  
22.     android:layout_alignLeft="@id/view01"  
23.     />  
24. <!-- 定义该组件位于view01组件的下方 -->  
25. <TextView   
26.     android:id="@+id/view03"  
27.     android:layout_width="wrap_content"   
28.     android:layout_height="wrap_content"   
29.     android:background="@drawable/leaf"  
30.     android:layout_below="@id/view01"  
31.     android:layout_alignLeft="@id/view01"  
32.     />  
33. <!-- 定义该组件位于view01组件的左边 -->  
34. <TextView   
35.     android:id="@+id/view04"  
36.     android:layout_width="wrap_content"   
37.     android:layout_height="wrap_content"   
38.     android:background="@drawable/leaf"  
39.     android:layout_toLeftOf="@id/view01"  
40.     android:layout_alignTop="@id/view01"  
41.     />  
42. <!-- 定义该组件位于view01组件的右边 -->  
43. <TextView   
44.     android:id="@+id/view05"  
45.     android:layout_width="wrap_content"   
46.     android:layout_height="wrap_content"   
47.     android:background="@drawable/leaf"  
48.     android:layout_toRightOf="@id/view01"  
49.     android:layout_alignTop="@id/view01"  
50.     />         
51. </RelativeLayout>  

说明：为了控制该布局容器中各子组件的布局分布，RelativeLayout提供了一个内部类：RelativeLayout.LayoutParams,该类提供了大量的xml属性来控制RelativeLayout布局容器中子组件的布局分布；

除此之外，RelativeLayout.LayoutParams还继承了android.view.ViewGroup.MarginLayoutParams,因此RelativeLayout布局容器中每个子组件也可指定android.view.ViewGroup.MarginLayoutParams所支持的各xml属性。