Android View 布局流程(Layout)全面解析

 更新时间:2017年02月16日 15:18:18   作者:程序员的自我反思  
这篇文章主要为大家全面解析了Android View 布局流程Layout,具有一定的参考价值,感兴趣的小伙伴们可以参考一下

前言

上一篇文章,笔者详细讲述了View三大工作流程的第一个,Measure流程,如果对测量流程还不熟悉的读者可以参考一下上一篇文章。测量流程主要是对View树进行测量,获取每一个View的测量宽高,那么有了测量宽高,就是要进行布局流程了,布局流程相对测量流程来说简单许多。那么我们开始对layout流程进行详细的解析。

ViewGroup的布局流程

上一篇文章提到,三大流程始于ViewRootImpl#performTraversals方法,在该方法内通过调用performMeasure、performLayout、performDraw这三个方法来进行measure、layout、draw流程,那么我们就从performLayout方法开始说,我们先看它的源码:

private void performLayout(WindowManager.LayoutParams lp, int desiredWindowWidth,
 int desiredWindowHeight) {
 mLayoutRequested = false;
 mScrollMayChange = true;
 mInLayout = true;

 final View host = mView;
 if (DEBUG_ORIENTATION || DEBUG_LAYOUT) {
 Log.v(TAG, "Laying out " + host + " to (" +
  host.getMeasuredWidth() + ", " + host.getMeasuredHeight() + ")");
 }

 Trace.traceBegin(Trace.TRACE_TAG_VIEW, "layout");
 try {
 host.layout(0, 0, host.getMeasuredWidth(), host.getMeasuredHeight()); // 1

 //省略...
 } finally {
 Trace.traceEnd(Trace.TRACE_TAG_VIEW);
 }
 mInLayout = false;
}

由上面的代码可以看出,直接调用了①号的host.layout方法,host也就是DecorView,那么对于DecorView来说,调用layout方法,就是对它自身进行布局,注意到传递的参数分别是0,0,host.getMeasuredWidth,host.getMeasuredHeight,它们分别代表了一个View的上下左右四个位置,显然,DecorView的左上位置为0,然后宽高为它的测量宽高。由于View的layout方法是final类型,子类不能重写,因此我们直接看View#layout方法即可:

public void layout(int l, int t, int r, int b) {
 if ((mPrivateFlags3 & PFLAG3_MEASURE_NEEDED_BEFORE_LAYOUT) != 0) {
 onMeasure(mOldWidthMeasureSpec, mOldHeightMeasureSpec);
 mPrivateFlags3 &= ~PFLAG3_MEASURE_NEEDED_BEFORE_LAYOUT;
 }

 int oldL = mLeft;
 int oldT = mTop;
 int oldB = mBottom;
 int oldR = mRight;

 boolean changed = isLayoutModeOptical(mParent) ?
  setOpticalFrame(l, t, r, b) : setFrame(l, t, r, b); // 1

 if (changed || (mPrivateFlags & PFLAG_LAYOUT_REQUIRED) == PFLAG_LAYOUT_REQUIRED) {
 onLayout(changed, l, t, r, b);  // 2
 mPrivateFlags &= ~PFLAG_LAYOUT_REQUIRED;

 ListenerInfo li = mListenerInfo;
 if (li != null && li.mOnLayoutChangeListeners != null) {
  ArrayList<OnLayoutChangeListener> listenersCopy =
   (ArrayList<OnLayoutChangeListener>)li.mOnLayoutChangeListeners.clone();
  int numListeners = listenersCopy.size();
  for (int i = 0; i < numListeners; ++i) {
  listenersCopy.get(i).onLayoutChange(this, l, t, r, b, oldL, oldT, oldR, oldB);
  }
 }
 }

 mPrivateFlags &= ~PFLAG_FORCE_LAYOUT;
 mPrivateFlags3 |= PFLAG3_IS_LAID_OUT;
}

首先看①号代码,调用了setFrame方法,并把四个位置信息传递进去,这个方法用于确定View的四个顶点的位置,即初始化mLeft,mRight,mTop,mBottom这四个值,当初始化完毕后,ViewGroup的布局流程也就完成了
那么,我们先看View#setFrame方法:

protected boolean setFrame(int left, int top, int right, int bottom) {
 //省略...

 mLeft = left;
 mTop = top;
 mRight = right;
 mBottom = bottom;
 mRenderNode.setLeftTopRightBottom(mLeft, mTop, mRight, mBottom);

 //省略...
 return changed;
}

可以看出,它对mLeft、mTop、mRight、mBottom这四个值进行了初始化,对于每一个View,包括ViewGroup来说,以上四个值保存了Viwe的位置信息,所以这四个值是最终宽高,也即是说,如果要得到View的位置信息,那么就应该在layout方法完成后调用getLeft()、getTop()等方法来取得最终宽高,如果是在此之前调用相应的方法,只能得到0的结果,所以一般我们是在onLayout方法中获取View的宽高信息。

在设置ViewGroup自身的位置完成后,我们看到会接着调用②号方法,即onLayout()方法,该方法在ViewGroup中调用,用于确定子View的位置,即在该方法内部,子View会调用自身的layout方法来进一步完成自身的布局流程。由于不同的布局容器的onMeasure方法均有不同的实现,因此不可能对所有布局方式都说一次,另外上一篇文章是用FrameLayout#onMeasure进行讲解的,那么现在也对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();

 //以下四个值会影响到子View的布局参数
 //parentLeft由父容器的padding和Foreground决定
 final int parentLeft = getPaddingLeftWithForeground();
 //parentRight由父容器的width和padding和Foreground决定
 final int parentRight = right - left - getPaddingRightWithForeground();

 final int parentTop = getPaddingTopWithForeground();
 final int parentBottom = bottom - top - getPaddingBottomWithForeground();

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

  //获取子View的测量宽高
  final int width = child.getMeasuredWidth();
  final int height = child.getMeasuredHeight();

  int childLeft;
  int childTop;

  int gravity = lp.gravity;
  if (gravity == -1) {
  gravity = DEFAULT_CHILD_GRAVITY;
  }

  final int layoutDirection = getLayoutDirection();
  final int absoluteGravity = Gravity.getAbsoluteGravity(gravity, layoutDirection);
  final int verticalGravity = gravity & Gravity.VERTICAL_GRAVITY_MASK;

  //当子View设置了水平方向的layout_gravity属性时,根据不同的属性设置不同的childLeft
  //childLeft表示子View的 左上角坐标X值
  switch (absoluteGravity & Gravity.HORIZONTAL_GRAVITY_MASK) {

  /* 水平居中,由于子View要在水平中间的位置显示,因此,要先计算出以下:
   * (parentRight - parentLeft -width)/2 此时得出的是父容器减去子View宽度后的
   * 剩余空间的一半,那么再加上parentLeft后,就是子View初始左上角横坐标(此时正好位于中间位置),
   * 假如子View还受到margin约束,由于leftMargin使子View右偏而rightMargin使子View左偏,所以最后
   * 是 +leftMargin -rightMargin .
   */
  case Gravity.CENTER_HORIZONTAL:
   childLeft = parentLeft + (parentRight - parentLeft - width) / 2 +
   lp.leftMargin - lp.rightMargin;
   break;

  //水平居右,子View左上角横坐标等于 parentRight 减去子View的测量宽度 减去 margin
  case Gravity.RIGHT:
   if (!forceLeftGravity) {
   childLeft = parentRight - width - lp.rightMargin;
   break;
   }

  //如果没设置水平方向的layout_gravity,那么它默认是水平居左
  //水平居左,子View的左上角横坐标等于 parentLeft 加上子View的magin值
  case Gravity.LEFT:
  default:
   childLeft = parentLeft + lp.leftMargin;
  }

  //当子View设置了竖直方向的layout_gravity时,根据不同的属性设置同的childTop
  //childTop表示子View的 左上角坐标的Y值
  //分析方法同上
  switch (verticalGravity) {
  case Gravity.TOP:
   childTop = parentTop + lp.topMargin;
   break;
  case Gravity.CENTER_VERTICAL:
   childTop = parentTop + (parentBottom - parentTop - height) / 2 +
   lp.topMargin - lp.bottomMargin;
   break;
  case Gravity.BOTTOM:
   childTop = parentBottom - height - lp.bottomMargin;
   break;
  default:
   childTop = parentTop + lp.topMargin;
  }

  //对子元素进行布局,左上角坐标为(childLeft,childTop),右下角坐标为(childLeft+width,childTop+height)
  child.layout(childLeft, childTop, childLeft + width, childTop + height);
 }
 }
}

由源码看出,onLayout方法内部直接调用了layoutChildren方法,而layoutChildren则是具体的实现。
先梳理一下以上逻辑:首先先获取父容器的padding值,然后遍历其每一个子View,根据子View的layout_gravity属性、子View的测量宽高、父容器的padding值、来确定子View的布局参数,然后调用child.layout方法,把布局流程从父容器传递到子元素。

那么,现在就分析完了ViewGroup的布局流程,那么我们接着分析子元素的布局流程。

子View的布局流程

子View的布局流程也很简单,如果子View是一个ViewGroup,那么就会重复以上步骤,如果是一个View,那么会直接调用View#layout方法,根据以上分析,在该方法内部会设置view的四个布局参数,接着调用onLayout方法,我们看看View#onLayout方法:

protected void onLayout(boolean changed, int left, int top, int right, int bottom) {
}

这是一个空实现,主要作用是在我们的自定义View中重写该方法,实现自定义的布局逻辑。

那么到目前为止,View的布局流程就已经全部分析完了。可以看出,布局流程的逻辑相比测量流程来说,简单许多,获取一个View的测量宽高是比较复杂的,而布局流程则是根据已经获得的测量宽高进而确定一个View的四个位置参数。在下一篇文章,将会讲述最后一个流程:绘制流程。希望这篇文章给大家对View的工作流程的理解带来帮助,谢谢阅读。

更多阅读

Android View 测量流程(Measure)完全解析
Android View 绘制流程(Draw) 完全解析

以上就是本文的全部内容,希望对大家的学习有所帮助,也希望大家多多支持脚本之家。

相关文章

  • 详解Android 裸眼3D效果View控件

    详解Android 裸眼3D效果View控件

    主要的设计核心是依赖于传感器对手机晃动的监听(重力感应监听器),对每层图片进行不同的移动,实现仿3D效果。本文通过实例代码给大家介绍的非常详细,需要的朋友参考下吧
    2021-08-08
  • ANDROID中自定义对话框AlertDialog使用示例

    ANDROID中自定义对话框AlertDialog使用示例

    这篇文章主要为大家详细介绍了Android中自定义对话框AlertDialog使用示例,具有一定的参考价值,感兴趣的小伙伴们可以参考一下
    2016-12-12
  • Android自定义ViewGroup打造各种风格的SlidingMenu

    Android自定义ViewGroup打造各种风格的SlidingMenu

    这篇文章主要介绍了Android自定义ViewGroup打造各种风格的SlidingMenu的相关资料,需要的朋友可以参考下
    2016-02-02
  • Android编程中自定义dialog用法实例

    Android编程中自定义dialog用法实例

    这篇文章主要介绍了Android编程中自定义dialog用法,结合实例形式较为详细的分析了Android自定义dialog的定义.布局及调用等相关技巧,需要的朋友可以参考下
    2015-12-12
  • 安卓(Android)开发之自定义饼状图

    安卓(Android)开发之自定义饼状图

    饼状图制作起来其实很简单,但是制作东西最重要的不是制作结果,而是制作思路。 相信小编贴上代码大家一看就立刻明白了,下面咱们来了解一下制作思路。
    2016-08-08
  • Android Studio实现简易计算器设计

    Android Studio实现简易计算器设计

    这篇文章主要为大家详细介绍了Android Studio实现简易计算器设计,文中示例代码介绍的非常详细,具有一定的参考价值,感兴趣的小伙伴们可以参考一下
    2022-05-05
  • 学习使用Material Design控件(一)

    学习使用Material Design控件(一)

    这篇文章主要为大家介绍了学习使用Material Design控件的详细教程,具有一定的参考价值,感兴趣的小伙伴们可以参考一下
    2017-07-07
  • Android中ConstraintLayout约束布局的最全详细解析

    Android中ConstraintLayout约束布局的最全详细解析

    ConstraintLayout是Google在Google I/O 2016大会上发布的一种新的布局容器(ViewGroup),它支持以灵活的方式来放置子控件和调整子控件的大小,下面这篇文章主要给大家介绍了关于Android中ConstraintLayout约束布局详细解析的相关资料,需要的朋友可以参考下
    2022-08-08
  • listview 选中高亮显示实现方法

    listview 选中高亮显示实现方法

    当点击左侧ListView后,选中的一行就会一直呈高亮状态显示,图中选中行字的颜色显示为蓝色(注意:是选中行后一直高亮,而不是只是点击时高亮),如果再次点击另外的一行, 则新的那一行就高亮,下面就来实现这个高亮效果的显示
    2012-11-11
  • Android之AttributeSet案例详解

    Android之AttributeSet案例详解

    这篇文章主要介绍了Android之AttributeSet案例详解,本篇文章通过简要的案例,讲解了该项技术的了解与使用,以下就是详细内容,需要的朋友可以参考下
    2021-08-08

最新评论