【備忘録】ConstraintLayoutで要素を縦に比率で表示する方法

#やりたいこと

下の写真のように、Questionを2、A0、A1、A2ボタンを１、NEXTボタンを0.5の比率で表示したい
![Qiita](https://user-images.githubusercontent.com/13096918/114034668-5a857700-98b9-11eb-96e8-313f789cf781.png)


#必須条件
- 要素の縦の位置関係を設定する
  <dl>
  <dt>app:layout_constraintBottom_toTopOf</dt>
  <dd>要素の下からどの要素の上につながっているか</dd>
  <dt>app:layout_constraintTop_toBottomOf</dt>
  <dd>要素の上からどの要素の下につながっているか</dd>
</dl>
- android:layout_heightを0dpにしておく
- app:layout_constraintVertical_chainStyle（縦方向に要素を並べる設定）をspread（均等配置）にする
- app:layout_constraintVertical_weightに比率を設定する

コードにするとこんな感じ

```xml:main.xml
<?xml version="1.0" encoding="utf-8"?>
<androidx.constraintlayout.widget.ConstraintLayout xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:app="http://schemas.android.com/apk/res-auto"
    xmlns:tools="http://schemas.android.com/tools"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    tools:context=".MainActivity">

    <TextView
        android:id="@+id/qText"
        android:layout_width="match_parent"
        android:layout_height="0dp"
        android:text="Question"
        android:textSize="32sp"
        android:textStyle="bold"
        android:gravity="center"
        app:layout_constraintBottom_toTopOf="@+id/a0Button"
        app:layout_constraintEnd_toEndOf="parent"
        app:layout_constraintStart_toStartOf="parent"
        app:layout_constraintTop_toTopOf="parent"
        app:layout_constraintVertical_chainStyle="spread"
        app:layout_constraintVertical_weight="2" />


    <Button
        android:id="@+id/a0Button"
        android:layout_width="match_parent"
        android:layout_height="0dp"
        android:onClick="checkAnswer"
        android:text="A0"
        app:layout_constraintBottom_toTopOf="@+id/a1Button"
        app:layout_constraintEnd_toEndOf="parent"
        app:layout_constraintStart_toStartOf="parent"
        app:layout_constraintTop_toBottomOf="@+id/qText"
        app:layout_constraintVertical_chainStyle="spread"
        app:layout_constraintVertical_weight="1" />


    <Button
        android:id="@+id/a1Button"
        android:layout_width="match_parent"
        android:layout_height="0dp"
        android:onClick="checkAnswer"
        android:text="A1"
        app:layout_constraintBottom_toTopOf="@+id/a2Button"
        app:layout_constraintEnd_toEndOf="parent"
        app:layout_constraintStart_toStartOf="parent"
        app:layout_constraintTop_toBottomOf="@+id/a0Button"
        app:layout_constraintVertical_chainStyle="spread"
        app:layout_constraintVertical_weight="1" />

    <Button
        android:id="@+id/a2Button"
        android:layout_width="match_parent"
        android:layout_height="0dp"
        android:onClick="checkAnswer"
        android:text="A2"
        app:layout_constraintBottom_toTopOf="@+id/nextButton"
        app:layout_constraintBottom_toBottomOf="parent"
        app:layout_constraintEnd_toEndOf="parent"
        app:layout_constraintStart_toStartOf="parent"
        app:layout_constraintTop_toBottomOf="@+id/a1Button"
        app:layout_constraintVertical_chainStyle="spread"
        app:layout_constraintVertical_weight="1" />

    <TextView
        android:id="@+id/scoreText"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:text="Score: 0 / 0"
        app:layout_constraintEnd_toEndOf="parent"
        app:layout_constraintTop_toTopOf="parent" />

    <Button
        android:id="@+id/nextButton"
        android:layout_width="wrap_content"
        android:layout_height="0dp"
        android:onClick="goNext"
        android:text="Next"
        app:layout_constraintBottom_toBottomOf="parent"
        app:layout_constraintEnd_toEndOf="parent"
        app:layout_constraintTop_toBottomOf="@+id/a2Button"
        app:layout_constraintVertical_chainStyle="spread"
        app:layout_constraintVertical_weight="0.5"/>
</androidx.constraintlayout.widget.ConstraintLayout>
```

これでやりたいことの写真と同じ画面ができる