看到很多讲ConstraintLayout都没有关于可视化界面里添加约束的内容，我就简单演示一下，个人感觉这是个很实用的技巧，对提高我们的开发效率很有帮助。
下面我用几个GIF展示一下，相信会有一些帮助的。
design.gif
其中的主要内容有：添加控件、添加基础布局、控件的横向居中、简单修改内容、切换宽高的自适应方式、调整位置百分比（居中的百分比是50）。
屏幕居中.gif
上面演示屏幕居中。
相对位置和对齐.gif
上面演示控件的相对位置和对齐操作。
内容改变.gif
上面演示内容改变时其它控件的变化。
固定宽度.gif
上面演示固定宽度的操作。
然后撤销，来看看另一种固定宽度怎么操作。
另一种固定宽度.gif
上面演示另外一种固定宽度操作。其中通过外部约束获取宽度的方式最上面内容为111的TextView已经演示过了。
其它的我就不一一演示了，其实以上演示的内容就能处理很多布局适配的方式了。
当然，如gif演示的方式可以添加的约束并不完全，ConstraintLayout的功能很多，还有好多约束并不能这么添加，比如控件固定宽高比。这时候就需要结合xml的方式添加了。而且控件的样式颜色之类的也需要进入xml进操作。
这种方式效率很高，而且所见即所得的方式实在是太棒了。最主要的是这种方式不容易遗漏约束，也在很大程度上降低了ConstraintLayout的使用门槛（一些情况下如果我不使用这种方式，用ConstraintLayout写一些简单的布局我可能都写不好，对我来说，ConstraintLayout太复杂了点，如果是纯xml这种方式，太容易漏约束了）。
