栏目分类:
子分类:
返回
名师互学网用户登录
快速导航关闭
当前搜索
当前分类
子分类
实用工具
热门搜索
名师互学网 > IT > 软件开发 > 后端开发 > Java

基本UI设计之布局管理器

Java 更新时间: 发布时间: IT归档 最新发布 模块sitemap 名妆网 法律咨询 聚返吧 英语巴士网 伯小乐 网商动力

基本UI设计之布局管理器

Layout

布局是可以放置许多控件的容器,它可以按照一定规律调整内部控件的位置,从而编写出精美的画面。
Layout(布局)是ViewGroup的实现类(即子类),为视图控件提供排列结构。
布局可以嵌套使用

常用的布局:

frameLayout(帧布局)
LinearLayout(线性布局)
TableLayout(表格布局)
RelativeLayout(相对布局)
AbsoluteLayout(绝对布局)

布局参数:

布局参数定义控件的位置、尺寸等属性。
控件的位置由视图的左上点坐标、对齐方式等属性确定。
控件的尺寸由视图的宽度、高度等属性确定。

重要属性 线性布局LinearLayout

LinearLayout包含的子控件将以横向或竖向的方式排列。超过边界时,某些控件将缺失或是消失。
线性布局(LinearLayout)是一种重要的界面布局中,也是经常使用到的一种界面布局
在线性布局中,所有的子元素都按照垂直或水平的顺序在界面上排列,不会换行
如果垂直排列,则每行仅包含一个界面元素
如果水平排列,则每列仅包含一个界面元素
属性android:orientation
horizontal(水平)
vertical(垂直)


在线性布局中,有个非常重要的属性gravity,这个属性用来指定组件内容的对齐方式。
gravity的中文意思就是”重心“,就是表示view横向和纵向的停靠位置 ,支持top、bottom、left、right、center_vertical、 fill_vertical、center_horizontal、fill_horizontal、center、fill、 clip_vertical、clip_horizontal几个属性值。
可以同时指定多种对齐方式,如left|center_vertical表示出 现在屏幕左边,并且垂直居中 。




在线性布局中,LinearLayout有两个非常相似的属性:android:gravity与android:layout_gravity
android:gravity:是对view控件本身来说的,是用来设置view本身的内容应该显示在view的什么位置,默认值是左侧 。
android:layout_gravity:是相对于包含该元素的父元素来说的,设置该元素在父元素的什么位置 。

在线性布局中,LinearLayout还支持为其包含的widget或者是container指定填充权值layout_weight
默认的 weight 值为0 ,表示按照widgets或者是containers实际大小来显示,若高于0的值,则将 Container剩余可用空间分割,分割大小具体取决于每一个widget或者是 container的layout_weight及该权值在所有widgets或者是containers中的比例

相对布局(RelativeLayout)

概念:
相对布局是通过指定当前控件与兄弟器件或者父控件之间的相对位置,从而达到控制控件的目的。
对于相对布局,首先应该先确定一个控件,再确定第二个控件相对于第一个控件的相对位置。
为什么要是用相对布局?
线性结构层级结构复杂,多嵌套,灵活性差。而采用相对布局,可以减少控件间的层级关系,提高界面的编程效率。

设置组件与组件之间的对齐方式的属性

设置组件与父组件之间的对齐关系的属性

设置组件方向的相关的属性

相对布局的使用示例

在使用RelativeLayout进行布局设置时选择第1个参照对象非常重要,第1个参照对象一旦选定,其他对象就可以相对于该参照进行摆布。







案例:实现如图效果


Step1:
添加TextView控件(“用户名”),相对布局会将TextView控件放置在屏幕的最上方



Step2:
添加EditText控件(输入框)并声明该控件的位置在TextView控件的下方,相对布局会根据TextView的位置确定EditText控件的位置。


Step3:
添加第一个Button控件(“取消”按钮),声明在EditText控件的下方,且在父控件的最右边。


Step4:
最后,添加第二个Button控件(“确认”按钮),声明该控件在第一个Button控件的左方,且与第一个Button控件处于相同的水平位置。


相对布局常用属性


frameLayout(帧布局)

framelayout继承自ViewGroup,使用framelayout布局管理器时,整个界面被当成一块空白备用区域,所有的子元素都不能被指定放置的位置,它们全部放在这块区域的左上角,并且后面的子元素直接覆盖在前面的子元素之上,将前面的子元素部分或全部遮挡,即帧布局的大小由子元素中尺寸最大的那个子元素来决定。如果子元素一样大,同一时刻只能看到最上面的子元素。
是最简单的布局方式。
从屏幕的左上角开始显示子对象。
后添加的对象覆盖前一个对象。

例:实现如图效果—霓虹灯


Step1:修改color.xml文件,定义颜色值

<?xml version="1.0"encoding="utf-8"?>

#ffff00
#ff00ff
#00ffff
#0ffff0
#326864
#00ff00
#ff0000

Step2:UI布局设计
为了达到霓虹灯的效果,本示例中用7个TextView分别表示7个不同的霓虹灯管,7个TextView的宽度和高度依次递减20dp并设置为不同的背景色。
TableLayout (表格布局)
也是一种常用的界面布局,它将屏幕划分网格,将子控件的位置通过指定行和列添加的网格中,控件就可以整齐的排列。
在TableLayout中,行数由TableRow对象控制,每个TableRow定义一个Row
网格的边界对用户是不可见的。
表格布局还支持嵌套,可以将另一个表格布局放置在前一个表格布局的网格中,也可以在表格布局中添加其他界面布局,例如线性布局、相对布局等等。

表格布局常用属性

表格布局常用属性

android:layout_column:设置该控件在TableRow中指定的列
TableLayout可以对列进行隐藏,压缩,拉伸
android:stretchColumns 设置可伸展的列。该列可以向行方向伸展,最多可占据一整行。
android:stretchColumns=“0” 第0列可伸展
android:shrinkColumns 设置可收缩的列。当该列子控件的内容太多,已经挤满所在行,那么该子控件的内容将往列方向显示
android:shrinkColumns=“1” 第1列可收缩
android:collapseColumns 设置要隐藏的列。
android:collapseColumns=“1” 隐藏第1列
android:layout_column 指定该单元格在第几列显示
android:layout_span 指定该单元格占据的列数(未指定时,为1)
android:layout_column=“1” 该控件显示在第1列
android:layout_span=“2” 该控件占据2列
说明:一个控件也可以同时具备这两个特性。

AbsoluteLayout (绝对布局)

绝对布局中,系统不提供任何布局控制,开发人员通过X坐标,Y坐标来控制组件的位置。
Android手机屏幕的尺寸和分辨率差别很大,使用绝对布局很难适应不同的屏幕分辨率。
属性 android:layout_x 、android:layout_y
屏幕左上角为坐标原点(0,0),第一个0代表横坐标,向右移动此直增大,第二个0代表纵坐标,向下移动,此值增大。
在实际开发中,通常不采用此布局格式,因为它的界面代码过于刚性,以至于有可能不能很好的适配各种终端。
欢迎大家加我微信交流讨论(请备注csdn上添加)

转载请注明:文章转载自 www.mshxw.com
本文地址:https://www.mshxw.com/it/282509.html
我们一直用心在做
关于我们 文章归档 网站地图 联系我们

版权所有 (c)2021-2022 MSHXW.COM

ICP备案号:晋ICP备2021003244-6号