1.简介
ConstraintLayout是一个ViewGroup，翻译为约束布局，约束布局的出现主要是为了解决布局嵌套过深的情况，自android studio2.3开始，新建布局文件默认根ViewGroup就是它
2.基本属性
2.1 相对定位
例如TextView2需要放在TextView1后方，可以使用app:layout_constraintStart_toEndOf
Start_toEndOf
<TextView
android:id="@+id/txt1"
android:text="Text1"/>
<TextView
android:id="@+id/txt2"
android:text="Text2"
app:layout_constraintStart_toEndOf="@id/txt1"/>
相似的属性有：
- layout_constraintLeft_toLeftOf
- layout_constraintLeft_toRightOf
- layout_constraintRight_toLeftOf
- layout_constraintRight_toRightOf
- layout_constraintTop_toTopOf
- layout_constraintTop_toBottomOf
- layout_constraintBottom_toTopOf
- layout_constraintBottom_toBottomOf
- layout_constraintBaseline_toBaselineOf：对TextView有效，基线对齐
- layout_constraintStart_toEndOf
- layout_constraintStart_toStartOf
- layout_constraintEnd_toStartOf
- layout_constraintEnd_toEndOf
如果是依赖父布局的话可以使用parent
app:layout_constraintStart_toEndOf="parent"
2.2间距margins
margin和其它布局方式一样，支持的属性有：
- android:layout_marginStart
- android:layout_marginEnd
- android:layout_marginLeft
- android:layout_marginTop
- android:layout_marginRight
- android:layout_marginBottom
但是ConstraintLayout多了一种间距goneMargin，用来指定当依赖的控件visibility为gone时的间距，此属性当且仅当依赖控件为gone时生效，支持属性：
- layout_goneMarginStart
- layout_goneMarginEnd
- layout_goneMarginLeft
- layout_goneMarginTop
- layout_goneMarginRight
- layout_goneMarginBottom
2.3居中定位和偏移bias
如果想相对于一个依赖的控件垂直居中，例如想要相对于根布局水平居中，使用
水平居中
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintEnd_toEndOf="parent"
如果是别的控件，填对应控件id即可
如果想要距离左边偏移30%，则可以使用
向左偏移30%
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintHorizontal_bias="0.3"
2.4圆形定位
一般APP都有这样的功能：在人物头像右下角显示一个等级标识
用圆形定位就很容易实现这种效果，圆形定位相关属性有三个：
-
layout_constraintCircle : 制定依赖控件的id
-
layout_constraintCircleRadius : 距离依赖控件中心点的距离
-
layout_constraintCircleAngle : 指定位于依赖控件的方向（0-360）
圆形定位
<ImageView android:id="@+id/img1" android:layout_width="50dp" android:layout_height="50dp" android:src="@mipmap/ic_launcher_round"/> <ImageView android:layout_width="20dp" android:layout_height="20dp" android:src="@drawable/shape_circle" app:layout_constraintCircle="@id/img1" app:layout_constraintCircleRadius="30dp" app:layout_constraintCircleAngle="135"/>
2.5百分比尺寸
前提条件：
-
宽或高需要设置为MATCH_PARENT（即设置为0dp）
-
设置属性layout_constraintWidth_percent 或者 layout_constraintHeight_percent（值为[0,1)）
百分比尺寸
<Button android:layout_width="0dp" android:layout_height="0dp" app:layout_constraintWidth_percent="0.8" app:layout_constraintHeight_percent="0.2"/>
2.6比例尺寸
顾名思义就是按比例设置尺寸，相关属性：
-
app:layout_constraintDimensionRatio
一般情况下宽和高一个设置0dp一个设置WRAP_CONTENT即可
宽：高=1：2
<Button android:layout_width="0dp" android:layout_height="wrap_content" app:layout_constraintDimensionRatio="1:2"/>
如果两个都设置为0dp的话
2.7chains
chains提供水平或垂直方向上的一组控件的排列方式
默认方式：spread
spread(默认方式)
<Button
android:id="@+id/btn1"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="btn1"
app:layout_constraintEnd_toStartOf="@id/btn2"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintHorizontal_chainStyle="spread"/>
<Button
android:id="@+id/btn2"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="btn2"
app:layout_constraintEnd_toStartOf="@id/btn3"
app:layout_constraintStart_toEndOf="@id/btn1"/>
<Button
android:id="@+id/btn3"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="btn3"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintStart_toEndOf="@id/btn2"/>
方式：spread-inside
spread-inside
app:layout_constraintHorizontal_chainStyle="spread_inside"
方式：packed
packed
app:layout_constraintHorizontal_chainStyle="packed"
方式：weighted chain
该形式只在spread mode下体现出来，比如可以设置btn1和btn2的宽度为MATCH_PARENT(0dp)来平分剩余的空间
Weighted chain
<Button
android:id="@+id/btn1"
android:layout_width="0dp"
android:text="btn1"
app:layout_constraintEnd_toStartOf="@id/btn2"
app:layout_constraintStart_toStartOf="parent"/>
<Button
android:id="@+id/btn2"
android:layout_width="0dp"
android:layout_height="wrap_content"
android:text="btn2"
app:layout_constraintEnd_toStartOf="@id/btn3"
app:layout_constraintStart_toEndOf="@id/btn1"/>
3辅助控件
3.1Barrier
有下面一个场景：有两行长度不一的文本现在要在两行文本后面添加一个文本，需要后添加的文本保证位于两行文本较长的后方
text内容比text2长
text2内容比text1长
<android.support.constraint.Barrier
android:id="@+id/barrier"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
app:barrierDirection="end"
app:constraint_referenced_ids="txt1,txt2"/>
用到的属性有两个:
- app:barrierDirection="end" ：指定界限方向 left|start|right|end|top|bottom
- app:constraint_referenced_ids="txt1,txt2"：指定id集合，用‘,’隔开
3.2Group
group制定一组控件，可以设置该组控件的可见性
- app:constraint_referenced_ids="txt1,txt2" ：指定id集合，用‘,’隔开
- android:visibility="gone"
3.3Guideline
guideline是一条看不见的线，可以设置其位置，然后让其余控件依赖此guideline从而进行布局
相关属性有三个
- android:orientation：指定guideline方向 horizontal|vertical
- app:layout_constraintGuide_begin：指定guideline距离布局左边位置(dp) 优先级>layout_constraintGuide_end
- app:layout_constraintGuide_end：指定guideline距离布局右边位置(dp) 优先级最低
- app:layout_constraintGuide_percent：以小数形式(0-1)指定位置 优先级最高
网友评论