这是我参与「第四届青训营 」笔记创作活动的第3天

课上笔记

1 UI组件

• UI：User Interface
• Android系统是图形用户界面操作系统
• UI界面由多个不同功能的UI组件构成
• Android SDK提供了大量的UI组件

常用 UI 组件

UI 组件间联系

高级 UI 组件

2 布局

如何将多个 UI 组件组成一个界面？

大小 位置 层级

常用布局：

• LinearLayout
• RelativeLayout
• FrameLayout
• ConstraintLayout

LinearLayout布局示例：

    android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:paddingLeft="16dp"
    android:paddingRight="16dp"
    android:orientation="vertical" > //垂直排列

    <EditText        
        android:layout_width="match_parent"       //适配父容器 
        android:layout_height="wrap_content" />   

    <EditText        
        android:layout_width="match_parent"      //适配父容器 
        android:layout_height="wrap_content" />   

    <EditText       
        android:layout_width="match_parent"     
        android:layout_height="0dp"     //高度为0
        android:layout_weight="1"      //权重为1，默认为0
        android:gravity="top" />   

    <Button      
        android:layout_width="100dp"       
        android:layout_height="wrap_content"     
        android:layout_gravity="right" />
</LinearLayout>

布局总结：

3 渲染

布局页面是如何被加载出来的？

• 布局加载
• 布局解析
• UI 渲染

布局加载

• 1.编写布局文件
• 2.注册Manifest
• 3.设置布局文件

渲染总结：

4 交互

常用交互事件监听器

触摸事件

当用户触摸屏幕时，系统将建立一系列的MotionEvent对象，MotionEvent包含关于发生触摸的位置和时间等细节信息，MotionEvent对象被传递到相应的捕获函数中，例如onTouchEvent()。

捕获触摸事件

• Activity和View都有onTouchEvent()，用于处理触摸事件。
• 当用户触摸屏幕时，会回调触摸视图上的onTouchEvent()。

交互总结

5 动画

常见动画类型

• 帧动画

• 补间动画

• 属性动画

帧动画

补间动画

属性动画

动画总结

• 两类动画的根本区别在于：是否改变动画本身的属性
• 视图动画只改变视图效果而不改变动画属性
• 属性动画改变了动画的属性

6 自定义UI

课程总结

• UI 组件是Android系统的门面
• 优秀的布局可以提升 UI 组件的视觉效果
• UI 组件是通过渲染呈现出来的
• 交互事件监听器获取用户的操作并给予反馈
• 在App中合理地使用动画能够获得友好愉悦的用户体验