UI(User Interface)界面是人与手机之间数据传递的、信息交互的重要媒介和对话窗口,是Android系统的重要组成部分。设计美观的UI界面布局是必不可少的组件。
布局的类型Linear Layout(线型布局)、Relative Layout (相对布局)、Frame Layout(帧布局)、Table Layout(表格布局)、Absolute Layout(绝对布局)、Grid Layout(网格布局)
1.线性布局LinearLayout线性布局在Android开发过程中会经常使用,它使用标签表示。介绍线性布局主要有两种形式,一种是水平线性布局,显示顺序依次为从左到右;一种是垂直线性布局,显示顺序依次为从上到下。
Orientation属性,用于控制控件的排列方向,该属性有vertical(垂直显示)和horizontal(水平显示)两个值
(注意:
当设置成垂直线性显示时,一行只能放一个控件,从上到下依次往下排,当排出窗体边缘以后将不再显示
当设置成水平线性显示时,一列只能放一个控件,从左到右依次往右排,当排出窗体边缘以后将不再显示)
表1-1 自身常用属性
android:orientation | 设置排列方式 |
---|---|
android:gravity | 设置组件显示 |
android:layout_width | 设置布局宽度 |
android:layout_height | 设置布局高度 |
如
android:orientation=”vertical” 垂直线性布局
android:orientation=” horizontal” 水平线性布局
android:gravity=“center”//居中显示
android:gravity=“right|bottom”//居右下角显示”
android:layout_width=”wrap_content” 布局宽度包裹其自身内容
android:layout_width=” match_parent” 布局宽度与父窗体大小相同
android:layout_height=”wrap_content” 布局高度包裹其自身内容
android:layout_height=”match_parent” 布局高度与父窗体大小相同
注意:
子组件属性 android:layout_weight属性,用于设置组件所占的权重,设置组件占父容器剩余空间的比例,默认值为0。(注意是占据剩余的空间)
创建程序后默认就是相对布局,相对布局是通过相对定位的方式指定控件位置,即以其它控件或父容器为参照物,摆放控件位置。在设计相对布局时要遵循控件之间的依赖关系,后放入控件的位置依赖于先放入的控件。
表1-2 自身常用属性
android:gravity | 设置各子组件的摆放位置 |
---|---|
android:ignoreGravity | 设置那个组件不受前面影响 |
如
android:gravity=“center” //组件居中显示
android:ignoreGravity=“@id/控件id名字” //设置控件不受前面影响
相对布局内部类 RelativeLayout.LayoutParams提供的属性,用于设置控件的摆放位置
表1-3 子控件属性
android:layout_centerlnParent | 设置当前控件位于父布局的中央位置 |
---|---|
android:layout_centerVertical | 设置当前控件位于父布局的垂直居中位置 |
android:layout_centerHorizontal | 设置当前控件位于父布局的水平居中位置 |
android:layout_above | 设置当前控件位于某控件上方 |
android:layout_below | 设置当前控件位于某控件下方 |
android:layout_toLeftOf | 设置当前控件位于某控件左侧 |
android:layout_toRightOf | 设置当前控件位于某控件右侧 |
android:layout_alignParentLeft | 设置当前控件是否与父控件左对齐 |
android:layout_alignParentRight | 设置当前控件是否与父控件右对齐 |
android:layout_alignParentTop | 设置当前控件是否与父控件顶端对齐 |
android:layout_alignParentBottom | 设置当前控件是否与父控件底端对齐 |
android:layout_alignTop | 设置当前控件的上边界与某控件的上边界对齐 |
android:layout_alignBottom | 设置当前控件的下边界与某控件的下边界对齐 |
android:layout_alignLeft | 设置当前控件的左边界与某控件的左边界对齐 |
android:layout_alignRight | 设置当前控件的右边界与某控件的右边界对齐 |
表1-4 设置控件外边距属性
android:layout_marginTop | 当前控件上边界与某控件的距离 |
---|---|
android:layout_marginBottom | 当前控件下边界与某控件的距离 |
android:layout_marginLeft 或android:layout_marginStart | 当前控件左边界与某控件的距离 |
android:layout_marginRight 或android:layout_marginEnd | 当前控件右边界与某控件的距离 |
如
android:layout_marginTop=“24dp” //设置顶端外边距24dp
表1-5 设置控件内边距属性
android:layout_paddingTop | 设置布局顶部内边距的距离 |
---|---|
android:layout_paddingBottpm | 设置布局底部内边距的距离 |
android:layout_paddingLeft 或android:layout_paddingStart | 设置布局左边内边距的距离 |
android:layout_paddingRight 或android:layout_paddingEnd | 设置布局右边内边距的距离 |
如
android:layout_paddingBottpm=“16dp” //设置底端内边距16dp
拓展知识:空间的单位
为了让程序拥有更好的屏幕适配能力,设置控件的宽高最好是“match_parent”或“wrap_content”,避免设置固定值,防止控件相互挤压变形。在特殊情况下需要使用固定宽高时,可以选择px、pt、dp、sp四种单位。如android:layout_width=”24dp” // 指定值为24dp
px:代表像素,即在屏幕中可以显示的最小元素单位,应用程序中任何控件都是由一个像素点组成的。分辨率越高的手机,屏幕像素点就越多,用px控制控件的大小,在不同手机上控件显示的大小也不同。
pt:代表磅数,一磅等于1/72英寸,一般pt都不会作为字体的单位来显示。pt和px一样,不同手机控件大小不同。
dp:一种基于屏幕密度的抽象单位。不同设备有不同的显示效果,根据屏幕分辩率来确定控件的大小
sp:代表可伸缩像素,采用与dp相同的设计理念,推荐设置文字大小时使用
帧布局为每个加入其中的控件创建一个空白区域(称为一帧,每个控件占据一帧)。采用帧布局方式设计界面时,所有控件都默认显示在屏幕左上角,并按照先后放入的顺序重叠摆放,先放入的控件显示在最底层,后放入的控件显示在最顶层。帧布局的大小由内部最大控件的决定。
表1-6 常用属性
android:foreground | 设置帧布局容器的前景图像(始终在所有子控件之上) |
---|---|
android:foregroundGravity | 设置前景图像显示位置 |
注意:
前景图像:就是始终位于屏幕最上层的图像,不被其他图像盖住。默认显示整个屏幕
(以行列的形式显示控件,用TableRow容器控制行数,也可以不把控件放TableRow中,直接放TableLayout布局中)
注意:不能自动换行
表格布局是让控件以表格的形式来排列组件的,只要将组件或信息放在单元格中,组件就可以整齐的排列,这是表格布局的特点。
在TableLayout中,行数由TableRow对象控制,即布局中有多少TableRow对象,就有多少行。每个TableRow中可以放置多个组件。
表1-7 常用属性
android:stretchColumns | 设置列可被拉伸,列号从“0”开始 |
---|---|
android:shrinkColumns | 设置列可被收缩,列号从“0”开始 |
android:collapseColumns | 设置列可被隐藏,列号从“0开始 |
如
android:stretchColumns=“0”//第1列拉伸
android:shrinkColumns=“1,2”//第2,3列可收缩
android:collapseColumns=“0”//第1列隐藏
表1-8 表格布局子组件常用属性,用于设置控件的显示位置,占据行数
android:layout_column | 设置控件显示第几列的位置,下标从0开始 |
---|---|
android:layout_span | 设置控件占据几列,默认一行 |
如
android:layout_column=“1” //表示在第2个位置显示
Android4.0推出的,在网格布局管理器中用虚拟的细线划分行列和单元格(单元格可以跨行和跨列显示,超出边缘后可以自动换行)
表1-9 常用属性
android:columnCount | 指定网格最大列数 |
---|---|
android:orientation | 设置排列方式 |
android:rowCount | 指定网格最大行数 |
如
android:columnCount=“2”//最大列数为2列
android:rowCountt=“2”//最大行数为2行
控制各子组件的分布方式提供一个内部类 GridLayout.LayoutParams
表1-10 子组件常用属性
android:layout_column | 子组件位于网格的第几列的 |
---|---|
android:layout_columnSpan | 设置子组件横向跨几列的 |
android:layout_columnWeight | 设置子组件水平方向上的权重 |
android:layout_gravity | 设置子组件采用什么方式占用网格空间 |
android:layout_row | 子组件位于网格的第几行 |
android:layout_rowSpan | 设置子组件纵向跨几行的 |
android:layout_rowWeight | 设置子组件垂直方向上的权重 |
如
android:layout_column=“0”//位于第一列
android:layout_columnSpan=“2”//跨两列显示
android:layout_gravity=“fill”//填充控件
android:layout_row=“0” //位于第一行
android:layout_rowSpan=“2”//跨两行显示
绝对布局(AbsoluteLayout)是通过指定x、y坐标来控制每一个控件位置的。但是在GoogleAPI中提示此类已弃用,可使用FrameLayout,RelativeLayout代替它。
表1-11 设置控件位置属性
android:layout_x | 设置x坐标 |
---|---|
android:layout_y | 设置y坐标 |
原则:
1.根布局管理器必须包含xmlns属性
2.在一个布局文件中,最多只能有一个根布局管理器,如果需要有多个还需要使用一个根布局管理器将它们括起来
3.不要嵌套太深,如果嵌套太深,则会影响性能
作者:晨曦&梓晨