UI布局之相对布局
一、
1.相对于指定ID控件
-
android:layout_above,将控件位置设定在指定ID控件之上
-
android:layout_above,将控件位置设定在指定ID控件之上
-
android:layout_below,将控件位置设定在指定ID控件之下
-
android:layout_toLeftOf,将控件位置设定在指定ID控件左侧
-
android:layout_toRightOf,将控件位置设定在指定ID控件右侧
-
android:layout_alignLeft,设置控件与指定Id控件左边界对齐
-
android:layout_alignRight,设置控件与指定Id控件右边界对齐
-
android:layout_alignTop,设置控件与指定Id控件上边界对齐
-
android:layout_alignBotton,设置控件与指定Id控件下边界对齐
-
android:layout_alignBaseline,设置控件与指定ID控件的基线对齐,设置边界对齐以及指定上线相对位置失效
2.相对于父组件 -
android:layout_alignParentTop,设置组件处于父容器顶部
-
android:layout_alignParentBotton,设置组件处于父容器底部
-
android:layout_alignParentLeft,设置组件处于父容器左侧
-
android:layout_alignParentRight,设置组件处于父容器右侧
3.居中属性 -
android:layout_centerHorizontal,在父容器中水平居中
-
android:layout_centerVertical,在父容器中垂直居中
-
android:layout_centerInParent,在父容器中水平、垂直居中
二、
示例:
使用相对布局实现下图布局
思路:顺时针开始
具体代码:
<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout android:layout_width="match_parent"
android:layout_height="match_parent"
xmlns:android="http://schemas.android.com/apk/res/android" >
<TextView
android:id="@+id/iv_top"
android:layout_width="match_parent"
android:layout_height="60dp"
android:background="#FCF729"
/>
<TextView
android:id="@+id/iv_right01"
android:layout_width="60dp"
android:layout_height="900dp"
android:background="#EE1C1C"
android:layout_alignParentRight="true"
android:layout_below="@+id/iv_top"
/>
<TextView
android:id="@+id/iv_bottom"
android:layout_width="480dp"
android:layout_height="60dp"
android:background="#F321DF"
android:layout_alignParentBottom="true"
android:layout_toLeftOf="@+id/iv_right01"
/>
<TextView
android:id="@+id/iv_left01"
android:layout_width="60dp"
android:layout_height="840dp"
android:background="#A129EB"
android:layout_alignParentLeft="true"
android:layout_below="@+id/iv_top"
android:layout_above="@+id/iv_bottom"
/>
<TextView
android:id="@+id/iv_top02"
android:layout_width="420dp"
android:layout_height="60dp"
android:background="#0E7FE9"
android:layout_below="@+id/iv_top"
android:layout_toLeftOf="@+id/iv_right01"
android:layout_toRightOf="@+id/iv_left01"
/>
<TextView
android:id="@+id/iv_right02"
android:layout_width="60dp"
android:layout_height="780dp"
android:background="#16F5F5"
android:layout_toLeftOf="@+id/iv_right01"
android:layout_below="@+id/iv_top02"
android:layout_above="@id/iv_bottom"
/>
<TextView
android:id="@+id/iv_bottom02"
android:layout_width="360dp"
android:layout_height="60dp"
android:background="#30CAB2"
android:layout_toLeftOf="@id/iv_right02"
android:layout_toRightOf="@id/iv_left01"
android:layout_above="@+id/iv_bottom"
/>
<TextView
android:id="@+id/iv_left02"
android:layout_width="60dp"
android:layout_height="720dp"
android:background="#2BE978"
android:layout_toRightOf="@id/iv_left01"
android:layout_above="@+id/iv_bottom02"
android:layout_below="@id/iv_top02"
/>
</RelativeLayout>