Android Studio Different Screen Scaling

Question

I was wondering if there was a way to have XML elements scale and position themselves on different screens without using Gravity or match_parent. I have to finish a Udacity Android App and their review told me nothing on. How could I possibly make it scale to other screen sizes? I don't want to use Gravity or match_parent due to it's over complexity for me. I was hoping that there is some way how to scale and position things similar to CSS (width: x%). Here is the code below that I have to make scalable.

<?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:context="com.marbleslab.marbleslabudacity1.MainActivity">

<RelativeLayout
    android:layout_width="410dp"
    android:layout_height="624dp"
    android:background="@drawable/ice_cream"
    tools:layout_constraintTop_creator="1"
    tools:layout_constraintRight_creator="1"
    tools:layout_constraintBottom_creator="1"
    app:layout_constraintBottom_toBottomOf="parent"
    android:layout_marginEnd="8dp"
    app:layout_constraintRight_toRightOf="parent"
    android:layout_marginTop="8dp"
    tools:layout_constraintLeft_creator="1"
    android:layout_marginBottom="8dp"
    app:layout_constraintLeft_toLeftOf="parent"
    app:layout_constraintTop_toTopOf="parent"
    android:layout_marginLeft="8dp"
    android:layout_marginStart="8dp"
    android:layout_marginRight="8dp"
    app:layout_constraintHorizontal_bias="0.533"
    app:layout_constraintVertical_bias="0.513">

<View android:id="@+id/rectangle_at_the_top1"
    android:layout_width="430dp"
    android:layout_height="123dp"
    android:layout_alignParentTop="true"
    android:layout_marginTop="10dp"
    android:background="#BBFFFFFF"
    android:visibility="visible"
    tools:layout_editor_absoluteY="0dp"
    tools:layout_editor_absoluteX="0dp" />

    <View android:id="@+id/rectangle_at_the_top2"
        android:layout_width="430dp"
        android:layout_height="123dp"
        android:layout_alignParentTop="true"
        android:layout_marginTop="490dp"
        android:background="#BBFFFFFF"
        android:visibility="visible"
        tools:layout_editor_absoluteY="0dp"
        tools:layout_editor_absoluteX="0dp" />

    <TextView
        android:layout_width="400dp"
        android:layout_height="wrap_content"
        android:gravity="start"
        android:text="@string/marble_slab_creamery_1"
        android:textSize="20sp"
        android:layout_marginTop="494dp"
        app:layout_constraintLeft_toLeftOf="parent"
        tools:layout_editor_absoluteY="16dp"
        android:layout_alignParentTop="false"
        android:textColor="#333"
        android:id="@+id/textView1"
        android:layout_alignParentRight="true"
        android:layout_alignParentEnd="true" />

    <TextView
        android:layout_width="400dp"
        android:layout_height="wrap_content"
        android:gravity="start"
        android:text="@string/marble_slab_creamery_2"
        android:textSize="16sp"
        android:layout_marginTop="520dp"
        app:layout_constraintLeft_toLeftOf="parent"
        tools:layout_editor_absoluteY="16dp"
        android:layout_alignParentTop="true"
        android:textColor="#333"
        android:id="@+id/textView2"
        android:layout_alignParentRight="true"
        android:layout_alignParentEnd="true" />

    <TextView
        android:layout_width="400dp"
        android:layout_height="wrap_content"
        android:gravity="start"
        android:text="@string/marble_slab_creamery_3"
        android:textSize="19sp"
        android:layout_marginTop="540dp"
        app:layout_constraintLeft_toLeftOf="parent"
        tools:layout_editor_absoluteY="16dp"
        android:layout_alignParentTop="true"
        android:textColor="#333"
        android:id="@+id/textView3"
        android:layout_alignParentRight="true"
        android:layout_alignParentEnd="true" />
    <TextView
        android:layout_width="400dp"
        android:layout_height="wrap_content"
        android:gravity="start"
        android:text="@string/marble_slab_creamery_4"
        android:textSize="13sp"
        android:layout_marginTop="565dp"
        app:layout_constraintLeft_toLeftOf="parent"
        tools:layout_editor_absoluteY="10dp"
        android:layout_alignParentTop="true"
        android:textColor="#333"
        android:id="@+id/textView4"
        android:layout_alignParentRight="true"
        android:layout_alignParentEnd="true" />
    <ImageView
        android:contentDescription="@string/app_name"
        android:layout_marginTop="22dp"
        android:layout_marginLeft="10dp"
        android:layout_marginStart="10dp"
        android:id="@+id/imageView2"
        android:layout_width="100dp"
        android:layout_height="100dp"
        app:srcCompat="@drawable/logo1"
        tools:layout_editor_absoluteY="0dp"
        tools:layout_editor_absoluteX="0dp" />

    <ImageView
        android:contentDescription="@string/app_name"
        android:id="@+id/imageView3"
        android:layout_marginTop="216dp"
        android:layout_width="1000dp"
        android:layout_height="275dp"
        app:srcCompat="@drawable/marbleslab005"
        tools:layout_editor_absoluteY="0dp"
        tools:layout_editor_absoluteX="0dp" />

    <TextView
        android:layout_width="400dp"
        android:layout_height="103dp"
        android:gravity="start"
        android:layout_marginTop="20dp"
        android:text="@string/marble_slab_creamery"
        android:textSize="45sp"
        app:layout_constraintLeft_toLeftOf="parent"
        tools:layout_editor_absoluteY="16dp"
        android:layout_alignParentTop="true"
        android:layout_marginLeft="135dp"
        android:layout_marginStart="135dp"
        android:textColor="#333"
        android:id="@+id/textView"
        android:layout_alignParentRight="true"
        android:layout_alignParentEnd="true" />


</RelativeLayout>

Answer 1

You can use sdp ( Scalable dp), this will help you to set the the layout according to different screen size. which is available here. https://github.com/intuit/sdp

also you can create this on your own.