1、layout_constraintHorizontal_bias
layout_constraintHorizontal_bias 是 ConstraintLayout 中的一个重要属性,用于控制一个视图在父视图或相关视图中水平位置的偏移。这种偏移通过在0到1之间的浮点值来设置,0代表完全靠近左边或起始位置,1代表完全靠近右边或结束位置,0.5则居中。
属性解释
layout_constraintHorizontal_bias=“0.0” : 视图完全靠到父布局的左边界。
layout_constraintHorizontal_bias=“0.5” : 视图在左右边界之间完全居中。
layout_constraintHorizontal_bias=“1.0” : 视图完全靠到父布局的右边界。
注意事项
- 使用 layout_constraintHorizontal_bias 时,需要同时设置视图的两侧约束(例如Start_toStartOf和End_toEndOf)。
- 属性值不必是刚好0.0、0.5或1.0,您可以使用任何0到1之间的浮点数来实现不同程度的偏移。
通过调整 layout_constraintHorizontal_bias,您可以灵活地控制视图在水平空间中的位置,以适应各种UI布局设计需求。
2、Guideline
Guideline 本身是不可见的,只作为一种虚拟边界来帮助对齐和定位其他视图。
可以为 Guideline 设置固定偏移(相对于父布局的起始或结束百分比)或者绝对偏移。
举例如下:
<?xml version="1.0" encoding="utf-8"?>
<androidx.constraintlayout.widget.ConstraintLayoutxmlns: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"><!-- 垂直 Guideline,位置为布局宽度的25% --><androidx.constraintlayout.widget.Guidelineandroid:id="@+id/verticalGuideline"android:layout_width="wrap_content"android:layout_height="wrap_content"android:orientation="vertical"app:layout_constraintGuide_percent="0.25" /><!-- 水平 Guideline,距离顶部100dp --><androidx.constraintlayout.widget.Guidelineandroid:id="@+id/horizontalGuideline"android:layout_width="wrap_content"android:layout_height="wrap_content"android:orientation="horizontal"app:layout_constraintGuide_begin="100dp" /><!-- 使用 Guideline 对齐的视图 --><TextViewandroid:layout_width="wrap_content"android:layout_height="wrap_content"android:text="Aligned with Vertical Guideline"android:background="#FF5722"app:layout_constraintStart_toStartOf="@id/verticalGuideline"app:layout_constraintTop_toTopOf="parent" /><TextViewandroid:layout_width="wrap_content"android:layout_height="wrap_content"android:text="Aligned with Horizontal Guideline"android:background="#3F51B5"app:layout_constraintTop_toTopOf="@id/horizontalGuideline"app:layout_constraintStart_toStartOf="parent" /></androidx.constraintlayout.widget.ConstraintLayout>
属性解释
垂直 Guideline:
android:orientation=“vertical”:设置为垂直指导线。
app:layout_constraintGuide_percent=“0.25”:位置占父布局宽度的25%。
水平 Guideline:
android:orientation=“horizontal”:设置为水平指导线。
app:layout_constraintGuide_begin=“100dp”:距离父布局顶部100dp的位置。
使用 Guideline 的好处
灵活性:可以通过调整 Guideline 的位置来全局修改多个元素的对齐。
可维护性:简化视图之间的约束定义,减少重复代码。
响应性:可以基于父容器的尺寸自动调整视图位置,增强布局的适配能力。
3、layout_constraintHorizontal_chainStyle
用于指定水平链样式的属性,主要的链样式包括:
spread(默认):视图之间均匀分布。
spread_inside: 视图之间保持大小和均匀分布,两端不等距。
packed: 视图集中在一起,可以通过设置偏移来调整链的位置。
1)、spread
2)、spread_inside
3)、packed
4)、代码:
<?xml version="1.0" encoding="utf-8"?>
<androidx.constraintlayout.widget.ConstraintLayout xmlns:android="http://schemas.android.com/apk/res/android"xmlns:app="http://schemas.android.com/apk/res-auto"xmlns:tools="http://schemas.android.com/tools"android:layout_width="match_parent"android:layout_height="match_parent"tools:context=".MainActivity"tools:layout_editor_absoluteY="25dp"><!-- 链头 控件 中设置 Chain 风格 spread --><Buttonandroid:id="@+id/button1"android:layout_width="wrap_content"android:layout_height="wrap_content"android:text="Button"app:layout_constraintEnd_toStartOf="@+id/button2"app:layout_constraintHorizontal_chainStyle="spread_inside"app:layout_constraintStart_toStartOf="parent" /><Buttonandroid:id="@+id/button2"android:layout_width="wrap_content"android:layout_height="wrap_content"android:text="Button"app:layout_constraintEnd_toStartOf="@+id/button3"app:layout_constraintStart_toEndOf="@+id/button1" /><Buttonandroid:id="@+id/button3"android:layout_width="wrap_content"android:layout_height="wrap_content"android:text="Button"app:layout_constraintEnd_toEndOf="parent"app:layout_constraintStart_toEndOf="@+id/button2" /></androidx.constraintlayout.widget.ConstraintLayout>
4、layout_constraintHorizontal_weight
举例:
0dp 布局宽度:
在 ConstraintLayout 中,要启用权重,需要将 layout_width 设置为 0dp。这表示视图的宽度将由权重和约束确定,而不是自身内容或父布局。
权重的分配:
Button 1 和 Button 2 设置了权重为 1,因此它们将占据相同的宽度。
Button 3 设置了权重为 2,因此它将占用两个单位宽度,相较于其他按钮更宽。
注意事项:
1、链的创建: 确保视图之间通过合适的约束(如 Start_toEndOf 和 End_toStartOf)链接成链。这是使用 layout_constraintHorizontal_weight 的前提条件。
2、效果影响: 权重的实际大小并不重要,重要的是他们之间比例。例如,权重为 1:2:3 与 2:4:6 执行效果相同,因为比例一致。
<?xml version="1.0" encoding="utf-8"?>
<androidx.constraintlayout.widget.ConstraintLayoutxmlns: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"><Buttonandroid:id="@+id/button1"android:layout_width="0dp" <!-- 使用 0dp 来启用权重 -->android:layout_height="wrap_content"android:text="Button 1"app:layout_constraintStart_toStartOf="parent"app:layout_constraintEnd_toStartOf="@id/button2"app:layout_constraintHorizontal_weight="1" /><Buttonandroid:id="@+id/button2"android:layout_width="0dp" <!-- 使用 0dp 来启用权重 -->android:layout_height="wrap_content"android:text="Button 2"app:layout_constraintStart_toEndOf="@id/button1"app:layout_constraintEnd_toStartOf="@id/button3"app:layout_constraintHorizontal_weight="1" /><Buttonandroid:id="@+id/button3"android:layout_width="0dp" <!-- 使用 0dp 来启用权重 -->android:layout_height="wrap_content"android:text="Button 3"app:layout_constraintStart_toEndOf="@id/button2"app:layout_constraintEnd_toEndOf="parent"app:layout_constraintHorizontal_weight="2" /></androidx.constraintlayout.widget.ConstraintLayout>
5、layout_constrainedWidth
可以参考学习:
app:layout_constrainedWidth=“true” 属性,是按约束去限制宽度,如下图:
app:layout_constrainedWidth=“false”, 如下图:
举例:
<androidx.constraintlayout.widget.ConstraintLayout 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"><TextViewandroid:id="@+id/textView1"android:layout_width="wrap_content"android:layout_height="40dp"android:background="#fafa"android:singleLine="true"android:text="Hello, World!"app:layout_constrainedWidth="true"app:layout_constraintEnd_toEndOf="parent"app:layout_constraintStart_toStartOf="parent"app:layout_constraintTop_toTopOf="parent" /><TextViewandroid:id="@+id/textView"android:layout_width="wrap_content"android:layout_height="50dp"android:background="#deedfd"android:singleLine="true"android:text="textviewtextviewtexiview"app:layout_constrainedWidth="true"app:layout_constraintEnd_toEndOf="@id/textView1"app:layout_constraintStart_toStartOf="@id/textView1"app:layout_constraintTop_toBottomOf="@id/textView1" />
</androidx.constraintlayout.widget.ConstraintLayout>