Search code examples
androidradio-buttonscreen-resolution

dp or sp in Android Text


I have a question about Android and I need your help. I have the following RadioButton:

<RadioButton
    android:id="@+id/r_Button_Standard"
    android:layout_width="95dp"
    android:layout_height="35dp"
    android:layout_weight="1"
    android:background="@drawable/background_selector"
    android:text="@string/radioButton_standard"
    android:checked="true"
    android:textColor="@drawable/text_selector"
    app:layout_constraintBottom_toBottomOf="parent"
    app:layout_constraintEnd_toEndOf="parent"
    app:layout_constraintHorizontal_bias="0.642"
    app:layout_constraintStart_toStartOf="parent"
    app:layout_constraintTop_toTopOf="parent"
    android:layout_marginLeft="10dp"
    app:layout_constraintVertical_bias="0.671" />

It looks like this:RadioButton Now Android Studio generates a warning telling me to use "Should use "sp" instead of "dp" for text sizes" and further tells "There are cases where you might need to use dp; typically this happens when the text is in a container with a specific dp-size. This will prevent the text from spilling outside the container. Note however that this means that the user's font size settings are not respected, so consider adjusting the layout itself to be more flexible."

So now my question is what to do? Basically the text is in a container and it should obviously not spill outside of it. So I think I should use dp. What is meant by 'more flexible layout`?

Comment: Altough 'IntelliJ Amiya' closed this question and gave a link to a question that according to his point of view anseres my question (Should use "sp" instead of "dp" for text sizes) I have to say that in fact it does NOT. I am talking about text within a container not about general text.

Update: Here is my XML layout file:

<?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">


    <ImageView
        android:id="@+id/imageView"
        tools:ignore="ContentDescription"
        android:layout_width="465dp"
        android:layout_height="262dp"
        android:scaleType="fitXY"
        app:layout_constraintBottom_toBottomOf="parent"
        app:layout_constraintEnd_toEndOf="parent"
        app:layout_constraintHorizontal_bias="0.0"
        app:layout_constraintStart_toStartOf="parent"
        app:layout_constraintTop_toTopOf="parent"
        app:layout_constraintVertical_bias="0.0"
        app:srcCompat="@drawable/test_dish_1" />

    <TextView
        android:id="@+id/cocktailName"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:text="Test "
        android:textColor="#000000"
        android:textSize="28dp"
        android:textStyle="bold"
        app:layout_constraintBottom_toBottomOf="parent"
        app:layout_constraintEnd_toEndOf="parent"
        app:layout_constraintHorizontal_bias="0.482"
        app:layout_constraintStart_toStartOf="parent"
        app:layout_constraintTop_toTopOf="parent"
        app:layout_constraintVertical_bias="0.434" />


    <TextView
        android:id="@+id/textView3"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:text="Zutaten: Zutat_1, Zutat_2, Zutat_3,\n Zutat_4, Zutat_5, Zutat_6"
        app:layout_constraintBottom_toBottomOf="parent"
        app:layout_constraintEnd_toEndOf="parent"
        app:layout_constraintHorizontal_bias="0.489"
        app:layout_constraintStart_toStartOf="parent"
        app:layout_constraintTop_toTopOf="parent" />

    <TextView
        android:id="@+id/textViewA"
        android:layout_width="95dp"
        android:layout_height="35dp"
        android:text="Option_2"
        android:textColor="#000000"
        android:textSize="22dp"
        android:textStyle="bold"
        app:layout_constraintBottom_toBottomOf="parent"
        app:layout_constraintEnd_toEndOf="parent"
        app:layout_constraintHorizontal_bias="0.012"
        app:layout_constraintStart_toStartOf="parent"
        app:layout_constraintTop_toTopOf="parent"
        app:layout_constraintVertical_bias="0.671" />


    <ImageButton
        android:id="@+id/commentButton"
        android:layout_width="100dp"
        android:layout_height="50dp"
        android:background="@null"
        android:contentDescription="comment_Button"
        android:scaleType="fitCenter"
        app:layout_constraintBottom_toBottomOf="parent"
        app:layout_constraintEnd_toEndOf="parent"
        app:layout_constraintHorizontal_bias="0.0"
        app:layout_constraintStart_toStartOf="parent"
        app:layout_constraintTop_toTopOf="parent"
        app:layout_constraintVertical_bias="0.799"
        app:srcCompat="@mipmap/comment" />

    <TextView
        android:id="@+id/textView2"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:text="@string/comment_TextView"
        android:textSize="18dp"
        app:layout_constraintBottom_toBottomOf="parent"
        app:layout_constraintEnd_toEndOf="parent"
        app:layout_constraintHorizontal_bias="0.025"
        app:layout_constraintStart_toStartOf="parent"
        app:layout_constraintTop_toTopOf="parent"
        app:layout_constraintVertical_bias="0.729" />

    <CheckBox
        android:id="@+id/checkBox"
        android:layout_width="95dp"
        android:layout_height="35dp"
        android:checked="true"
        android:text="Check"
        app:layout_constraintBottom_toBottomOf="parent"
        app:layout_constraintEnd_toEndOf="parent"
        app:layout_constraintHorizontal_bias="0.967"
        app:layout_constraintStart_toStartOf="parent"
        app:layout_constraintTop_toTopOf="parent"
        app:layout_constraintVertical_bias="0.761" />

    <Button
        android:id="@+id/ordering_button"
        android:layout_width="163dp"
        android:layout_height="72dp"
        android:background="@drawable/custom_button"
        android:text="Bestellen"
        android:textAllCaps="false"
        android:textColor="#121212"
        android:textSize="25sp"
        app:layout_constraintBottom_toBottomOf="parent"
        app:layout_constraintEnd_toEndOf="parent"
        app:layout_constraintHorizontal_bias="0.5"
        app:layout_constraintStart_toStartOf="parent"
        app:layout_constraintTop_toTopOf="parent"
        app:layout_constraintVertical_bias="0.867" />


    <TextView
        android:id="@+id/textViewS"
        android:layout_width="95dp"
        android:layout_height="35dp"
        android:text="Option_1"
        android:textColor="#000000"
        android:textSize="22dp"
        android:textStyle="bold"
        app:layout_constraintBottom_toBottomOf="parent"
        app:layout_constraintEnd_toEndOf="parent"
        app:layout_constraintHorizontal_bias="0.012"
        app:layout_constraintStart_toStartOf="parent"
        app:layout_constraintTop_toTopOf="parent"
        app:layout_constraintVertical_bias="0.584" />

    <LinearLayout
        android:background="#FFD600"
        app:layout_constraintBottom_toBottomOf="parent"
        app:layout_constraintEnd_toEndOf="parent"
        app:layout_constraintStart_toStartOf="parent"
        android:id="@+id/bottom_layout"
        android:layout_width="0dp"
        android:layout_height="60dp">

        <Button
            android:id="@+id/button1"
            android:layout_width="0dp"
            android:layout_height="wrap_content"
            android:layout_gravity="center_vertical"
            android:layout_margin="4dp"
            android:layout_weight="1"
            android:background="@drawable/test_dish_1"
            android:text="Back" />


        <Button
            android:layout_gravity="center_vertical"
            android:id="@+id/button2"
            android:layout_weight="1"
            android:text="Button2"
            android:layout_width="0dp"
            android:layout_margin="4dp"
            android:layout_height="wrap_content"/>


        <Button
            android:layout_gravity="center_vertical"
            android:id="@+id/button3"
            android:layout_width="0dp"
            android:layout_weight="1"
            android:text="Button3"
            android:layout_margin="4dp"
            android:layout_height="wrap_content"/>

        <Button
            android:layout_gravity="center_vertical"
            android:id="@+id/button4"
            android:layout_width="0dp"
            android:layout_weight="1"
            android:text="Button1"
            android:layout_margin="4dp"
            android:layout_height="wrap_content"/>

    </LinearLayout>

    <RadioGroup
        android:id="@+id/radioGroup_Size"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:orientation="horizontal"
        app:layout_constraintBottom_toBottomOf="parent"
        app:layout_constraintEnd_toEndOf="parent"
        app:layout_constraintStart_toStartOf="parent"
        app:layout_constraintVertical_bias="0.583"
        app:layout_constraintHorizontal_bias="0.862"

        app:layout_constraintTop_toTopOf="parent">




        <RadioButton
            android:id="@+id/r_Button_Small"
            android:layout_width="95dp"
            android:layout_height="35dp"
            android:layout_weight="1"
            android:background="@drawable/background_selector"
            android:text="Klein"
            android:textColor="@drawable/text_selector"
            app:layout_constraintBottom_toBottomOf="parent"
            app:layout_constraintEnd_toEndOf="parent"
            app:layout_constraintHorizontal_bias="0.319"
            app:layout_constraintStart_toStartOf="parent"
            app:layout_constraintTop_toTopOf="parent"
            android:layout_marginLeft="10dp"
            app:layout_constraintVertical_bias="0.584" />

        <RadioButton
            android:id="@+id/r_Button_Medium"
            android:layout_width="95dp"
            android:layout_height="35dp"
            android:layout_weight="1"
            android:background="@drawable/background_selector"
            android:checked="true"
            android:text="Normal"
            android:textColor="@drawable/text_selector"
            app:layout_constraintBottom_toBottomOf="parent"
            app:layout_constraintEnd_toEndOf="parent"
            app:layout_constraintHorizontal_bias="0.962"
            app:layout_constraintStart_toStartOf="parent"
            android:layout_marginLeft="10dp"
            app:layout_constraintTop_toTopOf="parent"

            app:layout_constraintVertical_bias="0.583" />

        <RadioButton
            android:id="@+id/r_Button_Large"
            android:layout_width="95dp"
            android:layout_height="35dp"
            android:layout_weight="1"
            android:background="@drawable/background_selector"
            android:text="Groß"
            android:textColor="@drawable/text_selector"
            app:layout_constraintBottom_toBottomOf="parent"
            app:layout_constraintEnd_toEndOf="parent"
            app:layout_constraintHorizontal_bias="0.962"
            app:layout_constraintStart_toStartOf="parent"
            app:layout_constraintTop_toTopOf="parent"
            android:layout_marginLeft="10dp"
            app:layout_constraintVertical_bias="0.584" />

    </RadioGroup>

    <RadioGroup
        android:id="@+id/radioGroup_alcohol"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:orientation="horizontal"
        app:layout_constraintBottom_toBottomOf="parent"
        app:layout_constraintEnd_toEndOf="parent"
        app:layout_constraintStart_toStartOf="parent"
        app:layout_constraintVertical_bias="0.671"
        app:layout_constraintHorizontal_bias="0.872"

        app:layout_constraintTop_toTopOf="parent">

        <RadioButton
            android:id="@+id/r_Button_Less"
            android:layout_width="95dp"
            android:layout_height="35dp"
            android:layout_weight="1"
            android:background="@drawable/background_selector"
            android:text="Weniger"
            android:textColor="@drawable/text_selector"
            app:layout_constraintBottom_toBottomOf="parent"
            app:layout_constraintEnd_toEndOf="parent"
            app:layout_constraintHorizontal_bias="0.319"
            app:layout_constraintStart_toStartOf="parent"
            app:layout_constraintTop_toTopOf="parent"
            app:layout_constraintVertical_bias="0.671" />

        <RadioButton
            android:id="@+id/r_Button_Standard"
            android:layout_width="95dp"
            android:layout_height="35dp"
            android:layout_weight="1"
            android:background="@drawable/background_selector"
            android:text="@string/radioButton_standard"
            android:checked="true"
            android:textColor="@drawable/text_selector"
            app:layout_constraintBottom_toBottomOf="parent"
            app:layout_constraintEnd_toEndOf="parent"
            app:layout_constraintHorizontal_bias="0.642"
            app:layout_constraintStart_toStartOf="parent"
            app:layout_constraintTop_toTopOf="parent"
            android:layout_marginLeft="10dp"
            app:layout_constraintVertical_bias="0.671" />

        <RadioButton
            android:id="@+id/r_Button_More"
            android:layout_width="95dp"
            android:layout_height="35dp"
            android:layout_weight="1"
            android:background="@drawable/background_selector"
            android:text="Mehr"
            android:textColor="@drawable/text_selector"
            app:layout_constraintBottom_toBottomOf="parent"
            app:layout_constraintEnd_toEndOf="parent"
            app:layout_constraintHorizontal_bias="0.962"
            app:layout_constraintStart_toStartOf="parent"
            app:layout_constraintTop_toTopOf="parent"
            android:layout_marginLeft="10dp"
            app:layout_constraintVertical_bias="0.671" />


    </RadioGroup>
</android.support.constraint.ConstraintLayout>

Solution

  • Read this article to fully understand SP, DP and Piexel:

    Medium Article

    TL;DR

    SP == DP , but user preferences for font size in device setting app will also be applied to

    Consider a user has increased font size in settings and probably he would like to see a higher font size inside your app, sp would take care of that.

    <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">
    
    
        <ImageView
            android:id="@+id/imageView"
            android:layout_width="0dp"
            android:layout_height="250dp"
            android:scaleType="fitXY"
            app:layout_constraintEnd_toEndOf="parent"
            app:layout_constraintHorizontal_bias="0.0"
            app:layout_constraintStart_toStartOf="parent"
            app:layout_constraintTop_toTopOf="parent"
            app:srcCompat="@drawable/test_dish_1"
            tools:ignore="ContentDescription" />
    
        <TextView
            android:id="@+id/cocktailName"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:layout_marginTop="16dp"
            android:text="Test "
            android:textColor="#000000"
            android:textSize="28dp"
            android:textStyle="bold"
            app:layout_constraintEnd_toEndOf="parent"
            app:layout_constraintHorizontal_bias="0.482"
            app:layout_constraintStart_toStartOf="parent"
            app:layout_constraintTop_toBottomOf="@+id/imageView" />
    
    
        <TextView
            android:id="@+id/textView3"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:layout_marginTop="8dp"
            android:text="Zutaten: Zutat_1, Zutat_2, Zutat_3,\n Zutat_4, Zutat_5, Zutat_6"
            app:layout_constraintEnd_toEndOf="parent"
            app:layout_constraintHorizontal_bias="0.489"
            app:layout_constraintStart_toStartOf="parent"
            app:layout_constraintTop_toBottomOf="@+id/cocktailName" />
    
        <TextView
            android:id="@+id/textViewA"
            android:layout_width="95dp"
            android:layout_height="35dp"
            android:layout_marginStart="8dp"
            android:layout_marginTop="32dp"
            android:text="Option_2"
            android:textColor="#000000"
            android:textSize="22dp"
            android:textStyle="bold"
            app:layout_constraintStart_toStartOf="parent"
            app:layout_constraintTop_toBottomOf="@+id/textViewS" />
    
    
        <ImageButton
            android:id="@+id/commentButton"
            android:layout_width="100dp"
            android:layout_height="50dp"
            android:layout_marginStart="8dp"
            android:layout_marginTop="8dp"
            android:background="@null"
            android:contentDescription="comment_Button"
            android:scaleType="fitCenter"
            app:layout_constraintStart_toStartOf="parent"
            app:layout_constraintTop_toBottomOf="@+id/textView2"
            app:srcCompat="@mipmap/comment" />
    
        <TextView
            android:id="@+id/textView2"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:layout_marginStart="8dp"
            android:layout_marginTop="16dp"
            android:text="@string/comment_TextView"
            android:textSize="18dp"
            app:layout_constraintEnd_toEndOf="parent"
            app:layout_constraintHorizontal_bias="0.025"
            app:layout_constraintStart_toStartOf="parent"
            app:layout_constraintTop_toBottomOf="@+id/textViewA" />
    
        <CheckBox
            android:id="@+id/checkBox"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:layout_marginEnd="16dp"
            android:checked="true"
            android:text="Check"
            app:layout_constraintBottom_toTopOf="@+id/ordering_button"
            app:layout_constraintEnd_toEndOf="parent"
            app:layout_constraintTop_toBottomOf="@+id/radioGroup_alcohol" />
    
        <Button
            android:id="@+id/ordering_button"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:layout_marginBottom="8dp"
            android:background="@drawable/custom_button"
            android:padding="16dp"
            android:text="Bestellen"
            android:textAllCaps="false"
            android:textColor="#121212"
            android:textSize="25sp"
            app:layout_constraintBottom_toTopOf="@+id/bottom_layout"
            app:layout_constraintEnd_toEndOf="parent"
            app:layout_constraintHorizontal_bias="0.5"
            app:layout_constraintStart_toStartOf="parent" />
    
    
        <TextView
            android:id="@+id/textViewS"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:layout_marginStart="8dp"
            android:layout_marginTop="32dp"
            android:text="Option_1"
            android:textColor="#000000"
            android:textSize="22dp"
            android:textStyle="bold"
            app:layout_constraintStart_toStartOf="parent"
            app:layout_constraintTop_toBottomOf="@+id/textView3" />
    
        <LinearLayout
            android:background="#FFD600"
            app:layout_constraintBottom_toBottomOf="parent"
            app:layout_constraintEnd_toEndOf="parent"
            app:layout_constraintStart_toStartOf="parent"
            android:id="@+id/bottom_layout"
            android:layout_width="0dp"
            android:layout_height="60dp">
    
            <Button
                android:id="@+id/button1"
                android:layout_width="0dp"
                android:layout_height="wrap_content"
                android:layout_gravity="center_vertical"
                android:layout_margin="4dp"
                android:layout_weight="1"
                android:background="@drawable/test_dish_1"
                android:text="Back" />
    
    
            <Button
                android:layout_gravity="center_vertical"
                android:id="@+id/button2"
                android:layout_weight="1"
                android:text="Button2"
                android:layout_width="0dp"
                android:layout_margin="4dp"
                android:layout_height="wrap_content"/>
    
    
            <Button
                android:layout_gravity="center_vertical"
                android:id="@+id/button3"
                android:layout_width="0dp"
                android:layout_weight="1"
                android:text="Button3"
                android:layout_margin="4dp"
                android:layout_height="wrap_content"/>
    
            <Button
                android:layout_gravity="center_vertical"
                android:id="@+id/button4"
                android:layout_width="0dp"
                android:layout_weight="1"
                android:text="Button1"
                android:layout_margin="4dp"
                android:layout_height="wrap_content"/>
    
        </LinearLayout>
    
        <RadioGroup
            android:id="@+id/radioGroup_Size"
            android:layout_width="0dp"
            android:layout_height="wrap_content"
            android:layout_marginStart="8dp"
            android:layout_marginTop="32dp"
    
            android:layout_marginEnd="8dp"
            android:orientation="horizontal"
            app:layout_constraintBottom_toBottomOf="@+id/textViewS"
            app:layout_constraintEnd_toEndOf="parent"
            app:layout_constraintStart_toEndOf="@+id/textViewS"
            app:layout_constraintTop_toBottomOf="@+id/textView3">
    
    
            <RadioButton
                android:id="@+id/r_Button_Small"
                android:layout_width="0dp"
                android:layout_height="wrap_content"
                android:layout_marginLeft="10dp"
                android:layout_weight="1"
                android:background="@drawable/background_selector"
                android:padding="4"
                android:text="Klein"
                android:textColor="@drawable/text_selector"
                app:layout_constraintBottom_toBottomOf="parent"
                app:layout_constraintEnd_toEndOf="parent"
                app:layout_constraintHorizontal_bias="0.319"
                app:layout_constraintStart_toStartOf="parent"
                app:layout_constraintTop_toTopOf="parent"
                app:layout_constraintVertical_bias="0.584" />
    
            <RadioButton
                android:id="@+id/r_Button_Medium"
                android:layout_width="0dp"
                android:layout_height="wrap_content"
                android:layout_marginLeft="10dp"
                android:layout_weight="1"
                android:background="@drawable/background_selector"
                android:checked="true"
                android:padding="4dp"
                android:text="Normal"
                android:textColor="@drawable/text_selector"
                app:layout_constraintBottom_toBottomOf="parent"
                app:layout_constraintEnd_toEndOf="parent"
                app:layout_constraintHorizontal_bias="0.962"
                app:layout_constraintStart_toStartOf="parent"
    
                app:layout_constraintTop_toTopOf="parent"
                app:layout_constraintVertical_bias="0.583" />
    
            <RadioButton
                android:id="@+id/r_Button_Large"
                android:layout_width="0dp"
                android:layout_height="wrap_content"
                android:layout_marginLeft="10dp"
                android:layout_weight="1"
                android:background="@drawable/background_selector"
                android:padding="4dp"
                android:text="Groß"
                android:textColor="@drawable/text_selector"
                app:layout_constraintBottom_toBottomOf="parent"
                app:layout_constraintEnd_toEndOf="parent"
                app:layout_constraintHorizontal_bias="0.962"
                app:layout_constraintStart_toStartOf="parent"
                app:layout_constraintTop_toTopOf="parent"
                app:layout_constraintVertical_bias="0.584" />
    
        </RadioGroup>
    
        <RadioGroup
            android:id="@+id/radioGroup_alcohol"
            android:layout_width="0dp"
            android:layout_height="wrap_content"
            android:layout_marginStart="8dp"
            android:layout_marginTop="32dp"
    
            android:layout_marginEnd="8dp"
            android:orientation="horizontal"
            app:layout_constraintBottom_toBottomOf="@+id/textViewA"
            app:layout_constraintEnd_toEndOf="parent"
            app:layout_constraintStart_toEndOf="@+id/textViewA"
            app:layout_constraintTop_toBottomOf="@+id/radioGroup_Size">
    
            <RadioButton
                android:id="@+id/r_Button_Less"
                android:layout_width="0dp"
                android:layout_height="wrap_content"
                android:layout_weight="1"
                android:background="@drawable/background_selector"
                android:padding="4dp"
                android:text="Weniger"
                android:textColor="@drawable/text_selector"
                app:layout_constraintBottom_toBottomOf="parent"
                app:layout_constraintEnd_toEndOf="parent"
                app:layout_constraintHorizontal_bias="0.319"
                app:layout_constraintStart_toStartOf="parent"
                app:layout_constraintTop_toTopOf="parent"
                app:layout_constraintVertical_bias="0.671" />
    
            <RadioButton
                android:id="@+id/r_Button_Standard"
                android:layout_width="0dp"
                android:layout_height="wrap_content"
                android:layout_marginLeft="10dp"
                android:layout_weight="1"
                android:background="@drawable/background_selector"
                android:checked="true"
                android:padding="4dp"
                android:text="@string/radioButton_standard"
                android:textColor="@drawable/text_selector"
                app:layout_constraintBottom_toBottomOf="parent"
                app:layout_constraintEnd_toEndOf="parent"
                app:layout_constraintHorizontal_bias="0.642"
                app:layout_constraintStart_toStartOf="parent"
                app:layout_constraintTop_toTopOf="parent"
                app:layout_constraintVertical_bias="0.671" />
    
            <RadioButton
                android:id="@+id/r_Button_More"
                android:layout_width="0dp"
                android:layout_height="wrap_content"
                android:layout_marginLeft="10dp"
                android:layout_weight="1"
                android:background="@drawable/background_selector"
                android:padding="4dp"
                android:text="Mehr"
                android:textColor="@drawable/text_selector"
                app:layout_constraintBottom_toBottomOf="parent"
                app:layout_constraintEnd_toEndOf="parent"
                app:layout_constraintHorizontal_bias="0.962"
                app:layout_constraintStart_toStartOf="parent"
                app:layout_constraintTop_toTopOf="parent"
                app:layout_constraintVertical_bias="0.671" />
    
    
        </RadioGroup>
    </android.support.constraint.ConstraintLayout>