居中

1、父容器的居中

image.png

<android.support.constraint.ConstraintLayout xmlns:android="http://schemas.android.com/apk/res/android"
    android:layout_width="match_parent"
    android:layout_height="@dimen/size_dp_80"
    xmlns:app="http://schemas.android.com/apk/res-auto"
    android:background="@drawable/bg_white_cir">

    <ImageView
        android:id="@+id/image"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        app:layout_constraintLeft_toLeftOf="parent"
        app:layout_constraintRight_toRightOf="parent"
        app:layout_constraintTop_toTopOf="parent"
        app:layout_constraintBottom_toBottomOf="parent"
        android:layout_marginLeft="@dimen/size_dp_30"
        android:src="@drawable/icon_home_fixed"
        />

</android.support.constraint.ConstraintLayout>

2、多个控件居中

image.png

实现思路是在链头加上 类似代码，让脑袋中抽象的链条 用constraintLayout的chain属性实现

app:layout_constraintHorizontal_chainStyle="packed"

chain 除了链条方向有横向和竖向区分外， chain链条上的模式有 3种

• spread - 元素将被展开（默认样式） 。加权链 - 在spread模式下，如果某些小部件设置为MATCH_CONSTRAINT，则它们将拆分可用空间
• spread_inside - 类似，但链的端点将不会扩展
• packed - 链的元素将被打包在一起。 孩子的水平或垂直偏差属性将影响包装元素的定位

<?xml version="1.0" encoding="utf-8"?>
<android.support.constraint.ConstraintLayout xmlns:android="http://schemas.android.com/apk/res/android"
    android:layout_width="match_parent"
    android:layout_height="@dimen/size_dp_80"
    xmlns:app="http://schemas.android.com/apk/res-auto"
    xmlns:tools="http://schemas.android.com/tools"
    android:background="@drawable/bg_white_cir">

    <ImageView
        android:id="@+id/image"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        app:layout_constraintLeft_toLeftOf="parent"
        app:layout_constraintRight_toLeftOf="@+id/textView"
        app:layout_constraintTop_toTopOf="parent"
        app:layout_constraintBottom_toBottomOf="parent"
        app:layout_constraintHorizontal_chainStyle="packed"
        android:layout_marginLeft="@dimen/size_dp_30"
        android:src="@drawable/icon_home_fixed"
        />
    <TextView
        android:id="@+id/textView"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        app:layout_constraintLeft_toRightOf="@+id/image"
        app:layout_constraintRight_toRightOf="parent"
        app:layout_constraintTop_toTopOf="parent"
        app:layout_constraintBottom_toBottomOf="parent"
        tools:text="Hello Word"
        />

</android.support.constraint.ConstraintLayout>