Constraint Layout won`t work with Scroll View

Question

In Android Studio all looks like this:

But when app open it looks like this:

It looks like all buttons are in same place.

Here is mt XML:

<?xml version="1.0" encoding="utf-8"?>
<ScrollView 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"
    android:layout_weight="1"
    android:background="@color/colorBackground"
    tools:context="com.example.dusan.unitconverter9.MainActivity">

    <android.support.constraint.ConstraintLayout
        android:layout_width="match_parent"
        android:layout_weight="1"
        android:layout_height="match_parent">


        <Button
            android:id="@+id/btnDuzina"
            android:layout_width="110dp"
            android:layout_height="70dp"
            android:layout_marginLeft="10dp"
            android:layout_marginTop="8dp"
            android:text="Duzina"
            android:background="@color/colorButton"
            app:layout_constraintLeft_toLeftOf="parent"
            app:layout_constraintTop_toTopOf="parent" />

        <Button
            android:id="@+id/btnMasa"
            android:layout_width="110dp"
            android:layout_height="70dp"
            android:text="Masa"
            android:layout_marginLeft="10dp"
            android:layout_marginRight="10dp"
            android:background="@color/colorButton"
            app:layout_constraintHorizontal_bias="1.0"
            app:layout_constraintLeft_toRightOf="@+id/btnTemperatura"
            app:layout_constraintRight_toRightOf="parent"
            tools:layout_editor_absoluteY="8dp" />


        <Button
            android:id="@+id/btnTemperatura"
            android:layout_width="110dp"
            android:text="Temperatura"
            android:layout_height="70dp"
            android:layout_marginLeft="17dp"
            android:background="@color/colorButton"
            app:layout_constraintLeft_toRightOf="@+id/btnDuzina"
            tools:layout_editor_absoluteY="8dp" />
        <Button
            android:id="@+id/btnBrzina"
            android:layout_width="110dp"
            android:background="@color/colorButton"
            android:layout_marginTop="10dp"
            android:layout_height="70dp"
            android:text="brzina"
            tools:layout_editor_absoluteX="10dp"
            tools:layout_editor_absoluteY="87dp" />

        <Button
            android:id="@+id/btnZapremina"
            android:layout_width="110dp"
            android:layout_height="70dp"
            android:background="@color/colorButton"
            android:text="zapremina"
            android:layout_marginTop="10dp"
            tools:layout_editor_absoluteY="87dp"
            tools:layout_editor_absoluteX="137dp" />

        <Button
            android:id="@+id/btnVreme"
            android:layout_width="110dp"
            android:layout_height="70dp"
            android:background="@color/colorButton"
            android:text="vreme"
            android:layout_marginTop="10dp"
            tools:layout_editor_absoluteY="87dp"
            tools:layout_editor_absoluteX="264dp" />

        (Bunch of buttons.....)


    </android.support.constraint.ConstraintLayout>

</ScrollView>

I have feel it is because of Scroll View but I don`t know how to fix it.

Thanks.

Answer 1

You are missing the run-time constraints for your buttons in your layout.

To fix this issue, go inside the Layout Editor, and click on the infer constraints button (https://developer.android.com/training/constraint-layout/index.html#use-autoconnect-and-infer-constraints), recompile and the app should look fine in the Android Emulator.