How to manage width of a custom view with layout using ConstraintLayout?

Calamity :

I have a fragment and I'm using an accordion view in it, which I downloaded form GitHub - https://github.com/riyagayasen/Android_accordion_view, and in its body (which is a RelativeLayout) I need a custom view named AccordionItem like the second one on the pic, which I simply made in fragment's xml: https://pp.userapi.com/c846123/v846123865/1d925d/CaEhr8uSLFA.jpg
But my custom view (the first one) has a wrap_content width behavior for some reason.

The code follows:

Here is the body of an AccordionView in my fragment's xml

<android.support.constraint.ConstraintLayout
                android:layout_width="match_parent"
                android:layout_height="wrap_content">

<!-- This is my custom view -->
<!-- Notice that the width is set to match_constraint -->

                <com.app.myapp.views.AccordionItem
                    android:id="@+id/item"
                    android:layout_width="0dp"
                    android:layout_height="wrap_content"
                    android:layout_marginStart="8dp"
                    app:isStarred="true"
                    app:layout_constraintEnd_toEndOf="parent"
                    app:layout_constraintStart_toStartOf="parent"
                    app:layout_constraintTop_toTopOf="parent"
                    app:title="Another title" />

<!-- This is an example of how my view should look like -->

                <android.support.constraint.ConstraintLayout
                    android:layout_width="match_parent"
                    android:layout_height="wrap_content"
                    android:layout_marginStart="8dp"
                    android:layout_marginTop="8dp"
                    android:background="@drawable/accordion_item"
                    app:layout_constraintStart_toStartOf="parent"
                    app:layout_constraintTop_toBottomOf="@+id/item">

                    <CheckBox
                        android:id="@+id/favourite_checkBox"
                        android:layout_width="wrap_content"
                        android:layout_height="wrap_content"
                        android:layout_marginEnd="8dp"
                        android:button="@drawable/star_checkbox"
                        app:layout_constraintBottom_toBottomOf="parent"
                        app:layout_constraintEnd_toEndOf="parent"
                        app:layout_constraintTop_toTopOf="parent" />

                    <ImageView
                        android:id="@+id/imageView2"
                        android:layout_width="wrap_content"
                        android:layout_height="wrap_content"
                        android:layout_marginStart="8dp"
                        android:layout_marginTop="8dp"
                        android:layout_marginBottom="8dp"
                        app:layout_constraintBottom_toBottomOf="parent"
                        app:layout_constraintStart_toStartOf="parent"
                        app:layout_constraintTop_toTopOf="parent"
                        app:srcCompat="@drawable/ic_t" />

                    <TextView
                        android:layout_width="wrap_content"
                        android:layout_height="wrap_content"
                        android:layout_marginStart="8dp"
                        android:text="Title"
                        android:textSize="18sp"
                        app:layout_constraintBottom_toBottomOf="@+id/imageView2"
                        app:layout_constraintStart_toEndOf="@+id/imageView2"
                        app:layout_constraintTop_toTopOf="@+id/imageView2" />

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

The xml of the custom view:

<?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"
    android:layout_width="match_parent"
    android:layout_height="wrap_content"
    android:background="@drawable/accordion_item">

    <CheckBox
        android:id="@+id/favourite_checkBox"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_marginStart="8dp"
        android:layout_marginEnd="8dp"
        android:button="@drawable/star_checkbox"
        app:layout_constraintBottom_toBottomOf="parent"
        app:layout_constraintEnd_toEndOf="parent"
        app:layout_constraintHorizontal_bias="1.0"
        app:layout_constraintStart_toEndOf="@+id/title"
        app:layout_constraintTop_toTopOf="parent" />

    <ImageView
        android:id="@+id/item_icon"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_marginStart="8dp"
        android:layout_marginTop="8dp"
        android:layout_marginBottom="8dp"
        app:layout_constraintBottom_toBottomOf="parent"
        app:layout_constraintStart_toStartOf="parent"
        app:layout_constraintTop_toTopOf="parent"
        app:srcCompat="@drawable/ic_t" />

    <TextView
        android:id="@+id/title"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_marginStart="8dp"
        android:text="Title"
        android:textSize="18sp"
        app:layout_constraintBottom_toBottomOf="@+id/item_icon"
        app:layout_constraintStart_toEndOf="@+id/item_icon"
        app:layout_constraintTop_toTopOf="@+id/item_icon" />

</android.support.constraint.ConstraintLayout>

Java class of the custom view:

public class AccordionItem extends ConstraintLayout {

    private String titleString;
    private TextView title;
    private boolean isStarred;

    public AccordionItem(Context context) {
        super(context);
        initView();
    }

    public AccordionItem(Context context, AttributeSet attrs) {
        super(context, attrs);

        TypedArray a = context.getTheme().obtainStyledAttributes(
                attrs,
                R.styleable.AccordionItem,
                0, 0);

        try {
            titleString = a.getString(R.styleable.AccordionItem_title);
            isStarred = a.getBoolean(R.styleable.AccordionItem_isStarred, false);
        } finally {
            a.recycle();
        }
        initView();
    }

    private void initView() {
        View view = inflate(getContext(), R.layout.accordion_item, null);
        addView(view);
    }

    public void setTitleString(String titleString) {
        this.titleString = titleString;
        invalidate();
        requestLayout();
    }

    public String getTitleString() {
        return titleString;
    }

    public void setStarred(boolean starred) {
        this.isStarred = starred;
        invalidate();
        requestLayout();
    }

    public boolean isStarred() {
        return isStarred;
    }
}

And finally the attributes of my view:

<declare-styleable name="AccordionItem">
    <attr name="title" format="string"/>
    <attr name="isStarred" format="boolean"/>
    <attr name="background_drawable" format="reference"/>
</declare-styleable>

I expect my view to take the whole width it is given, but it shrinks instead. Am I using the wrong way of creating views, or the wrong layout that my view extends? Thank you.

fancyjyl :

inflate method with no parent will lost layoutParams(height,width)

private void initView() {
    inflate(getContext(), R.layout.accordion_item, this);
    // or
    // View view = LayoutInflater.from(getContext()).inflate(R.layout.accordion_item, this, false);
    // addView(view);
}

Guess you like

Origin http://43.154.161.224:23101/article/api/json?id=158410&siteId=1