How to Correctly Extend LinearLayout to Create a Custom View

Question

I have some "card", which is a simple LinearLayout with a TextView inside

<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:card="http://schemas.android.com/apk/res-auto"
    android:layout_width="fill_parent"
    android:layout_height="wrap_content"
>
 <TextView
        android:id="@+id/card_label_txt"
        android:layout_width="wrap_content"
        android:text="label" />
</LinearLayout>

then I have my Main Fragment with a vertical LinearLayout.. and in this main fragment I add this "cards" to the main layout:

# main fragment layout
View view = inflater.inflate(R.layout.main_activity, null);
LinearLayout ll = (LinearLayout) view
                .findViewById(R.id.main_activity_ll);
# get card
View card = inflater.inflate(R.layout.card, null);

# add to fragment layout
ll.addView(card);

this works very good AND my card fills the whole width of fragment layout. Actually what I am expecting.

Now I created a separate Class for my Card:

Class Card extends LinearLayout{

public Card(Context context) {
        super(context);

        View view =  LayoutInflater.from(getContext()).inflate(
                R.layout.card, null);

        this.addView(view);

    }
}

And, then if I add my card to the main fragment layout in the way:

# main fragment layout
View view = inflater.inflate(R.layout.main_activity, null);
LinearLayout ll = (LinearLayout) view
                .findViewById(R.id.main_activity_ll);

# add new Card to fragment layout
ll.addView(new Card(getActivity());

then it is added BUT the width of the card is no more filled, but wraped to the textview.

Could someone please explain me why I get different width sizes by this two method of adding same layouts?

Solution here is changed Card class that solves this issue:

public Card(Context context) {
       super(context);

       LayoutInflater.from(getContext()).inflate(
                R.layout.card, this);
    }
}

Answer 1

That isn't the correct way to implement a custom View class. In your implementation of the Card class, you're actually creating an additional LinearLayout that is not needed.

First, implement your Card class that extends LinearLayout. Then, reference it in your XML layout like such:

<com.mypackagename.Card xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:card="http://schemas.android.com/apk/res-auto"
    android:layout_width="fill_parent"
    android:layout_height="wrap_content" >
 <TextView
        android:id="@+id/card_label_txt"
        android:layout_width="wrap_content"
        android:text="label" />
</com.mypackagename.Card>

Here's a good tutorial on creating custom views in android.