簡(jiǎn)介
相對(duì)布局可以讓子控件相對(duì)于兄弟控件或父控件進(jìn)行布局嚎卫,可以設(shè)置子控件相對(duì)于兄弟控件或父控件進(jìn)行上下左右對(duì)齊。
RelativeLayout能替換一些嵌套視圖袱院,當(dāng)我們用LinearLayout來(lái)實(shí)現(xiàn)一個(gè)簡(jiǎn)單的布局但又使用了過(guò)多的嵌套時(shí)材鹦,就可以考慮使用RelativeLayout重新布局嫂粟,來(lái)優(yōu)化視圖層級(jí)嵌套叉抡。
重要屬性
相對(duì)布局中使用的屬性分為相對(duì)父控件位置、子控件間相對(duì)位置、子控件在父控件中居中三大類梭姓。
- 相對(duì)父控件位置
android:layout_alignParentTop 取值布爾值,控件的頂部與父控件的頂部對(duì)齊
android:layout_alignParentBottom 取值布爾值嫩码,控件的底部與父控件的底部對(duì)齊
android:layout_alignParentLeft 取值布爾值誉尖,控件的左部與父控件的左部對(duì)齊
android:layout_alignParentRight 取值布爾值,控件的右部與父控件的右部對(duì)齊
- 子控件間相對(duì)位置(指定控件id)
例如:android:layout_above=“@id/**”
android:layout_above 控件的底部置于給定ID的控件之上
android:layout_below 控件的底部置于給定ID的控件之下
android:layout_toLeftOf 控件的右邊緣與給定ID的控件左邊緣對(duì)齊
android:layout_toRightOf 控件的左邊緣與給定ID的控件右邊緣對(duì)齊
android:layout_alignBaseline 控件的baseline與給定ID的baseline對(duì)齊
android:layout_alignTop 控件的頂部邊緣與給定ID的頂部邊緣對(duì)齊
android:layout_alignBottom 控件的底部邊緣與給定ID的底部邊緣對(duì)齊
android:layout_alignLeft 控件的左邊緣與給定ID的左邊緣對(duì)齊
android:layout_alignRight 控件的右邊緣與給定ID的右邊緣對(duì)齊
- 子控件在父控件中居中
android:layout_centerHorizontal 取值布爾值铸题,水平居中
android:layout_centerVertical 取值布爾值铡恕,垂直居中
android:layout_centerInParent 取值布爾值,父控件的中央
示例
-
效果1
效果1
xml布局
<?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">
<TextView
android:layout_width="wrap_content"
android:layout_height="40dp"
android:layout_alignParentTop="true"http://對(duì)齊父控件頂部
android:background="#aaaaaa"
android:gravity="center"
android:text="HelloWorld"
android:textSize="20sp" />
<TextView
android:layout_width="wrap_content"
android:layout_height="40dp"
android:layout_alignParentRight="true"http://對(duì)齊父控件右邊
android:background="#aaaaaa"
android:gravity="center"
android:text="HelloWorld"
android:textSize="20sp" />
<TextView
android:layout_width="wrap_content"
android:layout_height="40dp"
android:layout_alignParentBottom="true"http://對(duì)齊父控件底部
android:background="#aaaaaa"
android:gravity="center"
android:text="HelloWorld"
android:textSize="20sp" />
<TextView
android:layout_width="wrap_content"
android:layout_height="40dp"
android:layout_alignParentRight="true"http://對(duì)齊父控件右邊
android:layout_alignParentBottom="true"http://并且對(duì)齊父控件的底部
android:background="#aaaaaa"
android:gravity="center"
android:text="HelloWorld"
android:textSize="20sp" />
<TextView
android:layout_width="wrap_content"
android:layout_height="40dp"
android:layout_centerInParent="true"http://父控件居中
android:background="#aaaaaa"
android:gravity="center"
android:text="HelloWorld"
android:textSize="20sp" />
</RelativeLayout>
- 效果2
這種效果相對(duì)布局很容易實(shí)現(xiàn)
效果2
xml布局
<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="match_parent"
android:background="#00FF78"
android:layout_height="match_parent">
<TextView
android:layout_width="wrap_content"
android:layout_height="40dp"
android:layout_alignParentTop="true"http://對(duì)齊父控件頂部
android:background="#aaaaaa"
android:gravity="center"
android:text="HelloWorld"
android:textSize="20sp" />
<TextView
android:id="@+id/tv_hint"
android:layout_width="wrap_content"
android:layout_height="40dp"
android:layout_alignParentRight="true"http://對(duì)齊父控件右邊
android:background="#aaaaaa"
android:gravity="center"
android:text="HelloWorld"
android:textSize="20sp" />
<ImageView
android:layout_width="wrap_content"
android:layout_height="40dp"
android:layout_toLeftOf="@id/tv_hint"http://在id為tv_hint的左邊
android:background="@mipmap/ic_launcher" />
</RelativeLayout>
注意
相對(duì)布局id的引用問題
示例xml
<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="match_parent"
android:background="#00FF78"
android:layout_height="match_parent">
<TextView
android:layout_width="wrap_content"
android:layout_height="40dp"
android:layout_alignParentTop="true"http://對(duì)齊父控件頂部
android:background="#aaaaaa"
android:gravity="center"
android:text="HelloWorld"
android:textSize="20sp" />
<ImageView
android:layout_width="wrap_content"
android:layout_height="40dp"
android:layout_toLeftOf="@id/tv_hint"http://注意此處引用id為tv_hint,
但這個(gè)id在下面的TextView中創(chuàng)建
android:background="@mipmap/ic_launcher" />
<TextView
android:id="@+id/tv_hint" //此處創(chuàng)建id為tv_hint
android:layout_width="wrap_content"
android:layout_height="40dp"
android:layout_alignParentRight="true"
android:background="#aaaaaa"
android:gravity="center"
android:text="HelloWorld"
android:textSize="20sp" />
</RelativeLayout>
上面的xml中ImageView希望在TextView的左邊丢间,但是ImageView寫在了TextView的上面探熔,引用了下面TextView的id,這個(gè)問題我最近遇到了烘挫,我的R文件無(wú)法生成一直報(bào)錯(cuò)诀艰,但是android studio沒給提示,很頭疼墙牌。這個(gè)問題在不同的環(huán)境上不一樣涡驮,我在自己的電腦上運(yùn)行沒有任何問題,但是還是要注意喜滨,最好寫在要引用id下面捉捅,防止被坑。