What's the alternative of layout_above in ConstraintLayout?

Viewed 6937

I've tried app:layout_constraintBottom_toTopOf="@id/the_view_which_will_remain_below" but it's not the desired output. I want the same behavior from RelativeLayout's layout_above.

With this code my Textview starts appearing from the bottom and as the character increases texts goes above. But I want the texts to start from starting of parent.

<?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"
    android:padding="16dp"
    tools:context="com.fatimamostafa.restfulwebservices.asynctask.AsyncTaskRequest">
    <LinearLayout
        android:id="@+id/ll"
        android:layout_width="0dp"
        android:layout_height="wrap_content"
        android:orientation="horizontal"
        android:weightSum="2"
        app:layout_constraintLeft_toLeftOf="parent"
        app:layout_constraintRight_toRightOf="parent"
        app:layout_constraintBottom_toBottomOf="parent">

        <Button
            android:layout_width="0dp"
            android:layout_height="wrap_content"
            android:layout_weight="1"
            android:text="Run" />

        <Button
            android:layout_width="0dp"
            android:layout_height="wrap_content"
            android:layout_weight="1"
            android:text="Clear" />

    </LinearLayout>
    <TextView
        android:layout_width="0dp"
        android:layout_height="wrap_content"
        app:layout_constraintStart_toStartOf="parent"
        app:layout_constraintBottom_toTopOf="@id/ll"
        app:layout_constraintLeft_toLeftOf="parent"
        app:layout_constraintRight_toRightOf="parent"
        android:textSize="160sp"
        android:text="Text"
      />


</android.support.constraint.ConstraintLayout>
2 Answers

To put the text at the top of the parent and the LinearLayout at the bottom contraint the top of the text view to parent and un-constraint it from the the LinearLayout:

<TextView
    android:layout_width="match_parent"
    android:layout_height="wrap_content"
    android:text="Text"
    android:textSize="160sp"

    app:layout_constraintLeft_toLeftOf="parent"
    app:layout_constraintRight_toRightOf="parent"

    app:layout_constraintTop_toTopOf="parent"

     />

<LinearLayout
    android:id="@+id/ll"
    android:layout_width="0dp"
    android:layout_height="wrap_content"
    android:orientation="horizontal"
    android:weightSum="2"
    app:layout_constraintLeft_toLeftOf="parent"
    app:layout_constraintRight_toRightOf="parent"
    app:layout_constraintBottom_toBottomOf="parent"
   >

    <Button
        android:layout_width="0dp"
        android:layout_height="wrap_content"
        android:layout_weight="1"
        android:text="Run" />

    <Button
        android:layout_width="0dp"
        android:layout_height="wrap_content"
        android:layout_weight="1"
        android:text="Clear" />

</LinearLayout>

I have removed some constraints that I think were redundant.

Also note you can put the TextView obove the LinearLayout using "@+id" instead of @id.

If you want to constraint the text floating between the parent top and the Linear layout add these constraints to the TextView, and adjust the vertical bias between 0 and 1.

app:layout_constraintBottom_toTopOf="@+id/ll"
app:layout_constraintVertical_bias="0.2"

You can use height 0dp and organize views vertically.

in relative layout we can use layout below and above like

<FrameLayout
        android:id="@+id/frame_layout"
        android:layout_width="match_parent"
        android:layout_height="match_parent"
        android:layout_above="@+id/bottom_nav"
        android:layout_below="@+id/toolbar"
        />

In constraint layout giving height is compulsory so you can give 0 height. and then you can set your view below other views like this

<android.support.v4.view.ViewPager
    android:layout_width="match_parent"
    android:layout_height="0dp"
    app:layout_constraintBottom_toBottomOf="parent"
    app:layout_constraintEnd_toEndOf="parent"
    app:layout_constraintStart_toStartOf="parent"
    app:layout_constraintTop_toBottomOf="@+id/tablayout" />

you can use constraintTop_toBottomOf and constraintBottom_toTopOf properties to adjust your view to above or below of other. thanks

Related