ConstraintLayout 和 RelativeLayout 的区别

ConstraintLayout 的目的是通过对每个视图应用一些规则来优化和展平布局的视图层次结构以避免嵌套。

规则类似于 RelativeLayout，例如将底部边缘设置为某个其他视图的底部。

app:layout_constraintBottom_toBottomOf="@+id/view1"

与 RelativeLayout 不同，ConstraintLayout 提供了一个 bias 值，用于根据相对于手柄（用红色圆圈标记）的 0% 和 100% 水平和垂直偏移来定位视图。这些百分比（和分数）提供了跨不同屏幕密度和尺寸的无缝视图定位。

app:layout_constraintHorizontal_bias="0.33" <!-- from 0.0 to 1.0 -->
app:layout_constraintVertical_bias="0.53" <!-- from 0.0 to 1.0 -->

基线手柄（圆角的长管，位于圆形手柄下方）用于将视图的内容与另一个视图参考对齐。

方形手柄（在视图的每个角上）用于以 dps 调整视图的大小。

https://i.stack.imgur.com/cC0bG.jpg

这完全是基于意见和我对 ConstraintLayout 的印象

---

相对布局和约束布局等效属性

https://i.stack.imgur.com/ainDj.png

(1) 相对布局：

android:layout_centerInParent="true"    

(1) 约束布局等效：

app:layout_constraintBottom_toBottomOf="parent"
app:layout_constraintLeft_toLeftOf="parent"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintRight_toRightOf="parent"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintTop_toTopOf="parent"

(2) 相对布局：

android:layout_centerHorizontal="true"

(2) 约束布局等效：

app:layout_constraintLeft_toLeftOf="parent"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintRight_toRightOf="parent"
app:layout_constraintEnd_toEndOf="parent"

(3) 相对布局：

android:layout_centerVertical="true"    

(3) 约束布局等效：

app:layout_constraintBottom_toBottomOf="parent"
app:layout_constraintTop_toTopOf="parent"

(4) 相对布局：

android:layout_alignParentLeft="true"   

(4) 约束布局等效：

app:layout_constraintLeft_toLeftOf="parent"

(5) 相对布局：

android:layout_alignParentStart="true"

(5) 约束布局等效：

app:layout_constraintStart_toStartOf="parent"

(6) 相对布局：

android:layout_alignParentRight="true"

(6) 约束布局等效：

app:layout_constraintRight_toRightOf="parent"

(7) 相对布局：

android:layout_alignParentEnd="true"    

(7) 约束布局等效：

app:layout_constraintEnd_toEndOf="parent"

(8) 相对布局：

android:layout_alignParentTop="true"

(8) 约束布局等效：

app:layout_constraintTop_toTopOf="parent"

(9) 相对布局：

android:layout_alignParentBottom="true" 

(9) 约束布局等效：

app:layout_constraintBottom_toBottomOf="parent"

(10) 相对布局：

android:layout_alignStart="@id/view"

(10) 约束布局等效：

app:layout_constraintStart_toStartOf="@id/view"

(11) 相对布局：

android:layout_alignLeft="@id/view" 

(11) 等效约束布局：

app:layout_constraintLeft_toLeftOf="@id/view"

(12) 相对布局：

android:layout_alignEnd="@id/view"  

(12) 等效约束布局：

app:layout_constraintEnd_toEndOf="@id/view"

(13) 相对布局：

android:layout_alignRight="@id/view"

(13) 等效约束布局：

app:layout_constraintRight_toRightOf="@id/view"

(14) 相对布局：

android:layout_alignTop="@id/view"  

(14) 等效约束布局：

app:layout_constraintTop_toTopOf="@id/view"

(15) 相对布局：

android:layout_alignBaseline="@id/view" 

(15) 等效约束布局：

app:layout_constraintBaseline_toBaselineOf="@id/view"

(16) 相对布局：

android:layout_alignBottom="@id/view"

(16) 等效约束布局：

app:layout_constraintBottom_toBottomOf="@id/view"

(17) 相对布局：

android:layout_toStartOf="@id/view"

(17) 约束布局等效：

app:layout_constraintEnd_toStartOf="@id/view"

(18) 相对布局：

android:layout_toLeftOf="@id/view"  

(18) 等效约束布局：

app:layout_constraintRight_toLeftOf="@id/view"

(19) 相对布局：

android:layout_toEndOf="@id/view"

(19) 等效约束布局：

app:layout_constraintStart_toEndOf="@id/view"

(20) 相对布局：

android:layout_toRightOf="@id/view"

(20) 等效约束布局：

app:layout_constraintLeft_toRightOf="@id/view"

(21) 相对布局：

android:layout_above="@id/view" 

(21) 等效约束布局：

app:layout_constraintBottom_toTopOf="@id/view"

(22) 相对布局：

android:layout_below="@id/view" 

(22) 等效约束布局：

app:layout_constraintTop_toBottomOf="@id/view"

---

由 @davidpbr 报告的ConstraintLayout表现

我制作了两个类似的 7 子布局，每个布局都有一个父 ConstraintLayout 和 RelativeLayout。基于 Android Studio 方法跟踪工具，ConstraintLayout 似乎在 onMeasure 中花费了更多时间，并在 onFinishInflate 中执行了额外的工作。

使用的库（support-v4、appcompat-v7…）：

com.android.support.constraint:constraint-layout:1.0.0-alpha1

设备/Android 版本转载于：三星 Galaxy S6（SM-G920A。抱歉，没有 Nexus atm）。安卓 5.0.2

快速方法跟踪比较：

https://i.imgur.com/6OCCCvK.png

示例 Github 存储库：https://github.com/OnlyInAmerica/ConstraintLayoutPerf

---

以下是差异/优势：

约束布局具有相对布局和线性布局的双重功能：设置视图的相对位置（如相对布局）以及为动态 UI 设置权重（仅在线性布局中才有可能）。一个非常强大的用途是通过形成链来对元素进行分组。这样我们可以形成一组视图，它们作为一个整体可以以所需的方式放置，而无需添加另一层层次结构来形成另一组视图。除了权重之外，我们还可以应用水平和垂直偏差，这只不过是从中心位移的百分比。 （0.5 的偏差表示居中对齐。任何小于或大于的值都表示相应方向上的相应移动）。另一个非常重要的特性是它尊重并提供处理 GONE 视图的功能，因此如果通过 java 代码将某些视图设置为 GONE，布局不会中断。更多信息可以在这里找到：https://developer.android.com/reference/android/support/constraint/ConstraintLayout.html#VisibilityBehavior 通过使用蓝图和可视化编辑器工具提供自动约束应用的能力，这使得很容易设计一个页面。

所有这些功能都导致视图层次结构扁平化，从而提高了性能，还有助于制作响应式和动态 UI，从而更容易适应不同的屏幕尺寸和密度。

这是快速学习的最佳场所：https://codelabs.developers.google.com/codelabs/constraint-layout/#0

---

一个很大的区别是 ConstraintLayout 尊重约束，即使视图消失了。所以如果你有一个链并且你想让一个视图在中间消失，它不会破坏布局。

---

正式地，ConstraintLayout 是 much faster

在 Android 的 N 版本中，ConstraintLayout 类提供了与 RelativeLayout 类似的功能，但成本显着降低。

---

我能得出的结论是

1）我们可以在不接触xml部分代码的情况下进行UI设计，说实话我觉得google在iOS应用程序中的UI设计方式是抄袭的，如果你熟悉iOS中的UI开发会很有意义，但在相对布局中很难在不触及 xml 设计的情况下设置约束。

2）其次，它具有与其他布局不同的平面视图层次结构，因此比您可能从其他答案中看到的相对布局具有更好的性能

3）除了相对布局之外，它还有一些额外的东西，例如圆形相对定位，我们可以将另一个视图相对于这个视图以一定的半径和一定的角度定位，这在相对布局中是做不到的

我再说一遍，使用约束布局设计 UI 与在 iOS 中设计 UI 是一样的，所以将来如果你在 iOS 上工作，你会发现使用约束布局会更容易

---

除了@dhaval-jivani 答案。

我已将项目 github 项目更新为最新版本的约束布局 v.1.1.0-beta3

我已经测量并比较了 onCreate 方法的时间以及在 CPU 监视器中可见的 onCreate 开始和最后一个 preformDraw 方法执行结束之间的时间。所有测试均在带有 android 6.0.1 的三星 S5 mini 上完成，结果如下：

重新开始（应用程序启动后第一个屏幕打开）

相对布局

开启创建：123 毫秒

上次 preformDraw 时间 - OnCreate 时间：311.3ms

约束布局

OnCreate：120.3ms

上次 preformDraw 时间 - OnCreate 时间：310ms

除此之外，我从 article 和 here the code 检查了性能测试，发现循环计数小于 100 的约束布局变体在执行膨胀、测量和布局期间比使用相对布局的变体更快。而在旧的 Android 设备上，例如带有 Android 4.3 的三星 S3，差异更大。

作为结论，我同意 article 的评论：

从 RelativeLayout 或 LinearLayout 重构旧视图是否值得？与往常一样：这取决于🙂我不会重构任何东西，除非您当前的布局层次结构存在性能问题，或者您想要对布局进行重大更改。虽然我最近没有测量它，但我在最近的版本中没有发现任何性能问题。所以我认为你应该可以安全地使用它。但是——正如我所说——不要仅仅为了迁移而迁移。只有在需要并从中受益时才这样做。不过，对于新布局，我几乎总是使用 ConstraintLayout。与我们之前的相比，它好多了。

---

要问的真正问题是，是否有任何理由使用约束布局以外的任何布局？我相信答案可能是否定的。

对于那些坚持它们是针对新手程序员等的人来说，它们应该提供一些理由让它们不如任何其他布局。

约束布局在各个方面都更好（它们的 APK 大小确实像 150k 一样。）。它们更快、更简单、更灵活、对更改做出更好的反应、在项目消失时解决问题、它们更好地适应完全不同的屏幕类型并且它们不使用一堆嵌套循环那么长为所有内容绘制树结构。你可以把任何东西放在任何地方，关于任何东西，任何地方。

他们在 2016 年中期有点搞砸了，视觉布局编辑器还不够好，但他们的观点是，如果你有一个布局，你可能要认真考虑使用约束布局，甚至当它与 RelativeLayout 甚至是简单的 LinearLayout 做同样的事情时。 FrameLayouts 显然还是有他们的目的。但是，目前我看不到其他任何东西。如果他们从这个开始，他们就不会添加任何其他东西。

---

我注意到的唯一区别是，通过拖放在相对布局中设置的东西会自动推断出相对于其他元素的尺寸，因此当您运行应用程序时，所见即所得。但是，在约束布局中，即使您在设计视图中拖放元素，当您运行应用程序时，事情也可能会发生变化。这可以通过手动设置约束来轻松解决，或者更冒险的做法是右键单击组件树中的元素，选择约束布局子菜单，然后单击“推断约束”。希望这可以帮助

---