Recyclerview : how to mix some post with image and no image?

Question

I want to display in same recycle-view which is some post have image and some post does not have images.

I can retrieve all the post with image and non-image, but i want to change the size of the post when the user only post text(no image).

I expect the output like twitter feed..some post with image and without image have their own size.

You can show one image view when there is no image you can hide it else show — Googlian, Apr 02 '19 at 04:47
You Can set Visibility to Gone or Visible for the Imageview depending on the condition. — Rahul Agrawal, Apr 02 '19 at 04:58
What you want to do is to create an adapter with multiple view types. Possible duplication of: https://stackoverflow.com/questions/26245139/how-to-create-recyclerview-with-multiple-view-type — RadekJ, Apr 02 '19 at 04:58
I would suggest to use default image which will override if no image is available. — Arbaz Alam, Apr 02 '19 at 05:57
https://stackoverflow.com/questions/26245139/how-to-create-recyclerview-with-multiple-view-type/51153083#51153083 — Rohit Singh, Apr 02 '19 at 06:15

score 3 · Accepted Answer · edited Apr 02 '19 at 06:40

Simple way to achieve this scenario is, All you have to do is create a view with both image and text, in recycler adapter check if image data is available make visibility of image visible else Image visibility gone.

Second Approach for this to make multiple view for RecyclerView.

 @Override
 public void onBindViewHolder(ViewHolder holder, int position) {

        Log.d(TAG, "onBindViewHolder called");        
        ContentItem item = mContentItems.get(position);

        if(item.getName()!=null){
             holder.textName.setVisibility(View.Visible);
             holder.textName.setText(item.getName());        
        }else{
             holder.textName.setVisibility(View.GONE);
        }

       if(item.getPreviewImageDefault()!=null){
             holder.imageIcon.setVisibility(View.Visible)        
             Picasso.with(mContext).load("file://" + item.getPreviewImageDefault()).into(holder.imageIcon);  
       }else{
             holder.imageIcon.setVisibility(View.GONE)
       }
 }

score 1 · Answer 2 · answered Apr 02 '19 at 05:45

1

Another possible solution is create 2 xml layouts and use ViewType in your RecyclerView.

look this How to create RecyclerView with multiple view type?

answered Apr 02 '19 at 05:45

Scrobot

1,683
2
15
32

score 1 · Answer 3 · edited Apr 02 '19 at 07:12

If you want to hide the image when it is ic_launcher you could do that (suppposing that data.getImage() returns the id of the drawable as integer):

@Override
public void onBindViewHolder(ViewHolder viewHolder, int i) {

   if(mItems!=null){
      AdapterData data = mItems.get(i);
      viewHolder.text.setText(data.getText());
      viewHolder.image.setImageResource(data.getImage());

      if(TextUtils.isEmpty(data.getText())){
         viewHolder.text.setVisibility(View.GONE);
      }else{
         viewHolder.text.setVisibility(View.VISIBLE);
      }

      if(data.getImage()==R.drawable.ic_launcher){
         viewHolder.image.setVisibility(View.GONE);
      }else{
         viewHolder.image.setVisibility(View.VISIBLE);
      }
  }

}

score 0 · Answer 4 · answered Apr 02 '19 at 05:39

One possible solution, like some people have already said, is to hide/show the ImageView.

You could do that in the ViewHolder that you use for your RecyclerView.

class OptionalImageViewHolder extends RecyclerView.ViewHolder {
    private ImageView image;
    private TextView text;
    // any other views you have

    public OptionalImageViewHolder(View itemView) {
        super(itemView);
        image = itemView.findViewById(R.id.yourImageViewIdHere);
        text = itemView.findViewById(R.id.yourTextViewIdHere);
        // same for any other views you have
    }

    public void bindView(Tweet tweet) {
        // This is where the magic happens
        // Note: I make the assumption that you have a class called "Tweet"
        // that has a field for "text", a field for "image" (that can be
        // null if there's no image), and any other necessary fields.

        text.setText(tweet.getTweetText());
        if (tweet.hasImage() /* function that returns whether or not there is an image */) {
            image.setVisibility(View.VISIBLE);
            image.setImageBitmap(tweet.getImage()); // or however you are setting the image
        } else {
            // else just make the image invisible
            image.setVisibility(View.GONE);
        }
    }
}

Hopefully this gives you an idea.

score 0 · Answer 5 · answered Apr 02 '19 at 05:53

RecyclerView supports different viewTypes (layouts) which is the proper way in such scenario. E.g.,

class MyAdapter : RecyclerView.Adapter<MyViewHolder>() {

  override fun getViewTypes(position:Int) =
    if (mydata[position].hasImage) return R.layout.mylayout_with_image
    else R.layout.mylayout_no_image;

  override fun onCreateViewHolder(viewType:Int, parent:ViewGroup) : MyViewHolder =
    // here viewType = layout id
    MyViewHolder(layoutInflater.inflate(viewType, parent))

  override fun onBindViewHolder(viewHolder:MyViewHolder, position:Int) {
    // guaranteed viewHolder.itemView is the view you want for that position
  }

}

`(mydata[position].hasImage)` i have user image and post image.. — Baharun Abu Samah, Apr 02 '19 at 10:03

Recyclerview : how to mix some post with image and no image?

5 Answers5