Android constraint layout set programmatically is incorrect

Question

So i've been trying to set a constraint layout programmatically. Original layout is this

The layout file

    <?xml version="1.0" encoding="utf-8"?>
<LinearLayout 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"
    android:gravity="center_horizontal"
    android:orientation="vertical"
    android:padding="10dp">

    <androidx.constraintlayout.widget.ConstraintLayout
        android:layout_width="match_parent"
        android:layout_height="0dp"
        android:layout_weight="0.3">

        <androidx.cardview.widget.CardView
            android:layout_width="0dp"
            android:layout_height="0dp"
            app:layout_constraintHeight_default="percent"
            app:layout_constraintHeight_percent="1"
            app:layout_constraintStart_toStartOf="parent"
            app:layout_constraintTop_toTopOf="parent"
            app:layout_constraintWidth_default="percent"
            app:layout_constraintWidth_percent="0.48"
            app:cardCornerRadius="20dp"
            app:cardElevation="10dp">

            <androidx.constraintlayout.widget.ConstraintLayout
                android:id="@+id/card1_layout"
                android:layout_width="match_parent"
                android:layout_height="match_parent"
                android:background="@drawable/up_arrow">

                <TextView
                    android:id="@+id/card1_company"
                    android:layout_width="0dp"
                    android:layout_height="0dp"
                    android:layout_margin="10dp"
                    android:text="CompanyName"
                    android:textColor="@color/black"
                    android:textSize="20sp"
                    app:layout_constraintHeight_default="percent"
                    app:layout_constraintHeight_percent="0.1"
                    app:layout_constraintStart_toStartOf="parent"
                    app:layout_constraintTop_toTopOf="parent"
                    app:layout_constraintWidth_default="percent"
                    app:layout_constraintWidth_percent="0.5" />

                <TextView
                    android:id="@+id/card1_point"
                    android:layout_width="0dp"
                    android:layout_height="0dp"
                    android:layout_margin="10dp"
                    android:text="CompanyPoint"
                    android:textColor="@color/black"
                    app:layout_constraintHeight_default="percent"
                    app:layout_constraintHeight_percent="0.1"
                    app:layout_constraintStart_toStartOf="parent"
                    app:layout_constraintTop_toBottomOf="@id/card1_company"
                    app:layout_constraintWidth_default="percent"
                    app:layout_constraintWidth_percent="0.5" />

                <TextView
                    android:id="@+id/card1_des"
                    android:layout_width="0dp"
                    android:layout_height="0dp"
                    android:layout_margin="10dp"
                    android:text="SOME COMPANY DESCRIPTION"
                    android:textColor="@color/black"
                    app:layout_constraintBottom_toBottomOf="parent"
                    app:layout_constraintEnd_toEndOf="parent"
                    app:layout_constraintHeight_default="wrap"
                    app:layout_constraintWidth_default="percent"
                    app:layout_constraintWidth_percent="0.5"/>

            </androidx.constraintlayout.widget.ConstraintLayout>

        </androidx.cardview.widget.CardView>

        <androidx.cardview.widget.CardView
            android:layout_width="0dp"
            android:layout_height="0dp"
            app:layout_constraintEnd_toEndOf="parent"
            app:layout_constraintHeight_default="percent"
            app:layout_constraintHeight_percent="1"
            app:layout_constraintTop_toTopOf="parent"
            app:layout_constraintWidth_default="percent"
            app:layout_constraintWidth_percent="0.48"
            app:cardCornerRadius="20dp"
            app:cardElevation="10dp">


            <androidx.constraintlayout.widget.ConstraintLayout
                android:id="@+id/card2_layout"
                android:layout_width="match_parent"
                android:layout_height="match_parent"
                android:background="@drawable/up_arrow">

                <TextView
                    android:id="@+id/card2_company"
                    android:layout_width="0dp"
                    android:layout_height="0dp"
                    android:layout_margin="10dp"
                    android:text="CompanyName"
                    android:textColor="@color/black"
                    android:textSize="20sp"
                    app:layout_constraintHeight_default="percent"
                    app:layout_constraintHeight_percent="0.1"
                    app:layout_constraintStart_toStartOf="parent"
                    app:layout_constraintTop_toTopOf="parent"
                    app:layout_constraintWidth_default="percent"
                    app:layout_constraintWidth_percent="0.5" />

                <TextView
                    android:id="@+id/card2_point"
                    android:layout_width="0dp"
                    android:layout_height="0dp"
                    android:layout_margin="10dp"
                    android:text="CompanyPoint"
                    android:textColor="@color/black"
                    app:layout_constraintHeight_default="percent"
                    app:layout_constraintHeight_percent="0.1"
                    app:layout_constraintStart_toStartOf="parent"
                    app:layout_constraintTop_toBottomOf="@id/card2_company"
                    app:layout_constraintWidth_default="percent"
                    app:layout_constraintWidth_percent="0.5" />

                <TextView
                    android:id="@+id/card2_des"
                    android:layout_width="0dp"
                    android:layout_height="0dp"
                    android:layout_margin="10dp"
                    android:text="SOME COMPANY DESCRIPTION"
                    android:textColor="@color/black"
                    app:layout_constraintBottom_toBottomOf="parent"
                    app:layout_constraintEnd_toEndOf="parent"
                    app:layout_constraintHeight_default="wrap"
                    app:layout_constraintWidth_default="percent"
                    app:layout_constraintWidth_percent="0.5" />

            </androidx.constraintlayout.widget.ConstraintLayout>

        </androidx.cardview.widget.CardView>

    </androidx.constraintlayout.widget.ConstraintLayout>

    <View
        android:layout_width="match_parent"
        android:layout_height="0dp"
        android:layout_weight="0.01"/>

    <androidx.constraintlayout.widget.ConstraintLayout
        android:layout_width="match_parent"
        android:layout_height="0dp"
        android:layout_weight="0.3">

        <androidx.cardview.widget.CardView
            android:layout_width="0dp"
            android:layout_height="0dp"
            app:layout_constraintStart_toStartOf="parent"
            app:layout_constraintHeight_default="percent"
            app:layout_constraintHeight_percent="1"
            app:layout_constraintTop_toTopOf="parent"
            app:layout_constraintWidth_default="percent"
            app:layout_constraintWidth_percent="0.48"
            app:cardCornerRadius="20dp"
            app:cardElevation="10dp">

            <androidx.constraintlayout.widget.ConstraintLayout
                android:id="@+id/card3_layout"
                android:layout_width="match_parent"
                android:layout_height="match_parent"
                android:background="@drawable/down_arrow">

                <TextView
                    android:id="@+id/card3_company"
                    android:layout_width="0dp"
                    android:layout_height="0dp"
                    android:layout_margin="10dp"
                    android:text="CompanyName"
                    android:textColor="@color/black"
                    android:textSize="20sp"
                    app:layout_constraintHeight_default="percent"
                    app:layout_constraintHeight_percent="0.1"
                    app:layout_constraintEnd_toEndOf="parent"
                    app:layout_constraintTop_toTopOf="parent"
                    app:layout_constraintWidth_default="percent"
                    app:layout_constraintWidth_percent="0.5" />

                <TextView
                    android:id="@+id/card3_point"
                    android:layout_width="0dp"
                    android:layout_height="0dp"
                    android:layout_margin="10dp"
                    android:text="CompanyPoint"
                    android:textColor="@color/black"
                    app:layout_constraintHeight_default="percent"
                    app:layout_constraintHeight_percent="0.1"
                    app:layout_constraintEnd_toEndOf="parent"
                    app:layout_constraintTop_toBottomOf="@id/card3_company"
                    app:layout_constraintWidth_default="percent"
                    app:layout_constraintWidth_percent="0.5" />

                <TextView
                    android:id="@+id/card3_des"
                    android:layout_width="0dp"
                    android:layout_height="0dp"
                    android:layout_margin="10dp"
                    android:text="SOME COMPANY DESCRIPTION"
                    android:textColor="@color/black"
                    app:layout_constraintBottom_toBottomOf="parent"
                    app:layout_constraintStart_toStartOf="parent"
                    app:layout_constraintHeight_default="wrap"
                    app:layout_constraintWidth_default="percent"
                    app:layout_constraintWidth_percent="0.5" />

            </androidx.constraintlayout.widget.ConstraintLayout>

        </androidx.cardview.widget.CardView>

        <androidx.cardview.widget.CardView
            android:layout_width="0dp"
            android:layout_height="0dp"
            app:layout_constraintEnd_toEndOf="parent"
            app:layout_constraintHeight_default="percent"
            app:layout_constraintHeight_percent="1"
            app:layout_constraintTop_toTopOf="parent"
            app:layout_constraintWidth_default="percent"
            app:layout_constraintWidth_percent="0.48"
            app:cardCornerRadius="20dp"
            app:cardElevation="10dp">


            <androidx.constraintlayout.widget.ConstraintLayout
                android:id="@+id/card4_layout"
                android:layout_width="match_parent"
                android:layout_height="match_parent"
                android:background="@drawable/down_arrow">

                <TextView
                    android:id="@+id/card4_company"
                    android:layout_width="0dp"
                    android:layout_height="0dp"
                    android:layout_margin="10dp"
                    android:text="CompanyName"
                    android:textColor="@color/black"
                    android:textSize="20sp"
                    app:layout_constraintHeight_default="percent"
                    app:layout_constraintHeight_percent="0.1"
                    app:layout_constraintEnd_toEndOf="parent"
                    app:layout_constraintTop_toTopOf="parent"
                    app:layout_constraintWidth_default="percent"
                    app:layout_constraintWidth_percent="0.5" />

                <TextView
                    android:id="@+id/card4_point"
                    android:layout_width="0dp"
                    android:layout_height="0dp"
                    android:layout_margin="10dp"
                    android:text="CompanyPoint"
                    android:textColor="@color/black"
                    app:layout_constraintHeight_default="percent"
                    app:layout_constraintHeight_percent="0.1"
                    app:layout_constraintEnd_toEndOf="parent"
                    app:layout_constraintTop_toBottomOf="@id/card4_company"
                    app:layout_constraintWidth_default="percent"
                    app:layout_constraintWidth_percent="0.5" />

                <TextView
                    android:id="@+id/card4_des"
                    android:layout_width="0dp"
                    android:layout_height="0dp"
                    android:layout_margin="10dp"
                    android:text="SOME COMPANY DESCRIPTION"
                    android:textColor="@color/black"
                    app:layout_constraintBottom_toBottomOf="parent"
                    app:layout_constraintStart_toStartOf="parent"
                    app:layout_constraintHeight_default="wrap"
                    app:layout_constraintWidth_default="percent"
                    app:layout_constraintWidth_percent="0.5" />

            </androidx.constraintlayout.widget.ConstraintLayout>

        </androidx.cardview.widget.CardView>

    </androidx.constraintlayout.widget.ConstraintLayout>

    <View
        android:layout_width="match_parent"
        android:layout_height="0dp"
        android:layout_weight="0.01"/>


    <androidx.constraintlayout.widget.ConstraintLayout
        android:layout_width="match_parent"
        android:layout_height="0dp"
        android:layout_weight="0.3">

        <androidx.cardview.widget.CardView
            android:layout_width="0dp"
            android:layout_height="0dp"
            app:layout_constraintHeight_default="percent"
            app:layout_constraintHeight_percent="1"
            app:layout_constraintStart_toStartOf="parent"
            app:layout_constraintTop_toTopOf="parent"
            app:layout_constraintWidth_default="percent"
            app:layout_constraintWidth_percent="0.48"
            app:cardCornerRadius="20dp"
            app:cardElevation="10dp">

            <androidx.constraintlayout.widget.ConstraintLayout
                android:id="@+id/card5_layout"
                android:layout_width="match_parent"
                android:layout_height="match_parent"
                android:background="@drawable/up_arrow">

                <TextView
                    android:id="@+id/card5_company"
                    android:layout_width="0dp"
                    android:layout_height="0dp"
                    android:layout_margin="10dp"
                    android:text="CompanyName"
                    android:textColor="@color/black"
                    android:textSize="20sp"
                    app:layout_constraintHeight_default="percent"
                    app:layout_constraintHeight_percent="0.1"
                    app:layout_constraintStart_toStartOf="parent"
                    app:layout_constraintTop_toTopOf="parent"
                    app:layout_constraintWidth_default="percent"
                    app:layout_constraintWidth_percent="0.5" />

                <TextView
                    android:id="@+id/card5_point"
                    android:layout_width="0dp"
                    android:layout_height="0dp"
                    android:layout_margin="10dp"
                    android:text="CompanyPoint"
                    android:textColor="@color/black"
                    app:layout_constraintHeight_default="percent"
                    app:layout_constraintHeight_percent="0.1"
                    app:layout_constraintStart_toStartOf="parent"
                    app:layout_constraintTop_toBottomOf="@id/card5_company"
                    app:layout_constraintWidth_default="percent"
                    app:layout_constraintWidth_percent="0.5" />

                <TextView
                    android:id="@+id/card5_des"
                    android:layout_width="0dp"
                    android:layout_height="0dp"
                    android:layout_margin="10dp"
                    android:text="SOME COMPANY DESCRIPTION"
                    android:textColor="@color/black"
                    app:layout_constraintBottom_toBottomOf="parent"
                    app:layout_constraintEnd_toEndOf="parent"
                    app:layout_constraintHeight_default="wrap"
                    app:layout_constraintWidth_default="percent"
                    app:layout_constraintWidth_percent="0.5"/>

            </androidx.constraintlayout.widget.ConstraintLayout>

        </androidx.cardview.widget.CardView>

        <androidx.cardview.widget.CardView
            android:layout_width="0dp"
            android:layout_height="0dp"
            app:layout_constraintEnd_toEndOf="parent"
            app:layout_constraintHeight_default="percent"
            app:layout_constraintHeight_percent="1"
            app:layout_constraintTop_toTopOf="parent"
            app:layout_constraintWidth_default="percent"
            app:layout_constraintWidth_percent="0.48"
            app:cardCornerRadius="20dp"
            app:cardElevation="10dp">


            <androidx.constraintlayout.widget.ConstraintLayout
                android:id="@+id/card6_layout"
                android:layout_width="match_parent"
                android:layout_height="match_parent"
                android:background="@drawable/down_arrow">

                <TextView
                    android:id="@+id/card6_company"
                    android:layout_width="0dp"
                    android:layout_height="0dp"
                    android:layout_margin="10dp"
                    android:text="CompanyName"
                    android:textColor="@color/black"
                    android:textSize="20sp"
                    app:layout_constraintHeight_default="percent"
                    app:layout_constraintHeight_percent="0.1"
                    app:layout_constraintEnd_toEndOf="parent"
                    app:layout_constraintTop_toTopOf="parent"
                    app:layout_constraintWidth_default="percent"
                    app:layout_constraintWidth_percent="0.5" />

                <TextView
                    android:id="@+id/card6_point"
                    android:layout_width="0dp"
                    android:layout_height="0dp"
                    android:layout_margin="10dp"
                    android:text="CompanyPoint"
                    android:textColor="@color/black"
                    app:layout_constraintHeight_default="percent"
                    app:layout_constraintHeight_percent="0.1"
                    app:layout_constraintEnd_toEndOf="parent"
                    app:layout_constraintTop_toBottomOf="@id/card6_company"
                    app:layout_constraintWidth_default="percent"
                    app:layout_constraintWidth_percent="0.5" />

                <TextView
                    android:id="@+id/card6_des"
                    android:layout_width="0dp"
                    android:layout_height="0dp"
                    android:layout_margin="10dp"
                    android:text="SOME COMPANY DESCRIPTION"
                    android:textColor="@color/black"
                    app:layout_constraintBottom_toBottomOf="parent"
                    app:layout_constraintStart_toStartOf="parent"
                    app:layout_constraintHeight_default="wrap"
                    app:layout_constraintWidth_default="percent"
                    app:layout_constraintWidth_percent="0.5" />

            </androidx.constraintlayout.widget.ConstraintLayout>

        </androidx.cardview.widget.CardView>

    </androidx.constraintlayout.widget.ConstraintLayout>

</LinearLayout>

So depending upon the company point, the layout is set. If the points are in negative, the company name and points text are set to the end of the parent and description to the start, as shown in picture, and if the points are positive, vice versa.

But when i set it programmatically, the text is set weirdly for some of the layout where the changes are made, for eg look at the next picture which is set programmatically

If the layout is changed then some text has idented their position closer to center E.g Notice the difference in identation in second pic, vertically second layout and third layout. Third layout didnt have to be changed so its position was same as the 1st pic which is not set programmatically. However the second layout is idented because it was changed programatically

Code to set layout programmatically

if(arrayList.get(0).getPoints() < 0){
        constraintLayout1.setBackgroundResource(R.drawable.down_arrow);
        company1Name.setGravity(Gravity.END);
        company1point.setGravity(Gravity.END);
        ConstraintLayout.LayoutParams params = (ConstraintLayout.LayoutParams) company1Name.getLayoutParams();
        params.endToEnd = ConstraintLayout.LayoutParams.PARENT_ID;
        params = (ConstraintLayout.LayoutParams) company1point.getLayoutParams();
        params.endToEnd = ConstraintLayout.LayoutParams.PARENT_ID;
        params = (ConstraintLayout.LayoutParams) company1desc.getLayoutParams();
        params.startToStart = ConstraintLayout.LayoutParams.PARENT_ID;
    }else{
        constraintLayout1.setBackgroundResource(R.drawable.up_arrow);
        company1desc.setGravity(Gravity.END);
        ConstraintLayout.LayoutParams params = (ConstraintLayout.LayoutParams) company1Name.getLayoutParams();
        params.startToStart = ConstraintLayout.LayoutParams.PARENT_ID;
        params = (ConstraintLayout.LayoutParams) company1point.getLayoutParams();
        params.startToStart = ConstraintLayout.LayoutParams.PARENT_ID;
        params = (ConstraintLayout.LayoutParams) company1desc.getLayoutParams();
        params.endToEnd = ConstraintLayout.LayoutParams.PARENT_ID;
    }

How to solve this issue?

It looks like a gravity issue. Try to call company1Name.setGravity(Gravity.START); company1point.setGravity(Gravity.START); in the else section. — gioravered, Sep 30 '21 at 07:51
I've even tried changing gravity in the above code, even after that its showing that weird layout. — Aagam Shah, Sep 30 '21 at 08:03
You are only changing it to END. Have you tried setting it to START inside the else section? — gioravered, Sep 30 '21 at 08:19
So check out the first layout, it has negative points so the textviews must be set at the end. But even at end it is idented away from the end of the parent, check the difference of negative layout in first pic and the second pic — Aagam Shah, Sep 30 '21 at 08:26

score 1 · Accepted Answer · answered Sep 30 '21 at 12:40

It looks like you are setting an additional constraint to the views but not removing the original constraint. In other words, you are setting a begin and end constraint to the views which will center the views between the constraints. I don't think that gravity has any bearing.

If you need to shift a view to the right, remove the left constraint and set the right. If you are shifting a view to the left, set the left constraint and remove the right. You can also consider setting both constraints for a view and using horizontal bias to shift it to the left or right. This may be the simpler way to go.

You may be able to remove a constraint with the params by setting it to View.NO_ID, but I am not 100% sure about that. I think that it would be better to use ConstraintSet. Also, see here for an example of usage.

This worked. Thank you so much :) – Aagam Shah Oct 01 '21 at 06:32 — Aagam Shah, Oct 01 '21 at 06:32

Android constraint layout set programmatically is incorrect

1 Answers1