Android custom ConstraintLayout cannot update child height when ConstraintLayout height change

Question

i have create a custom view is expending ConstraintLayout and then add four view as border. When i update the child item height in Activity xml, the four view cannot update the height in spite of i already set the view constraint top, start, end and bottom to parent.

But, if i set the four view to activity xml, not in custom view. It can update height when the parent view height update.

Thanks you for your help.

The below is the code:

Custom view

class StoryComponentFrame @JvmOverloads constructor(
context: Context,
attrs: AttributeSet? = null,
defStyleAttr: Int = 0

) : ConstraintLayout(context, attrs, defStyleAttr) {

init {

  LayoutInflater.from(context).inflate(R.layout.layout_story_component_frame, this, true)

    attrs?.let { it ->
        val typedArray = context.obtainStyledAttributes(
            it,
            R.styleable.StoryComponentFrame,
            0,
            0
        )

        typedArray.recycle()
    }
}

}

Custom view xml

<?xml version="1.0" encoding="utf-8"?>

<androidx.constraintlayout.widget.ConstraintLayout
    android:layout_width="match_parent"
    android:layout_height="wrap_content">

    <View
        android:id="@+id/v_line_start"
        android:layout_width="2dp"
        android:layout_height="0dp"
        app:layout_constraintTop_toTopOf="parent"
        app:layout_constraintBottom_toBottomOf="parent"
        app:layout_constraintStart_toStartOf="parent"
        android:background="@color/color_f05a32" />

    <View
        android:id="@+id/v_line_end"
        android:layout_width="2dp"
        android:layout_height="0dp"
        app:layout_constraintTop_toTopOf="parent"
        app:layout_constraintBottom_toBottomOf="parent"
        app:layout_constraintEnd_toEndOf="parent"
        android:background="@color/color_f05a32" />

    <View
        android:id="@+id/v_line_top"
        android:layout_width="0dp"
        android:layout_height="2dp"
        app:layout_constraintStart_toStartOf="parent"
        app:layout_constraintEnd_toEndOf="parent"
        app:layout_constraintTop_toTopOf="parent"
        android:background="@color/color_f05a32" />

    <View
        android:id="@+id/v_line_bottom"
        android:layout_width="0dp"
        android:layout_height="2dp"
        app:layout_constraintStart_toStartOf="parent"
        app:layout_constraintEnd_toEndOf="parent"
        app:layout_constraintBottom_toBottomOf="parent"
        android:background="@color/color_f05a32" />

    <ImageView
        android:id="@+id/iv_delete"
        android:layout_width="30dp"
        android:layout_height="30dp"
        android:layout_margin="20dp"
        android:src="@drawable/ic_delete_orange_30"
        app:layout_constraintBottom_toBottomOf="parent"
        app:layout_constraintEnd_toEndOf="parent"
        app:layout_constraintTop_toTopOf="parent"
        app:layout_constraintVertical_bias="0.0" />

</androidx.constraintlayout.widget.ConstraintLayout>

Activity

<?xml version="1.0" encoding="utf-8"?>

<data>

    <import type="android.view.View" />

    <variable
        name="positionOfGrid"
        type="Integer" />

    <variable
        name="isSelectView"
        type="Boolean" />

</data>


<LinearLayout
    android:id="@+id/llt_main"
    style="@style/lltMainComponent">

    <com.foodmarco.resapp.view.component.StoryComponentFrame
        android:layout_width="match_parent"
        android:layout_height="match_parent"
        app:story_component_frame_is_show_frame="true">

        <EditText
            android:id="@+id/ed"
            android:layout_width="match_parent"
            android:layout_height="wrap_content"
            android:text="sasassasas\nsasa\nsa\nsaasas\nsasas"
            app:layout_constraintBottom_toBottomOf="parent"
            app:layout_constraintEnd_toEndOf="parent"
            app:layout_constraintStart_toStartOf="parent"
            app:layout_constraintTop_toTopOf="parent" />

    </com.foodmarco.resapp.view.component.StoryComponentFrame>

</LinearLayout>

In the Activity, when the edit text content update, the view four border not update height.

enter image description here

snachmsm · Accepted Answer · 2020-11-30T07:37:18.977

problem is that you are not building ConstraintLayout with four border Views (and icon), you are building ConstraintLayout, which have yet another ConstraintLayout, and inside it four Views

inflate (with last param set true) is adding automatically whole inflated View. you are calling this method inside extended ConstraintLayout (named StoryComponentFrame), so basicly you are adding next freshly inflated ConstraintLayout (with all childrens) to first one

get familiar with <merge and <include tags in HERE and exchange your root ConstraintLayout in XML to <merge xmlns:android="http://schemas.android.com/apk/res/android"> - only Views/childs will be inflated and added to StoryComponentFrame

btw. adding one View for every edge just for border is very unefficient... consider using Drawable with border (stroke), like in HERE

Thank you for help. I use the merge tag to solve my problem. I use four view as border because i need the border can cover another child view. If i use drawable as border background of parent view, it cannot cover another view. However, thank you. — yso, Nov 30 '20 at 07:36

Android custom ConstraintLayout cannot update child height when ConstraintLayout height change

1 Answers1