android百分比布局 弃用,android – PercentRelativeLayout在v26中已弃用

使用ConstraintLayout实现布局有两种方法.

#1指南

考虑到您需要布置六个视图,您需要添加两个垂直指南,其中百分比位置为33％,父宽度为66％.您还需要添加两个水平指南,其中百分比位置为45％和屏幕高度的90％.然后将您的六个视图限制为这些指南,如此屏幕截图所示：

以下是使用指南进行布局构建的XML源代码：

xmlns:android="http://schemas.android.com/apk/res/android"

xmlns:app="http://schemas.android.com/apk/res-auto"

android:layout_width="match_parent"

android:layout_height="match_parent">

android:id="@+id/view1"

android:layout_width="0dp"

android:layout_height="0dp"

android:background="@android:color/holo_blue_bright"

app:layout_constraintBottom_toTopOf="@+id/horizontal_guideline_1"

app:layout_constraintEnd_toStartOf="@+id/vertical_guideline_1"

app:layout_constraintStart_toStartOf="parent"

app:layout_constraintTop_toTopOf="parent" />

android:id="@+id/view2"

android:layout_width="0dp"

android:layout_height="0dp"

android:background="@android:color/holo_green_dark"

app:layout_constraintBottom_toTopOf="@+id/horizontal_guideline_1"

app:layout_constraintEnd_toStartOf="@+id/vertical_guideline_2"

app:layout_constraintStart_toStartOf="@+id/vertical_guideline_1"

app:layout_constraintTop_toTopOf="parent" />

android:id="@+id/view3"

android:layout_width="0dp"

android:layout_height="0dp"

android:background="@android:color/holo_purple"

app:layout_constraintBottom_toTopOf="@+id/horizontal_guideline_1"

app:layout_constraintEnd_toEndOf="parent"

app:layout_constraintStart_toStartOf="@+id/vertical_guideline_2"

app:layout_constraintTop_toTopOf="parent" />

android:id="@+id/view4"

android:layout_width="0dp"

android:layout_height="0dp"

android:background="@android:color/holo_orange_light"

app:layout_constraintBottom_toTopOf="@+id/horizontal_guideline_2"

app:layout_constraintEnd_toStartOf="@+id/vertical_guideline_1"

app:layout_constraintStart_toStartOf="parent"

app:layout_constraintTop_toTopOf="@+id/horizontal_guideline_1" />

android:id="@+id/view5"

android:layout_width="0dp"

android:layout_height="0dp"

android:background="@android:color/holo_red_light"

app:layout_constraintBottom_toTopOf="@+id/horizontal_guideline_2"

app:layout_constraintEnd_toStartOf="@+id/vertical_guideline_2"

app:layout_constraintStart_toStartOf="@+id/vertical_guideline_1"

app:layout_constraintTop_toTopOf="@+id/horizontal_guideline_1" />

android:id="@+id/view6"

android:layout_width="0dp"

android:layout_height="0dp"

android:background="@android:color/holo_blue_dark"

app:layout_constraintBottom_toTopOf="@+id/horizontal_guideline_2"

app:layout_constraintEnd_toEndOf="parent"

app:layout_constraintStart_toStartOf="@+id/vertical_guideline_2"

app:layout_constraintTop_toTopOf="@+id/horizontal_guideline_1" />

android:id="@+id/vertical_guideline_1"

android:layout_width="wrap_content"

android:layout_height="wrap_content"

android:orientation="vertical"

app:layout_constraintGuide_percent="0.33" />

android:id="@+id/vertical_guideline_2"

android:layout_width="wrap_content"

android:layout_height="wrap_content"

android:orientation="vertical"

app:layout_constraintGuide_percent="0.66" />

android:id="@+id/horizontal_guideline_1"

android:layout_width="wrap_content"

android:layout_height="wrap_content"

android:orientation="horizontal"

app:layout_constraintGuide_percent="0.45" />

android:id="@+id/horizontal_guideline_2"

android:layout_width="wrap_content"

android:layout_height="wrap_content"

android:orientation="horizontal"

app:layout_constraintGuide_percent="0.9" />

#2链条重量

链是另一种使用百分比值来调整视图大小的强大方法.您在ConstraintLayout链中使用权重值,就像在LinearLayout中使用权重一样.

这是显示如何使用带权重的链的XML示例：

xmlns:android="http://schemas.android.com/apk/res/android"

xmlns:app="http://schemas.android.com/apk/res-auto"

android:layout_width="match_parent"

android:layout_height="match_parent">

android:id="@+id/view1"

android:layout_width="0dp"

android:layout_height="0dp"

android:background="@android:color/holo_blue_bright"

app:layout_constraintHorizontal_chainStyle="spread"

app:layout_constraintHorizontal_weight="33.3"

app:layout_constraintVertical_chainStyle="spread"

app:layout_constraintVertical_weight="45"

app:layout_constraintTop_toTopOf="parent"

app:layout_constraintStart_toStartOf="parent"

app:layout_constraintEnd_toStartOf="@+id/view2"

app:layout_constraintBottom_toTopOf="@+id/view4" />

android:id="@+id/view2"

android:layout_width="0dp"

android:layout_height="0dp"

android:background="@android:color/holo_green_dark"

app:layout_constraintHorizontal_weight="33.3"

app:layout_constraintTop_toTopOf="@+id/view1"

app:layout_constraintStart_toEndOf="@+id/view1"

app:layout_constraintEnd_toStartOf="@+id/view3"

app:layout_constraintBottom_toBottomOf="@+id/view1" />

android:id="@+id/view3"

android:layout_width="0dp"

android:layout_height="0dp"

android:background="@android:color/holo_purple"

app:layout_constraintHorizontal_weight="33.3"

app:layout_constraintTop_toTopOf="@+id/view2"

app:layout_constraintStart_toEndOf="@+id/view2"

app:layout_constraintBottom_toBottomOf="@+id/view2"

app:layout_constraintEnd_toEndOf="parent" />

android:id="@+id/view4"

android:layout_width="0dp"

android:layout_height="0dp"

android:background="@android:color/holo_orange_light"

app:layout_constraintHorizontal_chainStyle="spread"

app:layout_constraintHorizontal_weight="33.3"

app:layout_constraintVertical_weight="45"

app:layout_constraintTop_toBottomOf="@+id/view1"

app:layout_constraintStart_toStartOf="parent"

app:layout_constraintEnd_toStartOf="@+id/view5"

app:layout_constraintBottom_toTopOf="@+id/space" />

android:id="@+id/view5"

android:layout_width="0dp"

android:layout_height="0dp"

android:background="@android:color/holo_red_light"

app:layout_constraintHorizontal_weight="33.3"

app:layout_constraintTop_toTopOf="@+id/view4"

app:layout_constraintStart_toEndOf="@+id/view4"

app:layout_constraintEnd_toStartOf="@+id/view6"

app:layout_constraintBottom_toBottomOf="@+id/view4" />

android:id="@+id/view6"

android:layout_width="0dp"

android:layout_height="0dp"

android:background="@android:color/holo_blue_dark"

app:layout_constraintHorizontal_weight="33.3"

app:layout_constraintTop_toTopOf="@+id/view5"

app:layout_constraintStart_toEndOf="@+id/view5"

app:layout_constraintEnd_toEndOf="parent"

app:layout_constraintBottom_toBottomOf="@+id/view5" />

android:id="@+id/space"

android:layout_width="0dp"

android:layout_height="0dp"

app:layout_constraintVertical_weight="10"

app:layout_constraintTop_toBottomOf="@+id/view4"

app:layout_constraintStart_toStartOf="parent"

app:layout_constraintBottom_toBottomOf="parent" />

上面显示的两个示例都会导致以下结果：

了解更多：