ConstraintLayout with multiple widgets in each chain link

Question

What's the right way to create a chain in a ConstraintLayout, in which each chain link has more than one widget?

This is what I want to achieve:

I'd like the chain to be: (easy button & score) === (medium button & score) === (hard button & score).

Obviously the traditional way of doing this would be to put each button & textview pair into its own layout, and chain those layouts. But my understanding is that ConstraintLayouts should avoid this: no layouts inside layouts, everything is flattened. Can it be done this way, or is the "flat layout" rule just not viable?

NB: This is simplified. My activity actually has many more components within the each group, so I'm looking for a general solution that isn't specific to, say, chain links of 2 components each.

My XML (in which the TextViews are completely unconstrained):

<?xml version="1.0" encoding="utf-8"?>
<android.support.constraint.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:layout_editor_absoluteX="0dp"
                                             tools:layout_editor_absoluteY="25dp">

    <Button
        android:id="@+id/main_menu_difficulty_hard"
        android:layout_height="wrap_content"
        android:layout_marginBottom="50dp"
        android:layout_marginLeft="8dp"
        android:layout_marginRight="8dp"
        android:paddingEnd="50sp"
        android:paddingStart="50sp"
        android:text="@string/hard"
        app:layout_constraintBottom_toBottomOf="parent"
        app:layout_constraintLeft_toLeftOf="parent"
        app:layout_constraintRight_toRightOf="parent"
        app:layout_constraintTop_toBottomOf="@+id/main_menu_difficulty_medium"
        app:layout_constraintVertical_chainStyle="spread_inside"/>

    <Button
        android:id="@+id/main_menu_difficulty_medium"
        android:layout_width="0dp"
        android:layout_height="wrap_content"
        android:paddingEnd="50sp"
        android:paddingStart="50sp"
        android:text="@string/medium"
        app:layout_constraintBottom_toTopOf="@+id/main_menu_difficulty_hard"
        app:layout_constraintTop_toBottomOf="@+id/main_menu_difficulty_easy"
        app:layout_constraintVertical_chainStyle="spread_inside"
        android:layout_marginLeft="8dp"
        app:layout_constraintLeft_toLeftOf="parent"
        android:layout_marginRight="8dp"
        app:layout_constraintRight_toRightOf="parent"
        app:layout_constraintHorizontal_bias="0.502"/>

    <Button
        android:id="@+id/main_menu_difficulty_easy"
        android:layout_width="0dp"
        android:layout_height="wrap_content"
        android:layout_marginEnd="8dp"
        android:layout_marginLeft="8dp"
        android:layout_marginRight="8dp"
        android:layout_marginStart="8dp"
        android:layout_marginTop="50dp"
        android:paddingEnd="50sp"
        android:paddingStart="50sp"
        android:text="@string/easy"
        app:layout_constraintBottom_toTopOf="@+id/main_menu_difficulty_medium"
        app:layout_constraintHorizontal_bias="0.0"
        app:layout_constraintLeft_toLeftOf="parent"
        app:layout_constraintRight_toRightOf="parent"
        app:layout_constraintTop_toTopOf="parent"
        app:layout_constraintVertical_chainStyle="spread_inside"/>

    <TextView
        android:id="@+id/textView"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:text="Best score: 20"
        tools:layout_editor_absoluteX="16dp"
        tools:layout_editor_absoluteY="328dp"/>

    <TextView
        android:id="@+id/textView3"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:text="Best score: 20"
        tools:layout_editor_absoluteX="16dp"
        tools:layout_editor_absoluteY="558dp"/>

    <TextView
        android:id="@+id/textView2"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:text="Best score: 20"
        tools:layout_editor_absoluteX="16dp"
        tools:layout_editor_absoluteY="98dp"/>

</android.support.constraint.ConstraintLayout>

Answer 1

Well, this will help :

  <?xml version="1.0" encoding="utf-8"?>
<android.support.constraint.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:layout_editor_absoluteX="0dp"
    tools:layout_editor_absoluteY="25dp">

    <Button
        android:id="@+id/main_menu_difficulty_hard"
        android:layout_height="wrap_content"
        android:layout_width="match_parent"
        android:layout_marginBottom="8dp"
        android:layout_marginEnd="8dp"
        android:layout_marginLeft="8dp"
        android:layout_marginRight="8dp"
        android:layout_marginStart="8dp"
        android:layout_marginTop="8dp"
        android:paddingEnd="50sp"
        android:paddingStart="50sp"
        android:text="@string/hard"
        app:layout_constraintBottom_toBottomOf="parent"
        app:layout_constraintEnd_toEndOf="parent"
        app:layout_constraintLeft_toLeftOf="parent"
        app:layout_constraintRight_toRightOf="parent"
        app:layout_constraintStart_toStartOf="parent"
        app:layout_constraintTop_toBottomOf="@+id/main_menu_difficulty_medium"
        app:layout_constraintVertical_chainStyle="spread_inside" />

    <Button
        android:id="@+id/main_menu_difficulty_medium"
        android:layout_width="0dp"
        android:layout_height="wrap_content"
        android:layout_marginBottom="8dp"
        android:layout_marginEnd="8dp"
        android:layout_marginLeft="8dp"
        android:layout_marginRight="8dp"
        android:layout_marginStart="8dp"
        android:layout_marginTop="8dp"
        android:paddingEnd="50sp"
        android:paddingStart="50sp"
        android:text="@string/medium"
        app:layout_constraintBottom_toBottomOf="parent"
        app:layout_constraintEnd_toEndOf="parent"
        app:layout_constraintHorizontal_bias="0.502"
        app:layout_constraintLeft_toLeftOf="parent"
        app:layout_constraintRight_toRightOf="parent"
        app:layout_constraintStart_toStartOf="parent"
        app:layout_constraintTop_toTopOf="parent"
        app:layout_constraintVertical_chainStyle="spread_inside" />

    <Button
        android:id="@+id/main_menu_difficulty_easy"
        android:layout_width="0dp"
        android:layout_height="wrap_content"
        android:layout_marginBottom="8dp"
        android:layout_marginLeft="8dp"
        android:layout_marginRight="8dp"
        android:layout_marginTop="8dp"
        android:paddingEnd="50sp"
        android:paddingStart="50sp"
        android:text="@string/easy"
        app:layout_constraintBottom_toTopOf="@+id/main_menu_difficulty_medium"
        app:layout_constraintHorizontal_bias="0.0"
        app:layout_constraintLeft_toLeftOf="parent"
        app:layout_constraintRight_toRightOf="parent"
        app:layout_constraintTop_toTopOf="parent"
        app:layout_constraintVertical_chainStyle="spread_inside" />

    <TextView
        android:id="@+id/textView"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_marginEnd="8dp"
        android:layout_marginStart="8dp"
        android:text="Best score: 20"
        app:layout_constraintEnd_toEndOf="parent"
        app:layout_constraintHorizontal_bias="0.028"
        app:layout_constraintStart_toStartOf="parent"
        app:layout_constraintTop_toBottomOf="@+id/main_menu_difficulty_medium" />

    <TextView
        android:id="@+id/textView3"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_marginEnd="8dp"
        android:layout_marginStart="8dp"
        android:text="Best score: 20"
        app:layout_constraintEnd_toEndOf="parent"
        app:layout_constraintHorizontal_bias="0.028"
        app:layout_constraintStart_toStartOf="parent"
        app:layout_constraintTop_toBottomOf="@+id/main_menu_difficulty_hard" />

    <TextView
        android:id="@+id/textView2"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_marginEnd="8dp"
        android:layout_marginStart="16dp"
        android:text="Best score: 20"
        app:layout_constraintEnd_toEndOf="parent"
        app:layout_constraintHorizontal_bias="0.0"
        app:layout_constraintStart_toStartOf="parent"
        app:layout_constraintTop_toBottomOf="@+id/main_menu_difficulty_easy" />

</android.support.constraint.ConstraintLayout>