常规&高级UI编程
这是我参与「第四届青训营 」笔记创作活动的第2天
上节回顾
上节课主要讲了客户端基础知识
四大组件包括界面组件(Activity和Fragment);服务组件(Service);广播组件(Broadcast);
数据组件(ContentProvider和CotentResolver)
Q:如何实现Activity中的UI?
A:通过UI组件
1.UI组件
UI:User Interface,是图形用户界面,由UI组件构成(SDK提供)。
输入框组件、按钮组件、列表组件...
常规UI组件
单一组件:
文本组件
图片组件
按钮组件
输入框组件
复选框组件
单选按钮
属性和方法:
通用:属性(id、hight、wigth、margin...)和方法 (setId...)
特定:TextView、ImageView、CheckBox
常规UI组件的使用:
手机屏幕的原点在左上角,left和right、top和bottom。margintop:距父容器的边距
gravity:内容在容器内的对齐方式。layout_gravity:相对父容器。
高级UI组件
Viewgroup,有更多功能,能嵌套组件。
eg:滑动组件
列表组件
下拉刷新组件
分页组件
布局组件
UI组件关系
Viewgroup可以嵌套View,反之则不可以。UI组件都是View,继承关系如下:
eg:ViewGroup继承自View
UI示例和总结
Q:布局文件声明View时未指明位置,什么决定?
2.布局
多个UI组件组成页面时考虑其大小、位置和层级。
4种布局方式:
1.LinearLayout
组件水平或竖直布局,weight属性:剩余空间的分配会根据此权重值。
可以嵌套。
2.RelativeLayout
其中组件的布局根据父容器和兄弟组件定位。
3.FrameLayout
层级叠加的方式布局组件,在Z轴。
4.ConstrainLayout
组件的某部和另一个某部对齐,拓展包支持,适用于复杂场景。
布局总结:
3.渲染
Q:布局页面是如何渲染出来的?
布局加载+布局解析+UI渲染
布局加载
SetContentView;
1.编写布局文件
2.注册Manifest
3.设置布局文件
布局解析
LayoutInflater:它的基本作用是将 xml 布局文件解析成View / View 树。
createView
小结:
页面绘制起点;View绘制流程;页面绘制流程;Vsnc信号;UI渲染;渲染总结
4.交互
1.获取View实例
findViewByte
常用交互事件监听器:
屏幕触摸事件:当用户触摸屏幕时,系统将建立一系列的MotionEventi对象,MotionEvent包含关于发生触摸的位置和时间等细节信息,MotionEvent对象被传递到相应的捕获函数中,例如onTouchEventO。
捕获触摸事件;触摸事件分发;事件处理流程;View的事件响应;
交互总结:
2.添加响应监听器
5.动画
1、帧动画;
每一帧是一张图片
2、补间动画;
可以旋转、移动、缩放操作
差值器
是一个接口,设置属性从初始值过渡到结束值的变化规律。
View动画小结:
3、属性动画;
主要是ValueAnimator和ObjectAnimator。属性动画指的是改变的是View的属性,以位移动画为主。
总结:
常用的API,坐标点选择等