How to set space between 2 views relative to screen width without using margin property in ConstraintLayout

Question

I tried to set a space between two view (horizontal and vertical) like this

<?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=".Fragments.SetProfileFragment">

    <TextView
        android:id="@+id/textView1"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_marginStart="4dp"
        android:layout_marginTop="4dp"
        android:text="Test 1"
        android:textSize="20sp"
        app:layout_constraintStart_toStartOf="parent"
        app:layout_constraintTop_toTopOf="parent" />

    <TextView
        android:id="@+id/textView2"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_marginStart="12dp"
        android:layout_marginTop="4dp"
        android:text="Test 2"
        android:textSize="20sp"
        app:layout_constraintStart_toEndOf="@id/textView1"
        app:layout_constraintTop_toTopOf="parent" />


</androidx.constraintlayout.widget.ConstraintLayout>

But I want the space between the two TextViews to be 1% percent of screen. Is it possible?

Answer 1

but I want to spacing two TextView 1% percent of screen. is it possible?

• For setting the start & top constraint to the parent: Use Horizontal & Vertical Guidelines with percentages of the root ConstraintLayout:

  The 1% is considered as 0.01 as 1% equals to the full screen width >> So, use app:layout_constraintGuide_percent="0.01"

  You can apply the constraints to the textview1, and in order not to repeat yourself, you can constraint textView2 to the BaseLine of textview1.

• For setting the 1% of the screen width between the TextViews: Use Space that is constraint to the end of textView1 with a percentage of 1% of the screen width: app:layout_constraintWidth_percent="0.01". Then constraint the textView2 to the Space, not to textView.

<?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"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    tools:context=".Fragments.SetProfileFragment">

    <androidx.constraintlayout.widget.Guideline
        android:id="@+id/guideline"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:orientation="vertical"
        app:layout_constraintGuide_percent="0.01" />

    <androidx.constraintlayout.widget.Guideline
        android:id="@+id/guideline2"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:orientation="horizontal"
        app:layout_constraintGuide_percent="0.01" />

    <TextView
        android:id="@+id/textView1"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:text="Test 1"
        android:textSize="20sp"
        app:layout_constraintStart_toStartOf="@id/guideline"
        app:layout_constraintTop_toTopOf="@id/guideline2" />

    <Space
        android:id="@+id/space"
        android:layout_width="0dp"
        android:layout_height="match_parent"
        app:layout_constraintStart_toEndOf="@id/textView1"
        app:layout_constraintWidth_percent="0.01" />

    <TextView
        android:id="@+id/textView2"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:text="Test 2"
        android:textSize="20sp"
        app:layout_constraintBaseline_toBaselineOf="@id/textView1"
        app:layout_constraintStart_toEndOf="@id/space"
        app:layout_constraintTop_toTopOf="parent" />


</androidx.constraintlayout.widget.ConstraintLayout>