検証環境

この記事の内容は、以下の環境で検証した。
* Android Studio 3.0.2
* constraint-layout 1.0.2

はじめに

ConstrantLayoutには様々な設定項目があります。
下記の記事で記述したように、今回は「Centeringとbias」のみについて説明します。

また、レイアウトの配置やViewの基礎知識は下記を参照してください。

Curcular positioningを使用する前に注意点があります。
下記の確認すると「Added in 1.1」とあります。

ということは、build.gradleを確認しておかないとですね。
現時点で私のbuild.gradleはこうなっていました。

build.gradle

dependencies {
    implementation 'com.android.support.constraint:constraint-layout:1.0.2'
 }

これでは有効になっていませんね。
下記のように修正しました。

build.gradle

dependencies {
    implementation 'com.android.support.constraint:constraint-layout:1.1.0'
 }

無事に動きました。

レイアウトファイルを確認するまえに、配置の時に出てくる属性の意味を理解して置かなければなりません。
下図で、属性に設定する箇所を表してみました。特に丸囲み数字が対象となります。

この図では、goodというTextViewの中心点からの半径と角度でHelloを配置しています。
goodのTextViewがHelloの配置の基準点となっています。
上図見ながら、属性としてはどのような設定項目になっているか確認します。

番号	属性名	値
①	layout_constraintCircleAngle	基準点の頂点を0として、時計回りで0度〜360度で設定します。
②	layout_constraintCircle	基準点のViewを設定します。
③	layout_constraintCircleRadius	基準点からの半径を指定します。

レイアウトファイルで設定すると、Designは下記のようなイメージになります。

これまではViewの右や下などの配置だけでしたが、Circular positioningはかなり柔軟なViewの配置が可能ですね。