วิธีที่ Android ดึงการแสดงผล

เฟรมเวิร์กของ Android ถามว่า Activity เพื่อวาดเลย์เอาต์เมื่อ Activity รับโฟกัส เฟรมเวิร์กของ Android จะจัดการขั้นตอนสำหรับการวาดภาพ แต่ Activity ต้องระบุโหนดรากของลำดับชั้นเลย์เอาต์

เฟรมเวิร์ก Android จะวาดโหนดรากของเลย์เอาต์และวัดผล รวมถึงวาดแผนผังเลย์เอาต์ ทั้งนี้ โดยใช้การเดินบนต้นไม้ แล้วแสดงภาพ View ที่ตัดกับพื้นที่ที่ไม่ถูกต้อง ViewGroup แต่ละรายการมีหน้าที่ ขอให้เด็กๆ แต่ละคนวาดโดยใช้ วันที่ draw() และ View จะมีหน้าที่วาดด้วยตนเอง เนื่องจากมีการข้ามผ่านต้นไม้ การสั่งจองล่วงหน้า เฟรมเวิร์กนี้จะดึงดูดผู้ปกครองมาก่อน กล่าวคือ เบื้องหลัง และดึงดูดพี่น้องตามลำดับที่ปรากฏในต้นไม้

เฟรมเวิร์ก Android วาดเลย์เอาต์ในกระบวนการผ่าน 2 เกณฑ์ ได้แก่ การวัดผลและบัตรผ่านเลย์เอาต์ ดำเนินขั้นตอนการวัดผลใน measure(int, int) และ ทำการข้ามผ่านจากบนลงล่างของต้นไม้ View View แต่ละรายการพุชมิติข้อมูล ลงในโครงสร้างระหว่างการเกิดซ้ำ เมื่อสิ้นสุดการวัดแล้ว ทุกๆ View จัดเก็บผลการวัดของตัวเอง เฟรมเวิร์กจะดำเนินการส่งผ่านขั้นตอนที่ 2 ใน layout(int, int, int, int) และแบบมองจากด้านบน ในช่วงให้สิทธิ์ดังกล่าว ผู้ปกครองแต่ละคนมีหน้าที่ระบุตำแหน่งของบุตรหลานทุกคน โดยใช้ขนาดที่คำนวณใน Measure Pass

เราจะอธิบายรายละเอียดเพิ่มเติมของกระบวนการออกแบบผ่านทั้ง 2 ส่วนในหัวข้อถัดไป

เริ่มใช้ Measure Pass

เมื่อออบเจ็กต์ View measure() วิธี ส่งคืน ตั้งค่า getMeasuredWidth() และ getMeasuredHeight() รวมถึงค่าของรายการสืบทอดของออบเจ็กต์ View ทั้งหมด View ค่าความกว้างที่วัดและความสูงที่วัดได้ของออบเจ็กต์ต้องเป็นไปตามข้อจำกัดที่กำหนดโดยพารามิเตอร์ ระดับบนสุดของออบเจ็กต์ View รายการ ซึ่งช่วยให้มั่นใจได้ว่าผู้ปกครองทุกคนผ่านมาตรการ ยอมรับการวัดผลทั้งหมดของบุตรหลาน

เจ้าของ View อาจโทรหา measure() มากกว่า 1 ครั้งในประเภทย่อย สำหรับ ตัวอย่างเช่น ผู้ปกครองอาจวัดเด็กๆ ครั้งเดียวด้วยมิติข้อมูลที่ไม่ได้ระบุเพื่อกำหนด ขนาดที่ต้องการ หากผลรวมของขนาดแบบไม่จำกัดของบุตรหลานมีขนาดใหญ่หรือเล็กเกินไป หน่วยโฆษณาหลัก อาจเรียก measure() อีกครั้งด้วยค่าที่จำกัดขนาดของเด็ก

การวัดผลผ่านใช้ 2 คลาสในการสื่อสารมิติข้อมูล ViewGroup.LayoutParams คือวิธีที่ออบเจ็กต์ View สื่อสารขนาดและตำแหน่งที่ต้องการ ฐาน คลาส ViewGroup.LayoutParams อธิบายความกว้างและความสูงที่ต้องการของ View สำหรับแต่ละมิติข้อมูล สามารถระบุค่าใดสิ่งหนึ่งต่อไปนี้

  • ขนาดที่แน่นอน
  • MATCH_PARENT หมายความว่าขนาดที่ต้องการสำหรับ View คือขนาดของหน่วยโฆษณาระดับบน ลบ ระยะห่างจากขอบ
  • WRAP_CONTENT ซึ่งหมายความว่าขนาดที่ต้องการสำหรับ View นั้นใหญ่พอที่จะใส่เนื้อหาไว้ในกรอบ รวมถึงระยะห่างจากขอบ

มีคลาสย่อยของ ViewGroup.LayoutParams สำหรับคลาสย่อยต่างๆ ของ ViewGroup ตัวอย่างเช่น RelativeLayout มีของตัวเอง คลาสย่อยของ ViewGroup.LayoutParams ที่มีความสามารถในการจัดกึ่งกลางเด็ก View วัตถุในแนวนอนและแนวตั้ง

ออบเจ็กต์ MeasureSpec รายการ ใช้ในการพุชข้อกำหนดต่างๆ จากหลักสู่ย่อย MeasureSpec สามารถอยู่ใน 1 ใน 3 โหมด

  • UNSPECIFIED: บัญชีหลักใช้ข้อมูลนี้เพื่อกำหนดมิติข้อมูลเป้าหมายของ View ย่อย ตัวอย่างเช่น LinearLayout อาจโทรหา measure() บนรายการย่อยโดยตั้งค่าความสูงเป็น UNSPECIFIED และความกว้าง จาก EXACTLY, 240 เพื่อหาว่าเด็ก View ต้องการสูงเท่าไหร่ โดยมีความกว้าง 240 พิกเซล
  • EXACTLY: ผู้ปกครองใช้ตัวเลือกนี้เพื่อกำหนดขนาดที่แน่นอนสำหรับบุตรหลาน เด็กต้องใช้ขนาดนี้และ รับประกันว่าองค์ประกอบสืบทอดทั้งหมดจะมีขนาดพอดี
  • AT MOST: ผู้ปกครองใช้ตัวเลือกนี้เพื่อกำหนดขนาดสูงสุดของบุตรหลาน เด็กต้องรับประกันว่า องค์ประกอบสืบทอดทั้งหมดจะมีขนาดเท่านี้

เริ่มใช้ Layout Pass

หากต้องการเริ่มรูปแบบ ให้เรียก requestLayout() ช่วงเวลานี้ โดยปกติจะเรียกเมธอด View ในตัวมันเองเมื่อเห็นว่าไม่สามารถใส่ได้ ภายในขอบเขต

ใช้การวัดผลที่กำหนดเองและตรรกะเลย์เอาต์

หากต้องการใช้การวัดที่กําหนดเองหรือตรรกะเลย์เอาต์ ให้ลบล้างเมธอดที่มีตรรกะ มีการใช้งาน: onMeasure(int, int) และ onLayout(boolean, int, int, int, int) วิธีการเหล่านี้เรียกใช้โดย measure(int, int) และ layout(int, int, int, int) ตามลำดับ โปรดอย่าลบล้าง measure(int, int) หรือ layout(int, int) เมธอด ทั้ง 2 วิธีนี้ เป็น final จึงไม่สามารถลบล้างได้

ตัวอย่างต่อไปนี้แสดงวิธีดำเนินการใน "SplitLayout" จาก ผู้จัดการหน้าต่าง แอปตัวอย่าง หากSplitLayout มียอดดูย่อย 2 ครั้งขึ้นไป และจอแสดงผลมีเส้นแบ่ง ก็จะวางตำแหน่งมุมมองเด็ก 2 ข้างของแนวเส้นแบ่งหน้า ตัวอย่างต่อไปนี้แสดงการใช้งาน สำหรับการลบล้างการวัดและการจัดวาง แต่สำหรับเวอร์ชันที่ใช้งานจริง ให้ใช้ SlidingPaneLayout ถ้าอยากทำงานแบบนี้

Kotlin

/**
 * An example of split-layout for two views, separated by a display
 * feature that goes across the window. When both start and end views are
 * added, it checks whether there are display features that separate the area
 * in two—such as a fold or hinge—and places them side-by-side or
 * top-bottom.
 */
class SplitLayout : FrameLayout {
   private var windowLayoutInfo: WindowLayoutInfo? = null
   private var startViewId = 0
   private var endViewId = 0

   private var lastWidthMeasureSpec: Int = 0
   private var lastHeightMeasureSpec: Int = 0

   ...

   fun updateWindowLayout(windowLayoutInfo: WindowLayoutInfo) {
      this.windowLayoutInfo = windowLayoutInfo
      requestLayout()
   }

   override fun onLayout(changed: Boolean, left: Int, top: Int, right: Int, bottom: Int) {
      val startView = findStartView()
      val endView = findEndView()
      val splitPositions = splitViewPositions(startView, endView)

      if (startView != null && endView != null && splitPositions != null) {
            val startPosition = splitPositions[0]
            val startWidthSpec = MeasureSpec.makeMeasureSpec(startPosition.width(), EXACTLY)
            val startHeightSpec = MeasureSpec.makeMeasureSpec(startPosition.height(), EXACTLY)
            startView.measure(startWidthSpec, startHeightSpec)
            startView.layout(
               startPosition.left, startPosition.top, startPosition.right,
               startPosition.bottom
            )

            val endPosition = splitPositions[1]
            val endWidthSpec = MeasureSpec.makeMeasureSpec(endPosition.width(), EXACTLY)
            val endHeightSpec = MeasureSpec.makeMeasureSpec(endPosition.height(), EXACTLY)
            endView.measure(endWidthSpec, endHeightSpec)
            endView.layout(
               endPosition.left, endPosition.top, endPosition.right,
               endPosition.bottom
            )
      } else {
            super.onLayout(changed, left, top, right, bottom)
      }
   }

   /**
   * Gets the position of the split for this view.
   * @return A rect that defines of split, or {@code null} if there is no split.
   */
   private fun splitViewPositions(startView: View?, endView: View?): Array? {
      if (windowLayoutInfo == null || startView == null || endView == null) {
            return null
      }

      // Calculate the area for view's content with padding.
      val paddedWidth = width - paddingLeft - paddingRight
      val paddedHeight = height - paddingTop - paddingBottom

      windowLayoutInfo?.displayFeatures
            ?.firstOrNull { feature -> isValidFoldFeature(feature) }
            ?.let { feature ->
               getFeaturePositionInViewRect(feature, this)?.let {
                  if (feature.bounds.left == 0) { // Horizontal layout.
                        val topRect = Rect(
                           paddingLeft, paddingTop,
                           paddingLeft + paddedWidth, it.top
                        )
                        val bottomRect = Rect(
                           paddingLeft, it.bottom,
                           paddingLeft + paddedWidth, paddingTop + paddedHeight
                        )

                        if (measureAndCheckMinSize(topRect, startView) &&
                           measureAndCheckMinSize(bottomRect, endView)
                        ) {
                           return arrayOf(topRect, bottomRect)
                        }
                  } else if (feature.bounds.top == 0) { // Vertical layout.
                        val leftRect = Rect(
                           paddingLeft, paddingTop,
                           it.left, paddingTop + paddedHeight
                        )
                        val rightRect = Rect(
                           it.right, paddingTop,
                           paddingLeft + paddedWidth, paddingTop + paddedHeight
                        )

                        if (measureAndCheckMinSize(leftRect, startView) &&
                           measureAndCheckMinSize(rightRect, endView)
                        ) {
                           return arrayOf(leftRect, rightRect)
                        }
                  }
               }
            }

      // You previously tried to fit the children and measure them. Since they
      // don't fit, measure again to update the stored values.
      measure(lastWidthMeasureSpec, lastHeightMeasureSpec)
      return null
   }

   override fun onMeasure(widthMeasureSpec: Int, heightMeasureSpec: Int) {
      super.onMeasure(widthMeasureSpec, heightMeasureSpec)
      lastWidthMeasureSpec = widthMeasureSpec
      lastHeightMeasureSpec = heightMeasureSpec
   }

   /**
   * Measures a child view and sees if it fits in the provided rect.
   * This method calls [View.measure] on the child view, which updates its
   * stored values for measured width and height. If the view ends up with
   * different values, measure again.
   */
   private fun measureAndCheckMinSize(rect: Rect, childView: View): Boolean {
      val widthSpec = MeasureSpec.makeMeasureSpec(rect.width(), AT_MOST)
      val heightSpec = MeasureSpec.makeMeasureSpec(rect.height(), AT_MOST)
      childView.measure(widthSpec, heightSpec)
      return childView.measuredWidthAndState and MEASURED_STATE_TOO_SMALL == 0 &&
               childView.measuredHeightAndState and MEASURED_STATE_TOO_SMALL == 0
   }

   private fun isValidFoldFeature(displayFeature: DisplayFeature) =
      (displayFeature as? FoldingFeature)?.let { feature ->
            getFeaturePositionInViewRect(feature, this) != null
      } ?: false
}

Java

/**
* An example of split-layout for two views, separated by a display feature
* that goes across the window. When both start and end views are added, it checks
* whether there are display features that separate the area in two—such as
* fold or hinge—and places them side-by-side or top-bottom.
*/
public class SplitLayout extends FrameLayout {
   @Nullable
   private WindowLayoutInfo windowLayoutInfo = null;
   private int startViewId = 0;
   private int endViewId = 0;

   private int lastWidthMeasureSpec = 0;
   private int lastHeightMeasureSpec = 0;

   ...

   void updateWindowLayout(WindowLayoutInfo windowLayoutInfo) {
      this.windowLayoutInfo = windowLayoutInfo;
      requestLayout();
   }

   @Override
   protected void onLayout(boolean changed, int left, int top, int right, int bottom) {
      @Nullable
      View startView = findStartView();
      @Nullable
      View endView = findEndView();
      @Nullable
      List splitPositions = splitViewPositions(startView, endView);

      if (startView != null && endView != null && splitPositions != null) {
            Rect startPosition = splitPositions.get(0);
            int startWidthSpec = MeasureSpec.makeMeasureSpec(startPosition.width(), EXACTLY);
            int startHeightSpec = MeasureSpec.makeMeasureSpec(startPosition.height(), EXACTLY);
            startView.measure(startWidthSpec, startHeightSpec);
            startView.layout(
                  startPosition.left,
                  startPosition.top,
                  startPosition.right,
                  startPosition.bottom
            );

            Rect endPosition = splitPositions.get(1);
            int endWidthSpec = MeasureSpec.makeMeasureSpec(endPosition.width(), EXACTLY);
            int endHeightSpec = MeasureSpec.makeMeasureSpec(endPosition.height(), EXACTLY);
            startView.measure(endWidthSpec, endHeightSpec);
            startView.layout(
                  endPosition.left,
                  endPosition.top,
                  endPosition.right,
                  endPosition.bottom
            );
      } else {
            super.onLayout(changed, left, top, right, bottom);
      }
   }

   /**
   * Gets the position of the split for this view.
   * @return A rect that defines of split, or {@code null} if there is no split.
   */
   @Nullable
   private List splitViewPositions(@Nullable View startView, @Nullable View endView) {
      if (windowLayoutInfo == null || startView == null || endView == null) {
            return null;
      }

      int paddedWidth = getWidth() - getPaddingLeft() - getPaddingRight();
      int paddedHeight = getHeight() - getPaddingTop() - getPaddingBottom();

      List displayFeatures = windowLayoutInfo.getDisplayFeatures();

      @Nullable
      DisplayFeature feature = displayFeatures
               .stream()
               .filter(item ->
                  isValidFoldFeature(item)
               )
               .findFirst()
               .orElse(null);

      if (feature != null) {
            Rect position = SampleToolsKt.getFeaturePositionInViewRect(feature, this, true);
            Rect featureBounds = feature.getBounds();
            if (featureBounds.left == 0) { // Horizontal layout.
               Rect topRect = new Rect(
                        getPaddingLeft(),
                        getPaddingTop(),
                        getPaddingLeft() + paddedWidth,
                        position.top
               );
               Rect bottomRect = new Rect(
                        getPaddingLeft(),
                        position.bottom,
                        getPaddingLeft() + paddedWidth,
                        getPaddingTop() + paddedHeight
               );
               if (measureAndCheckMinSize(topRect, startView) &&
                        measureAndCheckMinSize(bottomRect, endView)) {
                  ArrayList rects = new ArrayList();
                  rects.add(topRect);
                  rects.add(bottomRect);
                  return rects;
               }
            } else if (featureBounds.top == 0) { // Vertical layout.
               Rect leftRect = new Rect(
                        getPaddingLeft(),
                        getPaddingTop(),
                        position.left,
                        getPaddingTop() + paddedHeight
               );
               Rect rightRect = new Rect(
                        position.right,
                        getPaddingTop(),
                        getPaddingLeft() + paddedWidth,
                        getPaddingTop() + paddedHeight
               );
               if (measureAndCheckMinSize(leftRect, startView) &&
                        measureAndCheckMinSize(rightRect, endView)) {
                  ArrayList rects = new ArrayList();
                  rects.add(leftRect);
                  rects.add(rightRect);
                  return rects;
               }
            }
      }

      // You previously tried to fit the children and measure them. Since
      // they don't fit, measure again to update the stored values.
      measure(lastWidthMeasureSpec, lastHeightMeasureSpec);
      return null;
   }

   @Override
   protected void onMeasure(int widthMeasureSpec, int heightMeasureSpec) {
      super.onMeasure(widthMeasureSpec, heightMeasureSpec);
      lastWidthMeasureSpec = widthMeasureSpec;
      lastHeightMeasureSpec = heightMeasureSpec;
   }

   /**
   * Measures a child view and sees if it fits in the provided rect.
   * This method calls [View.measure] on the child view, which updates
   * its stored values for measured width and height. If the view ends up with
   * different values, measure again.
   */
   private boolean measureAndCheckMinSize(Rect rect, View childView) {
      int widthSpec = MeasureSpec.makeMeasureSpec(rect.width(), AT_MOST);
      int heightSpec = MeasureSpec.makeMeasureSpec(rect.height(), AT_MOST);
      childView.measure(widthSpec, heightSpec);
      return (childView.getMeasuredWidthAndState() & MEASURED_STATE_TOO_SMALL) == 0 &&
               (childView.getMeasuredHeightAndState() & MEASURED_STATE_TOO_SMALL) == 0;
   }

   private boolean isValidFoldFeature(DisplayFeature displayFeature) {
      if (displayFeature instanceof FoldingFeature) {
            return SampleToolsKt.getFeaturePositionInViewRect(displayFeature, this, true) != null;
      } else {
            return false;
      }
   }
}