Android五大布局

标题常见界面布局

Android系统提供五种常用布局分别为LinearLayout(线性布局)、RelativeLayout(相对布局)、FrameLayout(帧布局)、TableLayout(表格布局)、ConstraintLayout(约束布局)

布局的通用属性

android:id 设置布局的标识
android:layout_width 设置布局的宽度
android:layout_height 设置布局的高度
android:background 设置布局的背景
android:layout_margin 设置当前布局与屏幕边界或与周围控件的距离
android:padding 设置当前布局与该布局中控件的距离

RelativeLayout(相对布局)

RelativeLayout(相对布局)通过相对定义的方式指定子控件的位置。XML标签,定义格式如下

android: layout_centerParent 设置当前控件位于父布局的中央位置
android: layout_centerVertical 设置当前控件位于父布局的垂直居中位置
android:layout_centerHorizontal 设置当前控件位于父布局的水平居中位置
android:layout_above 设置当前控件位于某控件上方
android:layout_below 设置当前控件位于某控件下方
android:layout_toLeft(Right)Of 设置当前控件位于某控件左(右)侧
android:layout_alignParentTop(Left,Right,Bottom) 设置当前控件是否与父控件顶端(左,右,底端)对齐
android:layout_alignTop(Bottom) 设置当前控件的上(下)边界与某控件的上边界对齐
android:layout_alignLeft(Right) 设置当前控件的左(右)边界与某控件的右边界对齐

LinearLayout(线性布局)

LinearLayout(线性布局)通过指定布局内的子控件水平或者竖直排列。在XML中定义LinearLayout(线性布局)的基本语法格式如下

android: oruentation 设置布局内控件的排列顺序
android: layout_weight 在布局内设置控件权重,属性值可直接写int值

TableLayout(表格布局)

TableLayout(表格布局)采用行、列的形式来管理控件,它不需要明确声明包含多少行、多少列,而是通过在TableLayout(表格布局)中添加TableLayout(表格布局)或控件来控制表格的行数,可以在TableRow布局中添加控件来控制表格的列数。在XML中定义TableLayout(表格布局)的基本语法格式如下

android:stretchColumns 设置可被拉伸的列。
android:shrinkColumns 设置可被收缩的列。
android:collapseColumns 设置可被隐藏的列。

FrameLayout(帧布局)

FrameLayout(帧布局)用于在屏幕上创建一块空白区域,添加到该区域中的每个子控件占一帧,这些帧会一个一个叠加在一起,后加入的控件会叠加在上一个控件上层。默认情况下,帧布局中的所有控件会与左上角对齐。在XML中定义FrameLayout(帧布局)的基本语法格式如下

android: foreground 设置帧布局容器的前景图像(始终在所有子控件之上)
android: foregroundGravity 设置前景图像显示的位置

ConstraintLayout(约束布局)

ConstraintLayout(约束布局)是Android Studion 2.2新添加的布局。与前介绍的界面布局相比,ConstraintLayout(约束布局)并不太适合使用XML代码的方法编写布局,但是它非常适合使用可视化的方式编写界面布局。

layout_constraintHorizontal_bias 横向的倾向
layout_constraintVertical_bias 纵向的倾向

  • 1
    点赞
  • 1
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
好的,下面给出每种布局的一个简单实例: 1. 线性布局(LinearLayout) ```xml <LinearLayout android:layout_width="match_parent" android:layout_height="wrap_content" android:orientation="vertical"> <TextView android:layout_width="match_parent" android:layout_height="wrap_content" android:text="Hello" android:textSize="20sp" /> <TextView android:layout_width="match_parent" android:layout_height="wrap_content" android:text="World" android:textSize="20sp" /> </LinearLayout> ``` 2. 相对布局RelativeLayout) ```xml <RelativeLayout android:layout_width="match_parent" android:layout_height="match_parent"> <TextView android:id="@+id/text1" android:layout_width="wrap_content" android:layout_height="wrap_content" android:text="Hello" android:textSize="20sp" /> <TextView android:id="@+id/text2" android:layout_width="wrap_content" android:layout_height="wrap_content" android:text="World" android:textSize="20sp" android:layout_below="@id/text1" android:layout_alignParentRight="true" /> </RelativeLayout> ``` 3. 帧布局(FrameLayout) ```xml <FrameLayout android:layout_width="match_parent" android:layout_height="match_parent"> <ImageView android:layout_width="match_parent" android:layout_height="match_parent" android:src="@drawable/image1" android:scaleType="centerCrop" /> <TextView android:layout_width="wrap_content" android:layout_height="wrap_content" android:text="Hello" android:textSize="20sp" android:layout_gravity="center" /> </FrameLayout> ``` 4. 表格布局(TableLayout) ```xml <TableLayout android:layout_width="match_parent" android:layout_height="match_parent"> <TableRow> <TextView android:layout_width="wrap_content" android:layout_height="wrap_content" android:text="Name" /> <EditText android:layout_width="match_parent" android:layout_height="wrap_content" android:hint="Enter your name" /> </TableRow> <TableRow> <TextView android:layout_width="wrap_content" android:layout_height="wrap_content" android:text="Age" /> <EditText android:layout_width="match_parent" android:layout_height="wrap_content" android:hint="Enter your age" /> </TableRow> </TableLayout> ``` 5. 网格布局(GridLayout) ```xml <GridLayout android:layout_width="match_parent" android:layout_height="match_parent" android:rowCount="3" android:columnCount="3"> <TextView android:layout_width="0dp" android:layout_height="wrap_content" android:text="1" android:textSize="20sp" android:layout_row="0" android:layout_column="0" android:layout_columnWeight="1" /> <TextView android:layout_width="0dp" android:layout_height="wrap_content" android:text="2" android:textSize="20sp" android:layout_row="0" android:layout_column="1" android:layout_columnWeight="1" /> <TextView android:layout_width="0dp" android:layout_height="wrap_content" android:text="3" android:textSize="20sp" android:layout_row="0" android:layout_column="2" android:layout_columnWeight="1" /> <TextView android:layout_width="0dp" android:layout_height="wrap_content" android:text="4" android:textSize="20sp" android:layout_row="1" android:layout_column="0" android:layout_columnWeight="1" /> <TextView android:layout_width="0dp" android:layout_height="wrap_content" android:text="5" android:textSize="20sp" android:layout_row="1" android:layout_column="1" android:layout_columnWeight="1" /> <TextView android:layout_width="0dp" android:layout_height="wrap_content" android:text="6" android:textSize="20sp" android:layout_row="1" android:layout_column="2" android:layout_columnWeight="1" /> <TextView android:layout_width="0dp" android:layout_height="wrap_content" android:text="7" android:textSize="20sp" android:layout_row="2" android:layout_column="0" android:layout_columnWeight="1" /> <TextView android:layout_width="0dp" android:layout_height="wrap_content" android:text="8" android:textSize="20sp" android:layout_row="2" android:layout_column="1" android:layout_columnWeight="1" /> <TextView android:layout_width="0dp" android:layout_height="wrap_content" android:text="9" android:textSize="20sp" android:layout_row="2" android:layout_column="2" android:layout_columnWeight="1" /> </GridLayout> ``` 以上是五种布局的简单实例,开发者可以根据具体需求进行修改和调整。
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值