Android UI组件 | 青训营笔记

115 阅读3分钟

这是我参与「第四届青训营 」笔记创作活动的第2天。笔记涵盖课程第三节。

Android UI 组件

Android Framework中的android.widget的package提供
输入框组件EditText、按钮组件Button、文本组件TextView、图片组件imageView、播放器组件、复选框组件CheckBox、单选按钮RadioButton、
常规view都有属性(id,height,width,margin,padding)和方法(setId(),setLayoutParams()...)
各种view又有自己特殊的方法。

常规UI组件的使用

安卓中,使用xml定义各属性

<TextView
          android:id="@+id/tv_title"
          android:layout_width="200dp"
          android:layout_height="200dp"
          android:layout_margin="20dp"
          <!--组件相对于父容器对齐方式-->
          android:layout_gravity="center"   
          <!--子元素在该容器内的对齐方式-->
          android:gravity="center"
          android:padding="10dp"
          android:text="@string/app_name"
          android:textSize="20sp"
          android:textColor="@color/colorAccent"
          android:visibility="visible"
          android:background="@color/colorPrimary"/>

高级UI组件

滑动组件ScrollView,列表组件ListView/RecyclerView,下拉刷新组件PullToRefresh,分页组件ViewPager,布局组件LinearLayout/RelativeLayout/...
高级UI组件大多是一个ViewGroup,可以承担各种嵌套关系。
ViewGroup可以包含View,View不能包含View。

布局文件中声明View是并没有指定View的位置,单个View的位置是如何决定的?

布局

布局:大小,位置,层级。

布局方式

LinearLayout 按照单一方向(水平或竖直)进行排列,适用于线性排列场景
也可以嵌套,LinearLayout里有LinearLayout
属性
android:orientation 排列方向
android:layout_weight 大小权重
android:divider 分割线
android:showDividers 是否显示分隔线
android:dividerPadding

示例

RelativeLayout 相对布局,通过相对父容器、兄弟组件位置排列组件,可以消除嵌套视图使布局层次结构保持扁平化,从而提高性能。一个RelativeLayout可以替换多个嵌套的LinearLayout组。

根据父容器定位:android:layout_centerInParent,
android:centerHorizontal,
android:layout_centerVertical,
android:layout_alignParentTop,
android:layout_alignParentLeft,
android:layout_alignParentRight,
android:...
根据兄弟组件定位:

示例

FrameLayout 开始有不同组件的覆盖,层级叠加。

android:foreground 设置前景图像
android:foregroundGravity 置前

ConstraintLayout 一种扩展布局方式,类似相对布局,但是通过约束组件位置排列组件。所有视图根据同级视图与父布局之间的关系进行布局,获得更好的性能和工具支持。

image.png

渲染

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

布局加载:

  1. 编写布局文件(xml)
  2. 注册Manifest
  3. 设置布局文件(有java对象)

交互

交互事件监听器 onClick() onLongClick() onFocousChange() onKey() onTouch()

触摸事件-MotionEvent ACTION_DOWN ACTION_UP ACTION_MOVE ACTION_CANCEL ACTION_POINTER_DOWN ACTION_POINTER_UP

动画

帧动画

作用于View,如ImageView、TextView,不可作用于view的属性。将一帧一帧的图片顺序播放。

补间动画

作用对象同上,原理通过确定开始视图样式和结束视图样式,中间由系统根据插值器决定。 应用于:透明度改变,平移,缩放,旋转四种动画。

插值器Interpolator,是一个接口,设置属性值的变化规律。

帧动画和补间动画都是view动画。

属性动画可以实现更加复杂的动画效果,不止补间动画的四种。作用于任意Java对象,不局限于View。 原理:在指定时间间隔内,通过不断对值的改变和不断将值赋给对象的属性,从而实现该对象在该属性上的动画效果。

自定义UI