界面布局之约束布局（ConstraintLayout）（一）

前言

以前读书的时候，不知道约束布局怎么使用，所以会在创建项目的时候，先把布局改成LinearLayout或RelativeLayout，对于我这种菜鸟而言，RelativeLayout能够自由拖拽简直太舒服了，但是会有一个问题，自由拖拽的控件，在不同屏幕大小的手机上显示的效果不好，所以我去学习了约束布局，看了约束布局后，用起来也是很舒服的。

正文

这里先分享一下我学习的文章约束布局ConstraintLayout看这一篇就够了
约束布局相对于LinearLayout来讲，嵌套的层数会更少，当然，如果只有一层当我没说，相对于RelativeLayout来讲，能更好的适配大小不同的屏幕。
为什么叫约束布局呢，因为在这个布局里，控件都会相对于另一个控件有约束关系。首先你放一个控件进去，会发现它会有问题。

当初看到这样，我直接想都不想，换个布局，这个驾驭不了驾驭不了。
其实很简单，加个约束就好了，既然只有这一个控件，那约束对象为父布局就好了。像这样

这里说一下它的属性
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
layout_constraintStart_toEndOf
layout_constraintStart_toStartOf
layout_constraintEnd_toStartOf
layout_constraintEnd_toEndOf
很好理解，举个例子，layout_constraintLeft_toLeftOf表示当前组件的左边和约束对象的左边对齐，由于确定位置不止需要X坐标，还需要Y坐标,所以接下来要对齐他的上边或者下边。如果同时设置 app:layout_constraintStart_toStartOf=“parent”
app:layout_constraintEnd_toEndOf=“parent”
的话，会发现组件水平位置会在父布局的中间

你会发现上面属性有一个不一样的，layout_constraintBaseline_toBaselineOf
这个表示，布局的文本基线对齐，就是说，如果两个textview高度不一样，但又想文字在同一个高度上，就可以用这个属性。

其他还有一些属性，可以参考我分享的文章，
这里注意一点，控件的尺寸约束，如果这个控件的宽度或者高度能够设置为match_parent，那就不需要对这个方向进行约束，当然这样是不建议的，所以，有这个需要的时候，可以把他的宽或高设置成0dp,这里以宽为例，设置左右约束布局，左边对齐父布局的左边，右边对齐父布局的右边

这样也可以实现铺满的效果
如果你希望两个空间，平分这个宽度，那你可以这样设置

   <TextView
        android:id="@+id/tv_text1"
        android:layout_width="0dp"
        android:layout_height="wrap_content"
        app:layout_constraintTop_toTopOf="parent"
        app:layout_constraintStart_toStartOf="parent"
        app:layout_constraintEnd_toStartOf="@+id/tv_text2"
        tools:text="sss"
        />
    <TextView
        android:id="@+id/tv_text2"
        android:layout_width="0dp"
        android:layout_height="wrap_content"
        app:layout_constraintTop_toTopOf="parent"
        app:layout_constraintStart_toEndOf="@+id/tv_text1"
        app:layout_constraintEnd_toEndOf="parent"
        tools:text="sss"
        />

这里是把左边控件的左边对齐父布局，左边控件的右边对齐右边控件的左边，右边控件的左边对齐左边控件的右边，右边控件的右边对齐父布局，好的，说的我都乱了，其实很好理解，看看就懂了。
暂时先说到这，后续看心情继续写。