这是我参与「第四届青训营 」笔记创作活动的第3天
课程主要内容
- UI组件
- 布局
- 渲染
- 交互
- 动画
- 自定义View
Andriod UI组件
- UI: User Interface
- Android系统是图形用户界面操作系统
- UI界面由多个不同功能的UI组件构成
- Android SDK提供了大量的UI组件
常规UI组件
常规UI组件大多由Android Framework中的android.widget这个package提供
常规UI组件的属性和方法
常规UI组件的使用
原点：在屏幕的左上角
- margin：整个组件的边距其他的组件或父容器的边距
- padding：文本距它的组件大小的边距
- layout_height：整个UI组件的高度
- layout_width：整个UI组件的宽度
- gravity：子元素在该容器内的对齐方式
- layout_gravity：组件相对于父容器对其方式
高级UI组件
| 组件 | Java Class |
|---|---|
| 滑动组件 | ScrollView |
| 列表组件 | ListView/RecyclerView |
| 下拉刷新组件 | PullToRefresh |
| 分页组件 | ViewPager |
| 布局组件 | LinearLayout/RealtiveLayout/ ... |
常规UI组件大多是View，高级UI组件大多是ViewGroup、比常规UI组件有更多的功能
布局
真正完成布局需要完成3个重要因素：UI组件的大小、位置、层级
LinearLayout(线性布局)
按照单一的方向去做布局(垂直方向，水平方向)
| 属性 | 功能描述 |
|---|---|
| android:orientation | 布局内组件的排列方向 |
| aandroid:layout_weight | 布局内组件大小权重 |
| android:divider | 布局内组件间分割线 |
| android:showDividers | 布局内组件间分割线位置 |
| android:dividerPadding | 布局内分割线padding |
- 以水平/垂直方向排列组件
- 所有子视图在单个方向（垂直或水平)保持对齐
- 适用于线性排列场景
RelativeLayout(相对布局)
- 通过相对父容器/兄弟组件位置排列组件
- 可以消除嵌套视图组并使布局层次结构保持扁平化，从而提高性能
- 一个RelativeLayout就可以替换多个嵌套的LinearLayout组
- 适用于复杂场景
FrameLayout(层级布局)
不同组件进行相应的覆盖
前景图像:永远处于FrameLayout最上层，不会被覆盖的图片
| 属性 | 功能描述 |
|---|---|
| android:foreground | 设置前景图像 |
| android:foregroundGravity | 设置前景图像Gravity |
- 以层级叠加的方式排列组件
- 适用于层级排列场景
ConstraintLayout(类似于RelativeLayout)
- 通过约束组件位置排列组件
- 扩展布局方式
- 所有的视图均根据同级视图与父布局之间的关系进行布局
- 可使用扁平视图层次结构（无嵌套视图组）创建复杂的大型布局
- 为获得更好的性能和工具支持，推进使用ConstraintLayout
- 适用于复杂场景
渲染
布局页面的渲染：布局加载、布局解析、UI渲染
布局加载
- 编写布局文件
- 注册Manifest
- 设置布局文件
setContentView
setContentView创建了DecorView，最终由LayoutInflater来加载了XML文件
布局解析
LayoutInflater
LayoutInflater解析了XML文件，并根据XML文件生成了View实例，并将View实例添加了到了其ViewGroup中
createView
根据XML中View类名来找到相应View，并将XML中的描述属性解析为AttributeSet,并作为第二个参数传给了View构造器
UI渲染
- 页面绘制的起点：onResume()
View绘制流程
UI渲染
后记
这节课我学习了单个UI组件，多个UI组件怎么做排版，整个布局文件的生成、布局文件的解析、UI组件的生成以及到整个屏幕组建的绘制。学习到了一些比较基础的Android的UI知识，去尝试画出一些常规的界面。
