6.Android-五大布局
发布日期:2021-05-09 04:34:32 浏览次数:9 分类:博客文章

本文共 3051 字,大约阅读时间需要 10 分钟。

Android 五大布局如下所示:

LinearLayout

线性布局

只能指定一个方向(垂直/水平)来布局

RelativeLayout

相对布局

通过某个控件为参照物,来定位其它控件的位置的布局方式(解决屏幕适配)

TableLayout

表格布局

如果子元素为<TableRow>,则可在一行中放各种控件

FrameLayout

帧布局

子元素任意

AbsoluteLayout

绝对布局

通过android:layout_x和android:layout_y来指定元素绝对位置,由于不支持适配,已过时

 

1.如何创建布局

在layout下选择New Android XML File:

 

然后输入名称,即可完成:

 

 

2.LinearLayout线性布局

LinearLayout特有的属性如下所示:

android:orientation=                                //设置布局方向,填写“horizontal”或者“vertaical”

vertaical方向

xml如下所示:

 

对应的布局则是垂直向下的,一排只能拥有一个控件:

 

horizontal方向

xml如下所示:

 

对应的布局则是水平向右的,一列只能拥有一个控件:

 

 

设置控件不同比例

如果要想设置两个控件的比例大小,则设置android:layout_weight(不是android:layout_width),值越大则比例越大(垂直布局则设置高度大小比例,水平布局则设置宽度大小比例)

以垂直线性布局为例,我们设置TextView1占据高度为2倍,其余为1倍

xml设置如下:

 

界面如下所示:

 

PS:在布局中也可以再次添加一个布局.

比如LinearLayout垂直布局中添加一个LinearLayout水平布局,实现登录案例

xml如下:

 效果如下:

 如果只有一个控件设置了android:layout_weight="1",则需要将自身的android:layout_width="0dp",并表示该控件占据剩余的所有空间,如上图的"保存信息"

3.RelativeLayout相对布局

为某一个组件为参照物,来定位下一个组件的位置的布局方式。一般为了解决屏幕分辨率不同的自适应问题(适配神器)

LinearLayout特有的属性如下所示:

android:layout_alignParentLeft

android:layout_alignParentRight

android:layout_alignParentTop

android:layout_alignParentBottom

“true”

“false”

控件在LinearLayout布局中的相对位置

android:orientation 

“horizontal”

“vertaical”

布局中子控件排布方向

android:layout_toRightOf

android:layout_toLeftOf

android:layout_below

android:layout_above

“@+id/***”

控件和某个控件的位置关系(居右、左、下、上)

android:layout_alignTop

android:layout_alignBottom

android:layout_alignLeft

android:layout_alignRight

android:layout_alignBaseline

“@+id/***”

控件与其他控件对齐(顶部对齐、底部、左、右对齐、基线(文本内容)对齐)

android:layout_centerHorizontal

android:layout_centerVirtical

android:layout_centerInParent

“true”

“false”

指定控件位于水平/垂直/父控件的中间位置

如下图所示:

注意:在指定位置关系时,引用的ID必须在引用之前,先被定义,否则将出现异常。

 

示例-通过RelativeLayout实现固定九宫格(如果要动态实现增删格子,最好还是用GridLayout)

xml如下:

布局如下:

 

 

4.FrameLayout帧布局

默认所有的控件都是左上对齐(每个控件对应每个界面)。控件可以通过android:layout_gravity属性控制自己在父控件中的位置。

而android:gravity表示:设置文本位置,如设置成”center”,文本将居中显示。

比如下面xml:

  

布局如下:

 

可以看到TextView1已经被覆盖了.

修改textview1,设置为居中:

 

布局效果如下所示:

 

 

 

5.TableLayout表格布局

TableLayout特有元素TableRow

通过TableRow可以在一行中放各种控件.

示例如下:

布局效果如下:

 

如上图所示,可以看到只有通过TableRow元素包含的控件才能占据为1行.

TableLayout特有属性如下所示:

  • android:collapseColumns:   设置需要被隐藏的列的序号
  • android:shrinkColumns:       设置允许被收缩的列的列序号
  • android:stretchColumns:     设置运行被拉伸的列的列序号

collapseColumnsandroid:stretchColumns属性示例

布局效果如下:

 

由于设置android:collapseColumns="1,2",所以TextView1和TextView2所在的列被隐藏了.

然后android:stretchColumns="3",由于第一个button位于第3列,所以被拉伸了(列数是从0开始的)

 

android:shrinkColumns属性示例

布局如下所示:

 

由于android:shrinkColumns="1",所以第二个列支持收缩.

 

6.AbsoluteLayout绝对布局

已过时, 通过android:layout_x和android:layout_y来指定元素绝对位置,所以不能适配各个不同屏幕大小.

示例如下:

布局如下:

 

 

 

 

 

 

 

上一篇:52.Qt-Charts动态显示多条折线电压值(实现示波器效果)
下一篇:5.Android-电话拨号器详解

发表评论

最新留言

留言是一种美德,欢迎回访!
[***.207.175.100]2025年04月03日 10时19分01秒

关于作者

    喝酒易醉,品茶养心,人生如梦,品茶悟道,何以解忧?唯有杜康!
-- 愿君每日到此一游!

推荐文章