Android UI绘制流程及原理详解

一、绘制流程源码路径

1、Activity加载ViewRootImpl

ActivityThread.handleResumeActivity()
--> WindowManagerImpl.addView(decorView, layoutParams)
--> WindowManagerGlobal.addView()

2、ViewRootImpl启动View树的遍历

ViewRootImpl.setView(decorView, layoutParams, parentView)
-->ViewRootImpl.requestLayout()
-->scheduleTraversals()
-->TraversalRunnable.run()
-->doTraversal()
-->performTraversals()(performMeasure、performLayout、performDraw)

二、View绘制流程

1、measure

(1)MeasureSpec是什么?

重写过onMeasure()方法都知道,测量需要用到MeasureSpec类获取View的测量模式和大小,那么这个类是怎样存储这两个信息呢?

留心观察的话会发现,onMeasure方法的两个参数实际是32位int类型数据,即:

00 000000 00000000 00000000 00000000

而其结构为 mode + size ,前2位为mode,而后30位为size。

==> getMode()方法(measureSpec --> mode):

private static final int MODE_SHIFT = 30;
// 0x3转换为二进制即为:11
// 左移30位后:11000000 00000000 00000000 00000000
private static final int MODE_MASK = 0x3 << MODE_SHIFT;

public static int getMode(int measureSpec) {
 // 与MODE_MASK按位与运算后,即将低30位清零,结果为mode左移30位后的值
 return (measureSpec & MODE_MASK);
}

getSize()方法同理。

==> makeMeasureSpec()方法(mode + size --> measureSpec):

public static int makeMeasureSpec(
 @IntRange(from = 0,
  to = (1 << MeasureSpec.MODE_SHIFT) - 1) int size,
 @MeasureSpecMode int mode) {
 if (sUseBrokenMakeMeasureSpec) {
  return size + mode;
 } else {
  return (size & ~MODE_MASK) | (mode & MODE_MASK);
 }
}

这里解释一下,按位或左侧为size的高2位清零后的结果,右侧为mode的低30位清零后的结果,两者按位或运算的结果正好为高2位mode、低30位size,例:

01000000 00000000 00000000 00000000 |
00001000 00001011 11110101 10101101 =
01001000 00001011 11110101 10101101

二进制计算规则可参考:https://www.jb51.net/article/166892.htm

==> 测量模式:

public static final int UNSPECIFIED = 0 << MODE_SHIFT;
public static final int EXACTLY  = 1 << MODE_SHIFT;
public static final int AT_MOST  = 2 << MODE_SHIFT;

UNSPECIFIED:父容器不对View作任何限制,系统内部使用。

EXACTLY:精确模式,父容器检测出View大小,即为SpecSize;对应LayoutParams中的match_parent和指定大小的情况。

AT_MOST:最大模式,父容器指定可用大小,View的大小不能超出这个值;对应wrap_content。

(2)ViewGroup的测量流程

回到ViewRootImpl的performMeasure方法,这里传入的参数为顶层DecorView的测量规格,其测量方式为:

private static int getRootMeasureSpec(int windowSize, int rootDimension) {
 int measureSpec;
 switch (rootDimension) {

 case ViewGroup.LayoutParams.MATCH_PARENT:
  measureSpec = MeasureSpec.makeMeasureSpec(windowSize, MeasureSpec.EXACTLY);
  break;
 case ViewGroup.LayoutParams.WRAP_CONTENT:
  measureSpec = MeasureSpec.makeMeasureSpec(windowSize, MeasureSpec.AT_MOST);
  break;
 default:
  measureSpec = MeasureSpec.makeMeasureSpec(rootDimension, MeasureSpec.EXACTLY);
  break;
 }
 return measureSpec;
}

match_parent和具体数值大小为EXACTLY模式,wrap_content则为AT_MOST模式。

往下走,performMeasure方法中调用了DecorView的onMeasure方法,而DecorView继承自FrameLayout,可以看到FL的onMeasure方法中调用了measureChildWithMargins方法,并传入自身的测量规格:

protected void measureChildWithMargins(View child,
  int parentWidthMeasureSpec, int widthUsed,
  int parentHeightMeasureSpec, int heightUsed) {
 final MarginLayoutParams lp = (MarginLayoutParams) child.getLayoutParams();

 final int childWidthMeasureSpec = getChildMeasureSpec(parentWidthMeasureSpec,
   mPaddingLeft + mPaddingRight + lp.leftMargin + lp.rightMargin
     + widthUsed, lp.width);
 final int childHeightMeasureSpec = getChildMeasureSpec(parentHeightMeasureSpec,
   mPaddingTop + mPaddingBottom + lp.topMargin + lp.bottomMargin
     + heightUsed, lp.height);

 child.measure(childWidthMeasureSpec, childHeightMeasureSpec);
}

即测量子控件的大小,测量规则详情可看getChildMeasureSpec方法,总结如下:

childLayoutParams\parentSpecMode EXACTLY AT_MOST UNSPECIFIED
dp EXACTLY/childSize EXACTLY/childSize EXCATLY/childSize
match_parent EXACTLY/parentSize AT_MOST/parentSize UNSPECIFIED/0
wrap_content AT_MOST/parentSize AT_MOST/parentSize UNSPECIFIED/0

回到onMeasure方法,测完子控件之后,ViewGroup会经过一些计算,得出自身大小:

// 加上padding
maxWidth += getPaddingLeftWithForeground() + getPaddingRightWithForeground();
maxHeight += getPaddingTopWithForeground() + getPaddingBottomWithForeground();

// 检查是否小于最小宽度、最小高度
maxHeight = Math.max(maxHeight, getSuggestedMinimumHeight());
maxWidth = Math.max(maxWidth, getSuggestedMinimumWidth());

// 检查Drawable的最小高度和宽度
final Drawable drawable = getForeground();
if (drawable != null) {
 maxHeight = Math.max(maxHeight, drawable.getMinimumHeight());
 maxWidth = Math.max(maxWidth, drawable.getMinimumWidth());
}

setMeasuredDimension(resolveSizeAndState(maxWidth, widthMeasureSpec, childState),
  resolveSizeAndState(maxHeight, heightMeasureSpec,
    childState << MEASURED_HEIGHT_STATE_SHIFT));

综上,ViewGroup的测量需要先测量子View的大小,而后结合padding等属性计算得出自身大小。

(3)View的测量流程

View.performMeasure()
-->onMeasure(int widthMeasureSpec, int heightMeasureSpec)
-->setMeasuredDimension(int measuredWidth, int measuredHeight)
-->setMeasuredDimensionRaw(int measuredWidth, int measuredHeight)

可以看到setMeasuredDimensionRaw()方法:

private void setMeasuredDimensionRaw(int measuredWidth, int measuredHeight) {
 // 存储测量结果
 mMeasuredWidth = measuredWidth;
 mMeasuredHeight = measuredHeight;

 // 设置测量完成的标志位
 mPrivateFlags |= PFLAG_MEASURED_DIMENSION_SET;
}

View不需要考虑子View的大小,根据内容测量得出自身大小即可。

另外,View中的onMeasure方法中调用到getDefaultSize方法:

protected void onMeasure(int widthMeasureSpec, int heightMeasureSpec) {
 setMeasuredDimension(getDefaultSize(getSuggestedMinimumWidth(), widthMeasureSpec),
   getDefaultSize(getSuggestedMinimumHeight(), heightMeasureSpec));
}

public static int getDefaultSize(int size, int measureSpec) {
 int result = size;
 int specMode = MeasureSpec.getMode(measureSpec);
 int specSize = MeasureSpec.getSize(measureSpec);

 switch (specMode) {
 case MeasureSpec.UNSPECIFIED:
  result = size;
  break;
 case MeasureSpec.AT_MOST:
 case MeasureSpec.EXACTLY:
  // 最终测量的结果都是父容器的大小
  result = specSize;
  break;
 }
 return result;
}

这里看到精确模式和最大模式,最终测量的结果都是父容器的大小,即布局中的wrap_content、match_parent以及数值大小效果都一样,这也就是自定义View一定要重写onMeasure方法的原因。

2、layout

布局相对测量而言要简单许多,从ViewRootImpl的performLayout方法出发,可以看到其中调用了DecorView的layout方法:

// 实则为DecorView的left, top, right, bottom四个信息
host.layout(0, 0, host.getMeasuredWidth(), host.getMeasuredHeight());

进入layout方法,发现l、t、r、b被传递到了setFrame方法中,并设置给了成员变量:

mLeft = left;
mTop = top;
mRight = right;
mBottom = bottom;

所以,布局实际为调用View的layout方法,设置自身的l、t、r、b值。另外,layout方法中往下走,可以看到调用了onLayout方法,进入后发现为空方法。因而查看FrameLayout的onLayout方法:

@Override
protected void onLayout(boolean changed, int left, int top, int right, int bottom) {
 layoutChildren(left, top, right, bottom, false /* no force left gravity */);
}

void layoutChildren(int left, int top, int right, int bottom, boolean forceLeftGravity) {
 final int count = getChildCount();

 // 省略

 for (int i = 0; i < count; i++) {
  final View child = getChildAt(i);
  if (child.getVisibility() != GONE) {
   final LayoutParams lp = (LayoutParams) child.getLayoutParams();

   // 省略

   child.layout(childLeft, childTop, childLeft + width, childTop + height);
  }
 }
}

可以看到,进行一系列计算后,调用了child的layout方法,对子控件进行布局,同时子控件又会继续往下对自己的子控件布局,从而实现遍历。

综上,布局实际为调用layout方法设置View位置,ViewGroup则需要另外实现onLayout方法摆放子控件。

3、draw

(1)绘制过程入口

ViewRootImpl.performDraw()
-->ViewRootImpl.draw()
-->ViewRootImpl.drawSoftware()
-->View.draw()

(2)绘制步骤

进入到View的draw方法中,可以看到以下一段注释:

/*
 * Draw traversal performs several drawing steps which must be executed
 * in the appropriate order:
 *
 *  1. Draw the background
 *  2. If necessary, save the canvas' layers to prepare for fading
 *  3. Draw view's content
 *  4. Draw children
 *  5. If necessary, draw the fading edges and restore layers
 *  6. Draw decorations (scrollbars for instance)
 */

结合draw方法的源码,绘制过程的关键步骤如下:

  1. ==> 绘制背景:drawBackground(canvas)
  2. ==> 绘制自己:onDraw(canvas)
  3. ==> 绘制子view:dispatchDraw(canvas)
  4. ==> 绘制滚动条、前景等装饰:onDrawForeground(canvas)

感谢大家的阅读和对我们的支持。

(0)

相关推荐

  • Android UI控件之Gallery实现拖动式图片浏览效果

    我们知道现在智能手机上都有这样一种功能,就是你在浏览图片的时候.不是硬性的点击按钮而是可以实现手指的拖动,划开效果.使用户具有更好的交互体验,不过这种效果是如何实现的呢? 在Android中是通过Gallery来实现拖动效果的. 通过Gallery可以实现各种各样的效果,此篇文章只是简要谈谈他的用法,至于后续的一些效果 有机会的时候做一个整理. 首先看看其简单实现吧!本次实例是通过选取图片实现类似设置背景的功能! 不过需要说明的是:图片不宜过大,否则容易内存溢出,android对大图片的支持不好

  • Android UI 中的 ListView列表控件的示例

    当程序中有大量的数据需要展示时,就需要用到 ListView 啦.ListView 允许用户通过手指上下滑动的方式将屏幕外的数据滚动到屏幕内,同时屏幕上原有的数据则会滚动出屏幕. 1 基本用法 布局文件中加入 ListView: <?xml version="1.0" encoding="utf-8"?> <LinearLayout xmlns:android="http://schemas.android.com/apk/res/and

  • Android UI使用HorizontalListView实现水平滑动

    今天就介绍一个大神级人物自定义的ListView实现水平滑动,我知道要实现一个可以水平滑动的方法有很多,但是这个HorizontalListView用起来是真的很不错!!! 先看一下效果图: 界面做的不怎么看得上眼,但是基本的动能还是在的,下面给出HorizontalListView的代码: /* * HorizontalListView.java v1.5 * * * The MIT License * Copyright (c) 2011 Paul Soucy (paul@dev-smart

  • Android UI新组件学习和使用

    今天来学习总结一下,Android 后添加的一些新的组件和UI效果,Material Dialog,SwipeRefreshLayout,ListPopupWindow,PopupMenu等. Material Dialog 你还在为使用 Material Dialog 去引用第三方的library包么?现在告诉你一个好消息,其实Android 在V7包里面已经实现了 Material 风格的对话框,并且兼容到底版本了.你只需要在你的代码中使用V7中的Dialog即可实现以上图片效果了.代码如下

  • Android UI控件之ImageSwitcher实现图片切换效果

    本文实例为大家分享了geSwitcher实现图片切换效果的具体代码,供大家参考,具体内容如下 从该名字就可以看出来,ImageSwitcher是一个图片切换控件,可以在一系列的图片中,逐张的显示特定的图片,利用该控件可以实现图片浏览器中的上一张,下一张的功能.其使用方法也较 为简单,不过需要注意的是ImageSwitcher在使用的时候需要一个ViewFactory,用来区分显示图片的容器和他的父窗口. 具体的用法直接看实例,照例,先上效果图 看看下一张的效果: 布局文件就不多谈了直接看Main

  • Android UI绘制流程及原理详解

    一.绘制流程源码路径 1.Activity加载ViewRootImpl ActivityThread.handleResumeActivity() --> WindowManagerImpl.addView(decorView, layoutParams) --> WindowManagerGlobal.addView() 2.ViewRootImpl启动View树的遍历 ViewRootImpl.setView(decorView, layoutParams, parentView) --&

  • Android 开发订单流程view实例详解

     Android 开发订单流程view实例详解 先看看最终效果图: 怎么样,效果还是很不错的吧?群里有人说切四张图的.recycleview的.各种的都有啊,但是最简单的就是通过自定义view来实现了-接下来让我们来实现下这个(订单流程view). 首先我们定义好我们的自定义属性: attrs.xml <?xml version="1.0" encoding="utf-8"?> <resources> <declare-styleabl

  • Android中的LeakCanary的原理详解

    场景:最新的leakCanary2.8.1: debugImplementation 'com.squareup.leakcanary:leakcanary-android:2.8.1' 原理:首先就是我们在引入最新的依赖包,什么都不用干了,因为他的初始化在清单文件中注册了contentProvider(),把初始化放到了这里面的onCreate()去初始化了,在初始化的过程中,他会用application监听观察对象activity.fragment等对象的生命周期的变化,当执行销毁的生命周期

  • Android shape 绘制图形的实例详解

    Android shape 绘制图形 Android 绘制图形可以使用shape也可以使用自定义控件的方式,这里我们说下shape的方式去实现. 在绘制图形之前,我们先来了解下shape的几个属性. shape /* * 线行 圆形 矩形 / android:shape="line" android:shape="oval" android:shape="rectangle" size 图形的大小 <size android:height=

  • Android动态加载Activity原理详解

    activity的启动流程 加载一个Activity肯定不会像加载一般的类那样,因为activity作为系统的组件有自己的生命周期,有系统的很多回调控制,所以自定义一个DexClassLoader类加载器来加载插件中的Activity肯定是不可以的. 首先不得不了解一下activity的启动流程,当然只是简单的看一下,太详细的话很难研究清楚. 通过startActivity启动后,最终通过AMS进行跨进程回调到ApplicationThread的scheduleLaunchActivity,这时

  • Android HandlerThread的使用及原理详解

    一.HandlerThread的含义 HandlerThread能够新建拥有Looper的线程.这个Looper能够用来新建其他的Handler.(线程中的Looper)需要注意的是,新建的时候需要被回调. 二.HandlerThread的用法 一般情况下,我们会经常用Handler在子线程中更新UI线程,那是因为在主线程中有Looper循环,而HandlerThread新建拥有Looper的子线程又有什么用呢? 必然是执行耗时操作.举个例子,数据实时更新,我们每10秒需要切换一下显示的数据,如

  • Android UI组件LinearLayout线性布局详解

    LinearLayout 线性布局,该布局的继承关系: 1. 什么是线性布局 通俗的说感觉起来和线有关,参照线的特点,有么是横向的,要么是竖向的. LinearLayout是线性布局控件,它包含的子控件将以横向或竖向的方式排列(通过android:orientation属性来控制),按照相对位置来排列所有的widgets或者其他的containers,超过边界时,某些控件将缺失或消失 2. 线性布局常用基本属性 - android:id - android:orientation - andro

  • Spring事务处理流程和原理详解

    一.事务理论学习 利用数据库事务实现应用事务控制 1.要求:同一个事务需要同一个库的同一个连接. 2. 3.分布式事务 JTA 二.spring事务处理建模 1. 2. 三.spring事务处理流程 1. 2. 以上就是本文的全部内容,希望对大家的学习有所帮助,也希望大家多多支持我们.

  • Django DRF认证组件流程实现原理详解

    视图函数中加上认证功能,流程见下图 import hashlib import time def get_random(name): md = hashlib.md5() md.update(bytes(str(time.time()),encoding='utf-8')) md.update(bytes(name,encoding='utf-8')) return md.hexdigest() from rest_framework.views import APIView class Log

  • Android异步消息处理机制实现原理详解

    消息处理机制主要对象:Looper,Handler,Message(还有MessageQueue和Runnable) Looper不断从MessageQueue消息队列中取出一个Message,然后传给Handle,如此循环往复,如果队列为空,那么它会进入休眠. 这些类的主要变量 Looper.java static final ThreadLocal<Looper> sThreadLocal = new ThreadLocal<Looper>(); private static

随机推荐