Android常用的两种基本布局——线性布局LinearLayout和相对布局RelativeLayout

红太狼 2022-04-08 14:40 569阅读 0赞

目录

一、线性布局LinearLayout

使用示例

layout_height和layout_weight常用的参数

二、相对布局RelativeLayout

RelativeLayout中子控件常用属性

使用示例


一、线性布局LinearLayout

线性布局的的属性设置:

android:orientation 可以设置垂直方向或者水平方向的布局。

  1. 属性值垂直(vertical)和水平(horizontal),默认水平方向。

android:gravity 内部控件对齐方式,常用属性值有center、center_vertical、center_horizontal、top、bottom、left、right等。

  1. 这个属性在布局组件RelativeLayout、TableLayout中也有使用,FrameLayout、AbsoluteLayout则没有这个属性。
  2. center:居中显示,这里并不是表示显示在LinearLayout的中心,当LinearLayout线性方向为垂直方向时,center表示水平居中,但是并不能垂直居中,此时等同于center_horizontal的作用;同样当线性方向为水平方向时,center表示垂直居中,等同于center_vertical。
  3. top、bottom、left、right顾名思义为内部控件居顶、低、左、右布局。
  4. 这里要与android:layout_gravity区分开,layout_gravity是用来设置自身相对于父元素的布局。

android:layout_weight:权重,用来分配当前控件在剩余空间的大小。

  1. 使用权重一般要把分配该权重方向的长度设置为零,比如在水平方向分配权重,就把width设置为零。

使用示例

  1. <LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
  2. xmlns:tools="http://schemas.android.com/tools"
  3. android:layout_width="match_parent"
  4. android:layout_height="match_parent"
  5. android:orientation="vertical" >
  6. <LinearLayout
  7. android:layout_width="match_parent"
  8. android:layout_height="match_parent"
  9. android:orientation="horizontal" >
  10. <Button
  11. android:layout_width="match_parent"
  12. android:layout_height="0dp"
  13. android:layout_weight="1"
  14. android:text="MC" />
  15. <Button
  16. android:layout_width="match_parent"
  17. android:layout_height="0dp"
  18. android:layout_weight="1"
  19. android:text="←" />
  20. </LinearLayout>
  21. <LinearLayout
  22. android:layout_width="0dp"
  23. android:layout_height="match_parent"
  24. android:layout_weight="1"
  25. android:orientation="vertical" >
  26. <Button
  27. android:layout_width="match_parent"
  28. android:layout_height="0dp"
  29. android:layout_weight="1"
  30. android:text="MC" />
  31. <Button
  32. android:layout_width="match_parent"
  33. android:layout_height="0dp"
  34. android:layout_weight="1"
  35. android:text="←" />
  36. </LinearLayout>
  37. </LinearLayout>

布局之间可以嵌套,但是要考虑线性布局嵌套对界面渲染性能的影响。RelativeLayout能替换一些嵌套视图,当我们用LinearLayout来实现一个简单的布局但又使用了过多的嵌套时,就可以考虑使用RelativeLayout重新布局。

layout_height和layout_weight常用的参数

match_parent:表示匹配父容器的宽或高
wrap_content:表示根据内容自适应

二、相对布局RelativeLayout

相对布局可以让子控件相对于兄弟控件或父控件进行布局,可以设置子控件相对于兄弟控件或父控件进行上下左右对齐。相对布局就是一定要加Id才能管理。

RelativeLayout中子控件常用属性

1、相对于父控件,例如:android:layout_alignParentTop=“true”
android:layout_alignParentTop 控件的顶部与父控件的顶部对齐;
android:layout_alignParentBottom 控件的底部与父控件的底部对齐;
android:layout_alignParentLeft 控件的左部与父控件的左部对齐;
android:layout_alignParentRight 控件的右部与父控件的右部对齐;

2、相对给定Id控件,例如:android:layout_above=“@id/**”

/**相对位置
android:layout_above 控件的底部置于给定ID的控件之上;
android:layout_below 控件的底部置于给定ID的控件之下;
android:layout_toLeftOf 控件的右边缘与给定ID的控件左边缘对齐;
android:layout_toRightOf 控件的左边缘与给定ID的控件右边缘对齐;

/**对齐方式
android:layout_alignBaseline 控件的baseline与给定ID的baseline对齐;
android:layout_alignTop 控件的顶部边缘与给定ID的顶部边缘对齐;
android:layout_alignBottom 控件的底部边缘与给定ID的底部边缘对齐;
android:layout_alignLeft 控件的左边缘与给定ID的左边缘对齐;
android:layout_alignRight 控件的右边缘与给定ID的右边缘对齐;

3、居中,例如:android:layout_centerInParent=“true”
android:layout_centerHorizontal 水平居中;
android:layout_centerVertical 垂直居中;
android:layout_centerInParent 父控件的中央;

使用示例

  1. <RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
  2. xmlns:tools="http://schemas.android.com/tools"
  3. android:layout_width="match_parent"
  4. android:layout_height="match_parent"
  5. android:paddingBottom="@dimen/activity_vertical_margin"
  6. android:paddingLeft="@dimen/activity_horizontal_margin"
  7. android:paddingRight="@dimen/activity_horizontal_margin"
  8. android:paddingTop="@dimen/activity_vertical_margin"
  9. tools:context="com.xykj.layout.MainActivity" >
  10. <TextView
  11. android:id="@+id/main"
  12. android:layout_width="match_parent"
  13. android:layout_height="wrap_content"
  14. android:background="#55ff0000"
  15. android:gravity="center"
  16. android:text="相对布局的使用" />
  17. <TextView
  18. android:id="@+id/two"
  19. android:layout_width="wrap_content"
  20. android:layout_height="wrap_content"
  21. android:layout_alignRight="@+id/maine"
  22. android:layout_below="@+id/main"
  23. android:background="#5500ff00"
  24. android:text="二级标题" />
  25. </RelativeLayout>

http://comonly.cn/

发表评论

表情:
评论列表 (有 0 条评论,569人围观)

还没有评论,来说两句吧...

相关阅读