Android UI开发中常见的布局和控件及其属性

UI开发

android 中所有的页面开发一般是写在xml文件中

每一个页面会对应一个activity

每一个activity会有一个xml文件对应

UI = 控件+布局


1. 常见的控件

  • TextView 文本控件

  • EditText 输入框

  • Button 按钮

  • ImageView 图片

99% UI 可以用这四种控件来实现

(学控件就是学属性)

布局中控件的通用属性

  • android:id

  • android : layout_width 和 layout_height

​ 单位是 dp

​ 属性值 : wrap_content 宽度高度会自适应

​ match_parent 高度宽度和父容器相同

  • android : background 背景色

​ 属性值 : 是由6位的16进制数组成 (0123456789ABCDEF)

  • android : layout_margin 控件距离某元素的外边距(单位是dp)

​ layout_marginLeft 控件距离某元素左边缘的距离

​ layout_marginRight 控件距离某元素右边缘的距离

​ layout_marginTop 控件距离某元素顶部边缘的距离

​ layout_marginBottom 控件距离某元素底部边缘的距离

  • android : padding 控件与外层容器的内边距

2. android 中的布局

布局是用来控制控件的位置的

swing 中的布局方式在 Android 中也有与之相对应的布局

  • 边框布局 —— 相对布局

  • 流式布局 —— 线性布局

  • 网格布局 —— 表格布局 (android 已不用了)

  • 卡片布局 —— 帧布局

  • 绝对布局 —— 绝对布局 (android 已不用了)

一个ui 中99.9999% 采用的是相对布局和线性布局,0.00001%的帧布局

约束布局包含了5中布局的所有功能


3. LinearLayout 线性布局

LinearLayout 核心属性 :

​ (1) orientaion 有两个属性值 “vertical” 垂直 “horizontal”水平

​ (2) Layout_weight 将控件与控件间的间隙占满或缩小

​ (3)gravity 例: gravity =“center” 居中

​ (4) Layout_gravity 例:Layout_gravity=“bottom” 置于页面底部

LinearLayout 的缺点 :(1)在某些角落上控件不好实现,剧中也不好实现。

​ (2)写布局的时候嵌套的层次太多,ui中嵌套层次越少越好

Chains 链

(1) 与前端中的flex布局很类似

(2) Chains 链是一种特殊的约束让多个chain链连接的views能够平分剩余空间位置。

(3) 类似Android中LinearLayout 中的权重比 weight ,但Chains 链能做到的远远不止权重比weight 的功能。

在这里插入图片描述


4. RelativeLayout 相对布局

一种根据父布局 或 兄弟控件 来布局定位的布局方式

相对布局 首先要找布局里面的控件有哪些是处于死角的(上下左右中)

父布局定位属性

  • Layout_alignParentLeft 在整个父布局的最左边

  • Layout_alignParentBottom 在整个父布局的最右边

  • Layout_alignParentTop 在整个父布局的最上边

  • Layout_alignParentBottom 在整个父布局的最下边

  • Layout_centerHorizontal 在水平方向的正中间

  • Layout_centerVertical 在垂直方向的正中间

  • Layout_centerParent 在父布局的正中间

    Layout_alignParentLeft Layout_centerHorizontal Layout_alignParentRight
    Layout_centerVertical Layout_centerParent
    Layout_alignParentBottom,Layout_alignParentLeft (左下方) Layout_alignParentBottom,Layout_alignParentBottom (右下方)

根据兄弟控件来定位

  • layout_alignTop

  • layout_alignBottom

  • layout_alignLeft

  • layout_alignRight 与兄弟控件的右边齐平(边与边)

  • layout_above

  • layout_below

  • layout_toLeftOf

  • layout_toRightOf 靠兄弟控件的右边


5. ConstraintLayout 约束布局

为什么用ConstraintLayout ?

1.完全替代传统布局方式

2.减少布局层次

3.可视化布局编程的增强

1.新属性能实现一些复杂的布局效果

—————————————————————————

ConstraintLayout 基础属性

layout_constraintTop_toTopOf

layout_constraintTop_toBottomOf

layout_constraintBottom_toTopOf

layout_constraintBottom_toBottomOf

layout_constraintLeft_toLeftOf

layout_constraintLeft_toRightOf

layout_constraintRight_toRightOf

layout_constraintRight_toLeftOf

——————————————————————————

layout_constraintStart_toEndOf

layout_constraintStart_toStartOf

layout_constraintEnd_toStartOf

layout_constraintEnd_toEndOf

——————————————————————————

layout_constraintBaseline_toBaselineOf 文本基础线


如何正确使用约束布局

1.用相对布局的原理—约束布局中横向和纵向至少要保证有一个约束(弹簧)

2.有均分的地方要用chains

3.文字宽度一般不用固定值,文字单位通常用 wrap_content 或者是 mach_parent

4.图片单位一般用固定值 或者是 mach_parent ,一般不用 wrap_content 。

src 会将图片等比例放大或缩小 , background 会将图片拉伸充满 mach_parent 。


View 和ViewGroup总结

在这里插入图片描述

View是所有控件的父类

ViewGroup是所有布局的父类


图片目录(mipmap)
在这里插入图片描述

dip 屏幕密度 单位面积屏幕像素越多

例: 1080*1920 越小越清晰

/**注本人学生某些知识点可能写的不太好或者有错误欢迎指出。*/

猜你喜欢

转载自blog.csdn.net/m0_46388312/article/details/106905780