1.簡介
ConstraintLayout是一個ViewGroup,翻譯為限制布局,限制布局的出現主要是為了解決布局嵌套過深的情況,自android studio2.3開始,建立布局檔案預設根ViewGroup就是它
2.基本屬性
2.1 相對定位
例如TextView2需要放在TextView1後方,可以使用app:layout_constraintStart_toEndOf
Start_toEndOf
android:id="@+id/txt1"
android:text="Text1"/>
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)
圓形定位
android:id="@+id/img1"
android:layout_width="50dp"
android:layout_height="50dp"
android:src="@mipmap/ic_launcher_round"/>
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))
百分比尺寸
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
android:layout_width="0dp"
android:layout_height="wrap_content"
app:layout_constraintDimensionRatio="1:2"/>
如果兩個都設定為0dp的話
2.7chains
chains提供水準或垂直方向上的一組控件的排列方式
預設方式:spread
spread(預設方式)
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"/>
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"/>
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
android:id="@+id/btn1"
android:layout_width="0dp"
android:text="btn1"
app:layout_constraintEnd_toStartOf="@id/btn2"
app:layout_constraintStart_toStartOf="parent"/>
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: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)指定位置 優先級最高