一、线性布局

LinearLayout又称为线性布局,是一种非常常用的布局。这个布局会将它包含的控件在线性方向上依次排列。我们可以通过指定它的orientation属性来决定它是垂直方向排列还是水平方向上排列。

举例1:垂直方向排列

android 屏幕外布局 安卓屏幕布局_android


当排列方向是vertical,内部控件就不能将高度指定为match_parent

## 举例2:水平方向排列

android 屏幕外布局 安卓屏幕布局_控件_02

如果LinearLayout的排列方向是horizontal,内部控件就绝对不能将宽度指定为match_parent。

举例3:layout_gravity属性

android 屏幕外布局 安卓屏幕布局_控件_03


这个属性指定控件在布局中的对齐方式。跟gravity属性用法相似,但是需要注意的是当排列方向是水平的时候,只有垂直方向上的对齐方式才会生效,因为此时水平方向上的长度是不固定

举例4:layout_weight属性

android 屏幕外布局 安卓屏幕布局_百分比布局_04


这个属性可以让控件按比例分配屏幕。我们将EditText和Button的宽度都指定为0dp,不用担心显示问题。现在控件的宽度由android:layout_weight属性决定,我们将2个控件的值都设置为1就表示这两个控件平分屏幕

相对布局

RelativeLayout又称为相对布局。它可以通过相对定位的方式让控件出现在布局任何位置。也正因为如此,这个布局的属性非常多。

举例1:基于控件布局

android 屏幕外布局 安卓屏幕布局_android_05

1. //按键在左上角
2. <Button
3.     android:id="@+id/button1"
4.     android:layout_width="wrap_content"
5.     android:layout_height="wrap_content"
6.     android:layout_alignParentLeft="true"
7.     android:layout_alignParentTop="true"
8.     android:text="Button1"
9. />
10. 
11. //按键在右上角
12. <Button
13.     android:id="@+id/button2"
14.     android:layout_width="wrap_content"
15.     android:layout_height="wrap_content"
16.     android:layout_alignParentRight="true"
17.     android:layout_alignParentTop="true"
18.     android:text="Button2"
19. />
20. 
21. //按键在中间
22. <Button
23.     android:id="@+id/button3"
24.     android:layout_width="wrap_content"
25.     android:layout_height="wrap_content"
26.     android:layout_centerInParent="true"
27.     android:text="Button3"
28. />
29. 
30. //按键在左下角
31. <Button
32.     android:id="@+id/button4"
33.     android:layout_width="wrap_content"
34.     android:layout_height="wrap_content"
35.     android:layout_alignParentLeft="true"
36.     android:layout_alignParentBottom="true"
37.     android:text="Button4"
38. />
39. 
40. //按键在右下角
41. <Button
42.     android:id="@+id/button5"
43.     android:layout_width="wrap_content"
44.     android:layout_height="wrap_content"
45.     android:layout_alignParentRight="true"
46.     android:layout_alignParentBottom="true"
47.     android:text="Button5"
48. />

举例2:基于控件布局

android 屏幕外布局 安卓屏幕布局_android_06

1. //Button3处于布局中央
2. <Button
3.     android:layout_width="wrap_content"
4.     android:layout_height="wrap_content"
5.     android:layout_centerInParent="true"
6.     android:id="@+id/button3"
7.     android:text="Button3"/>
8. //Button3右上角
9. <Button
10.     android:layout_width="wrap_content"
11.     android:layout_height="wrap_content"
12.     android:id="@+id/button1"
13.     android:text="Button1"
14.     android:layout_above="@id/button3"
15.     android:layout_toRightOf="@id/button3"/>
16. //Button3左上角
17. <Button
18.     android:layout_width="wrap_content"
19.     android:layout_height="wrap_content"
20.     android:id="@+id/button2"
21.     android:text="Button2"
22.     android:layout_above="@id/button3"
23.     android:layout_toLeftOf="@id/button3"/>
24. //Button3右下角
25. <Button
26.     android:layout_width="wrap_content"
27.     android:layout_height="wrap_content"
28.     android:id="@+id/button4"
29.     android:text="Button4"
30.     android:layout_below="@id/button3"
31.     android:layout_toRightOf="@id/button3"/>
32. //Button3左下角
33. <Button
34.     android:layout_width="wrap_content"
35.     android:layout_height="wrap_content"
36.     android:id="@+id/button5"
37.     android:text="Button5"
38.     android:layout_below="@id/button3"
39.     android:layout_toLeftOf="@id/button3"/>

三、帧布局

FrameLayout又称为帧布局。这种布局没有方便的定位方式,所有的控件都会默认摆放在布局的左上角

四、百分比布局

这种布局允许直接指定控件在布局中所占的百分比,这样可以轻松实现按任意比例分割布局的效果

这种布局被Android团队定义在support库当中,我们需要在项目的build.gradle中添加百分比布局库的依赖,保证百分比布局在所有Android版本上的兼容性

android 屏幕外布局 安卓屏幕布局_android_07


输入完之后会跳出一个提示框

android 屏幕外布局 安卓屏幕布局_android_08


这个提示告诉我们,gradle文件自上次同步之后发生了变化,需要再次同步才能是项目正常工作。这里只需要点击Sync Now就可以了。

举例1:4个按键平分界面

android 屏幕外布局 安卓屏幕布局_android 屏幕外布局_09

1. <android.support.percent.PercentFrameLayout
2. xmlns:android="http:///apk/res/android"
3. xmlns:app="http:///apk/res-auto"
4. android:layout_width="match_parent"
5. android:layout_height="match_parent"
6. >
7. <Button
8. android:id="@+id/button1"
9. android:text="Button1"
10. android:layout_gravity="left|top"
11. app:layout_widthPercent="50%"
12. app:layout_heightPercent="50%"
13. />
14. 
15. <Button
16. android:id="@+id/button2"
17. android:text="Button2"
18. android:layout_gravity="right|top"
19. app:layout_widthPercent="50%"
20. app:layout_heightPercent="50%"
21. />
22. <Button
23. android:id="@+id/button3"
24. android:text="Button3"
25. android:layout_gravity="left|bottom"
26. app:layout_widthPercent="50%"
27. app:layout_heightPercent="50%"
28. />
29. <Button
30. android:id="@+id/button4"
31. android:text="Button4"
32. android:layout_gravity="right|bottom"
33. app:layout_widthPercent="50%"
34. app:layout_heightPercent="50%"
35. />
36. </android.support.percent.PercentFrameLayout>

附件列表