How to Construct a RecyclerView with Children of Variable Height?

Question

The app I am working on contains lots of listviews. In one case, I have a recyclerView that leverages the GridLayoutManager to create a two column view. I haven't worked with recyclerViews yet as far as adapters go but here is the problem I am having. Each item in the view is being sized to the same height despite having the appropriate wrap_content attributes. I guess my question would be, is there a trick to pull this off where each child element has a different height? Is something going on behind the scenes with a recyclerView that causes all children to have a fixed height of the tallest child element? Does this sound like a recycler problem with the view holders?

My adapter logic is as follows

public ClubViewHolder onCreateViewHolder(ViewGroup parent, int viewType) {
    View itemView = LayoutInflater.from(parent.getContext())
            .inflate(R.layout.onboard_club, parent, false);

    return new ClubViewHolder(itemView, mRecyclerClickListener);
}


public void onBindViewHolder(final ClubViewHolder holder, int position) {

    Item club = clubList.get(position);
    if (null != club) {
        holder.clubTitleText.setText(club.getName());
        holder.subtitleText.setText(context.getResources().getString(R.string.club_members,club.getNumberMembers()+""));
        // Do some imageView logic here

    }

}

Do I need to set height in here programmatically?

EDIT: To clarify further, the layout I inflate is the layout in question here. It is a Vertical LinearLayout containing an imageView, and two text views. I need the LinearLayout to wrap the children XML attributes but it currently isn't doing that despite the LL having a height of wrap_content and all children height set to wrap_content as well

SOLUTION: Solution was posted by a user below. I will leave the update here for anyone struggling in the future.

Layout I need: Two columns whose children vary in height
Tie it in with an adapter as you normally would.
Set a StaggeredGridLayoutManager on the recyclerView widget
In the manager constructor pass in a spanCount of 2 and an Orientation of Vertical
Boom, close the sprint ticket and forget about it

Thanks again Stack Community, cheers!

Or you can inflate different layout by `int viewType` with different children layout — Warrocker, May 16 '18 at 15:02
@Warrocker Why would I inflate a different layout though? They are all styled exactly the same just some of them have lines of text that wrap to a new line which pushes the content below it down so I just need the parent container to (LinearLayout in this case) to expand. I have the height of the container set to wrap content — Murph_Fish, May 16 '18 at 15:15

Gotiasits · Accepted Answer · 2018-05-16T15:40:40.867

The best way to control placement and size of item for RecyclerView is through its LayoutManager.

If you're looking for GridView with elements that resize themselves according to the content you can use StaggeredGridLayoutManager

Nice example of Staggered Grid Layout can be found here.

On the other hand if you need just few "groups" of different Items you can inflate different ViewHolders depending on some criteria. Here is the sample code for two types of views.

@Override
public RecyclerView.ViewHolder onCreateViewHolder(ViewGroup parent, int viewType) {

    if (viewType == FILE_FLAG) {
        ViewGroup view = (ViewGroup) LayoutInflater.from(parent.getContext())
                .inflate(R.layout.file_item, parent, false);
        return new FileViewH(view);

    } else if (viewType == DIR_FLAG) {
        ViewGroup view = (ViewGroup) LayoutInflater.from(parent.getContext())
                .inflate(R.layout.dir_item, parent, false);
        return new DirViewH(view);

    }
}

THANK YOU! Worked like a charm. I used the StaggeredGridLayoutManager instead of just the GridLayoutManager. Passed in a span of 2 and an orientation of vertical. I will update my post with the solution. — Murph_Fish, May 16 '18 at 15:40
You're welcome. If you like to expand my answer it would be more in Q&A website paradigm to answer your question with the new answer in contrast to updating the question itself with an answer... — Gotiasits, May 16 '18 at 15:43

How to Construct a RecyclerView with Children of Variable Height?

1 Answers1