The app that runs on my device is different to the preview

Question

android java

button positioning

the display that runs up on my device is different to the preview. The width and height aren't fixed, and this is in ConstraintLayout. The problem is with the Button; I want it to appear lower than both TextViews. What should i change with my code? (I did try to google it, and look for an answer but couldn't find anything relevant except for the "absoluteX, absoluteY" code for the button)

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

 <Button
   android:id="@+id/button_button_view"
   android:layout_width="wrap_content"
   android:layout_height="wrap_content"
   android:textAllCaps="true"
   android:text="order"
   tools:layout_editor_absoluteY="100dp"
   tools:layout_editor_absoluteX="4dp"/>

<TextView
    android:id="@+id/quantity_text_view"
    android:layout_width="wrap_content"
    android:layout_height="wrap_content"
    android:textAllCaps="true"
    android:text="quantity"
    android:textSize="16sp"
    app:layout_constraintLeft_toLeftOf="parent"/>

<TextView
    android:layout_width="wrap_content"
    android:layout_height="wrap_content"
    android:text="0"
    app:layout_constraintBottom_toBottomOf="@id/quantity_text_view"
    app:layout_constraintTop_toTopOf="@id/button_button_view"/>

Answer 1

The preview looks different because you are using:

tools:layout_editor_absoluteY="100dp"
tools:layout_editor_absoluteX="4dp"

which only affect the preview and have no power on the device.

Try this for putting the button below the TextView

<Button
   android:id="@+id/button_button_view"
   android:layout_width="wrap_content"
   android:layout_height="wrap_content"
   app:layout_constraintTop_toBottomOf="@+id/quantity_text_view"
   app:layout_constraintStart_toStartOf="@+id/quantity_text_view"
   .../>