constraintlayout布局拾遗

关于控制一组布局的消失隐藏：

三种方式：

1. xml里面定义变量(最推荐)：

代码中控制变量来显示和隐藏

   android:visibility="@{isShowWater?View.GONE:View.VISIBLE}"

tips： 许多没id的View，可以用。

2. 定义group，用group引用id（不推荐）：

group，应用id，你还需要去找相应的控件，对比第一种在控件上设置，相对比较麻烦，不喜欢这种方式，而且id很乱。
tips： 必须为所有隐藏布局设置id，（有些分割线等无id，都需要添加id）

3. 做布局嵌套（不推荐）。

这等于开历史倒车了

具体说下布局隐藏和显示的基础部分：
constainlayout的布局中，一个布局并不会随着另外一个布局的消失而消失。 如下，我的第二个TextView，左右上下都在第一个里面，设置第一个消失，第二并不会消失。

    <TextView
        android:id="@+id/text"
        android:layout_width="300dp"
        android:layout_height="200dp"
        android:background="@color/colorPrimary"
        app:layout_constraintBottom_toBottomOf="parent"
        app:layout_constraintLeft_toLeftOf="parent"
        app:layout_constraintRight_toRightOf="parent"
        app:layout_constraintTop_toTopOf="parent" />

    <TextView
        android:id="@+id/two"
        android:layout_width="200dp"
        android:layout_height="100dp"
        android:background="@color/colorAccent"
        android:text="Hello World!"
        app:layout_constraintStart_toStartOf="@id/text"
        app:layout_constraintEnd_toEndOf="@id/text"
        app:layout_constraintTop_toTopOf="@id/text"
        app:layout_constraintBottom_toBottomOf="@id/text"
    />

即便我写成这样，EditText，也不会随着第一个的gone而gone，只能使用group

  <TextView
            android:id="@+id/tv_water_price_title"         
            android:layout_width="wrap_content"
            android:layout_height="@dimen/list_menu_item_height"            
            app:layout_constraintTop_toBottomOf="@id/divider_1"
            app:layout_constraintStart_toStartOf="parent"
            app:layout_constraintBottom_toTopOf="@id/divider_2"/>

        <EditText
            android:id="@+id/edt_water_fee"         
            android:layout_width="0dp"
            android:layout_height="0dp"
            android:background="@color/white"        
            app:layout_constraintBottom_toBottomOf="@id/tv_water_price_title"
            app:layout_constraintEnd_toEndOf="parent"
            app:layout_constraintTop_toTopOf="@id/tv_water_price_title" />

重点是Gone隐藏掉的控件，会被解析成一个点，并忽略margin。

如果他们对其他小部件有约束力，那么他们仍然会受到尊重，但任何margin都将等于零

链条布局：链条布局chainstyle是控制空位的，如果没有空位，首位相连后，直接设置权重即可。

image.png

这种布局用链条是最合适的。

   <View
            android:id="@+id/tv_total_bg"
            android:layout_width="0dp"
            android:layout_height="55dp"
            app:layout_constraintBottom_toBottomOf="parent"           
            app:layout_constraintHorizontal_weight="2"
            app:layout_constraintStart_toStartOf="parent"
            app:layout_constraintEnd_toStartOf="@id/app_notification"/>

        <TextView
            android:id="@+id/app_notification"
            android:layout_width="0dp"
            android:layout_height="55dp"
            app:layout_constraintBottom_toBottomOf="parent"
            app:layout_constraintEnd_toStartOf="@id/msg_notification"     
            app:layout_constraintHorizontal_weight="1"
            app:layout_constraintStart_toEndOf="@id/tv_total_bg" />
   <View
            android:layout_width="0.1dp"
            android:layout_height="30dp"
            android:background="@color/white"
            app:layout_constraintBottom_toBottomOf="@id/app_notification"
            app:layout_constraintTop_toTopOf="@id/app_notification"
            app:layout_constraintEnd_toEndOf="@id/app_notification"/>


        <TextView
            android:id="@+id/msg_notification"
            android:layout_width="0dp"
            android:layout_height="55dp"
            app:layout_constraintBottom_toBottomOf="parent"
            app:layout_constraintEnd_toEndOf="parent"    
            app:layout_constraintHorizontal_weight="1"
            app:layout_constraintStart_toStartOf="@id/app_notification" />

权重做好后，中间的那根白线怎么布局:

1. 就像我代码的写法那样
2. 可以左边和app通知左边对齐，右边和短信通知右边对齐。（即：左对左，右对右）

little tips: 很多item的中间的线，都要采用这种方式，并且最好不要“前后布局夹着”（不要：左对右，右对左），夹着，可视化拖拽，和写控件都会存在很大问题，毕竟线像素1px不方便控制。

所有的布局都定义到一个View内部的时候，这个view设为Gone，所有布局就消失，不需要添加group。

比如：