昨天我們了解到一些ConstraintLayout的基本常見使用姿勢
今天我們繼續介紹一些ConstraintLayout比以前AutoLayout多出來的東西(所以會看到一直噴⚠️)

輔助工具

1. Guideline
   可以隨意拉出多條垂直或水平的Guideline(可以固定距離或依比例)，做為約束參考之用，可以想成拍照時的輔助線，感覺滿好用的⚠️⚠️⚠️Xcode無
   
2. Barrier
   看了幾篇資料還是不太能掌握，之後理解了再回來補充。永別了
3. Group
   加入後，畫布看不到，但左下元件樹會多個Group，可以把元件拉到這個Group下，之後就可以對這個Group做設定。
   例如設成invisble的話，就會多個元件一起invisble。(好像就沒其他作用了，也不能變顏色之類的= =)

Chain

就是把多個元件水平或垂直串起來後，可以快速改變Chain的類型。⚠️⚠️⚠️Xcode無
不知道為什麼看到這個我就想到...

好，不要理我，繼續！

要把多個元件鏈結起來的方法也很簡單，先用⌘多選元件，然後右鍵>Chains>水平或垂直，就可以了。
鏈完之後，隨便一個元件上按右鍵>Cycle Chain mode，就可以改變鏈的類型了。(這邊我看有一些網路上資料可以有個浮動按鈕，但不知道為什麼我的AS沒有，知道原因的麻煩分享一下)

類型介紹如下：

(from android doc website)
有三種基本的類型是

1. Spread：平均分佈
2. Spread inside：去頭尾後平均分佈
3. Packed：靠緊置中

另外，Packed之後隨便對其中一個元件Bias就變成了Packed with Bias，而Weighted則是先把width改成0dp，然後用app:layout_constraintHorizontal_weight去設比重。

實作如下：

gone

1. Android在控制元件的顯示上，是用android:visibility這個屬性，與iOS不同的是：⚠️⚠️⚠️不是只有visible/invisible而已，還有一個gone。
   gone就是不顯示了，而且位置也被其他元件替補了；而invisible是不顯示而且位置還留著。
2. ConstraintLayout有個goneMargin系列的屬性～就是參考的對象gone了，要留多少邊距。
   請看左上角兩個按鈕的示範：
   1. 還沒gone之前，左邊元件跟右邊元件距離42
   2. 如果左邊gone了之後，右邊元件就離邊界42
   3. 但若有設定layout_goneMarginStart="16dp"，雖然原本間距是42，但此時距離邊界就會變成16

Baseline

就是文字的底線(元件上右鍵>shpw baseline)，可以讓你的文字對齊其他元件的文字底線(但是我覺得藍色的文字應該在第四行才對...這樣感覺好怪)。

CircleAngle

這功能也是很神奇⚠️⚠️⚠️，可以設定B元件在A元件的幾度角，距離多遠。

(from android doc website)

閃退

情境是我想說已經有設定高度跟比例了，就在XML裡把寬度刪掉，結果build得過但卻閃退，所以還是要看一下畫布區右上角有沒有紅色驚嘆號！

參考資料

• 太狂了整個網站都在講ConstraintLayout
• 這篇Gif很多，也很好懂
• 影片教學

今天的範例程式

可以去 https://github.com/mark33699/IDLA 看一下順便給顆⭐️

如果你喜歡我的影片別忘了按讚分享加訂閱，開啟紅色的小鈴鐺，我們明天見～