android布局之相对布局（RelativeLayout）

用相对布局五个Button按钮实现一个梅花的形状，如图，

<img alt="" src="http://hi.csdn.net/attachment/201112/7/0_1323269739LmAc.gif">

<pre class="html" name="code">直奔主题，代码实现，在布局文件中：</pre>

<pre class="html" name="code"><?xml version="1.0" encoding="utf-8"?>
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
    android:layout_width="match_parent"
    android:layout_height="match_parent" >

</pre>

<span style="background-color: rgb(51, 204, 255);"><span style="white-space: pre;">	</span><!--第一个组件</span><pre class="html" name="code"><span style="background-color: rgb(51, 204, 255);"><span style="white-space: pre;">		</span>android:id="@+id/top1"为button添加id，</span></pre>

<span style="background-color: rgb(51, 204, 255);"><span style="white-space: pre;">		</span>android:layout_marginTop="30dp"距离容器顶端30dp</span>

<span style="background-color: rgb(51, 204, 255);"><span style="white-space: pre;">		</span>android:layout_alignParentRight="true"位置靠右</span><pre class="html" name="code"><span style="background-color: rgb(51, 204, 255);"><span style="white-space: pre;">		</span>android:layout_marginRight="60dp"距离容器右边框60dp</span></pre>

<span style="background-color: rgb(51, 204, 255);"><span style="white-space: pre;">	</span> --></span>

    <Button 
        android:id="@+id/top1"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:text="梅花"
        android:layout_marginTop="30dp"
        android:layout_alignParentRight="true"
        android:layout_marginRight="60dp"/>

<pre class="html" name="code"><span style="background-color: rgb(102, 204, 204);"><span style="white-space: pre;">	</span><!--第二个组件</span><pre class="html" name="code"><span style="background-color: rgb(102, 204, 204);"><span style="white-space: pre;">		</span>android:id="@+id/top2"为button添加id，</span><pre class="html" name="code"><span style="background-color: rgb(102, 204, 204);"><span style="white-space: pre;">		</span>android:layout_toLeftOf="@id/top1"组件的位置在id=top1组件的左边，即相对与第一个Button的左边</span></pre></pre></pre>

<pre class="html" name="code"><span style="background-color: rgb(102, 204, 204); white-space: pre;">		</span><span style="background-color: rgb(102, 204, 204);">android:layout_alignBaseline="@id/top1" 和id为top1的组件在同一基准线上，也可以理解成在同一条直线上</span><pre class="html" name="code"><span style="background-color: rgb(102, 204, 204);"><span style="white-space: pre;">		</span>android:layout_marginRight="100dp"组件位置距离容器右边框100dp远</span><span style="white-space: pre; background-color: rgb(102, 204, 204);">	</span></pre></pre>

<span style="background-color: rgb(102, 204, 204);"><span style="white-space: pre;">	</span> --></span>

<Button android:id="@+id/top2" android:layout_width="wrap_content" android:layout_height="wrap_content" android:text="梅花" android:layout_toLeftOf="@id/top1" android:layout_alignBaseline="@id/top1" android:layout_marginRight="100dp"/>

<pre class="html" name="code"><span style="background-color: rgb(51, 204, 255);"><span style="white-space: pre;">	</span><!--第三个组件</span><pre class="html" name="code"><span style="background-color: rgb(51, 204, 255);"><span style="white-space: pre;">		</span>android:id="@+id/center"为组件添加id，</span></pre></pre>

<span style="white-space: pre;"></span><pre class="html" name="code"><span style="background-color: rgb(51, 204, 255);">       <span style="white-space: pre;">	</span> <span style="white-space: pre;">	</span>android:layout_below="@+id/top2"相对与id为top2的组件（即第二个按钮）在其下面，
       <span style="white-space: pre;">		</span>android:layout_centerHorizontal="true"  设置组件相对于容器水平居中
        <span style="white-space: pre;">	</span>android:layout_marginTop="40dp"<span style="white-space: pre;">	</span>组件距离容器右边框40dp</span></pre>

<span style="background-color: rgb(51, 204, 255);"><span style="white-space: pre;">	</span> --></span>

<Button android:id="@+id/center" android:layout_width="wrap_content" android:layout_height="wrap_content" android:layout_below="@+id/top2" android:layout_centerHorizontal="true" android:layout_marginTop="40dp" android:text="梅花" />

<span style="white-space: pre;">	</span><!--第四个组件<pre class="html" name="code"><span style="white-space: pre;">		</span>android:id="@+id/down1" 为组件添加ID<pre class="html" name="code">        <span style="white-space: pre;">	</span>android:layout_below="@id/center"<span style="background-color: rgb(51, 204, 255);">相对于id为center</span><span style="background-color: rgb(51, 204, 255);">的组件（即第三个按钮）在其下面</span></pre></pre>

<pre class="html" name="code"><span style="background-color: rgb(51, 204, 255);"><span style="white-space: pre;">		</span>android:layout_alignParentRight="true"位置靠右</span><pre class="html" name="code"><span style="background-color: rgb(51, 204, 255);"><span style="white-space: pre;">		</span>android:layout_marginRight="60dp"距离容器右边框60dp</span></pre></pre>

<span style="white-space: pre;">	</span> -->

<Button android:id="@+id/down1" android:layout_width="wrap_content" android:layout_height="wrap_content" android:text="梅花" android:layout_below="@id/center" android:layout_alignParentRight="true" android:layout_marginRight="60dp"/>

<span style="white-space: pre;">	</span><!--第五个组件<pre class="html" name="code"><span style="white-space: pre;"></span><span style="font-family: monospace; white-space: pre; background-color: rgb(240, 240, 240);"></span><pre class="html" name="code"><pre class="html" name="code"><span style="background-color: rgb(102, 204, 204);"><span style="white-space: pre;">		</span>android:id="@+id/down2"为button添加id，</span><pre class="html" name="code"><span style="background-color: rgb(102, 204, 204);"><span style="white-space: pre;">		</span>android:layout_toLeftOf="@id/down1"组件的位置在id=down1组件的左边，即相对与第一个Button的左边</span></pre></pre></pre></pre>

<pre class="html" name="code"><span style="background-color: rgb(102, 204, 204); white-space: pre;">		</span><span style="background-color: rgb(102, 204, 204);">android:layout_alignTope="@id/down1" 和id为down1的组件的顶端对齐</span><pre class="html" name="code"><span style="background-color: rgb(102, 204, 204);"><span style="white-space: pre;">		</span>android:layout_marginRight="100dp"组件位置距离容器右边框100dp</span></pre></pre>

<span style="white-space: pre;">	</span> -->

<Button android:id="@+id/down2" android:layout_width="wrap_content" android:layout_height="wrap_content" android:text="梅花" android:layout_toLeftOf="@id/down1" android:layout_alignTop="@id/down1" android:layout_marginRight="100dp"/></RelativeLayout>