Home > Software design >  OnItemClick in RecyclerView setting int and String (Image and text)
OnItemClick in RecyclerView setting int and String (Image and text)

Time:08-06

in my application I have a gallery of sorts. It's horizontal scrolling RecyclerView. Here are populated cards and when one is clicked, it should be displayed in larger IV. This works fine. What I want to do now, is when the card is clicked and enlarged, the note for the card (short text) will appear under it in separate TV. In RV, the text is invisible, so only images can be seen. When clicked, image will be shown in larger IV and text should be visible in TV under it. I don't know, how to modify the OnClick method in order for it to work this way. I've been struggling with RV for some time now and I always get stuck on something. The images (cards) are objects from separate class. F.e.:

List<DeckCards> cards = new ArrayList<>();
cards.add(new DeckCards(R.drawable.ash_card, App.getAppResources().getString(R.string.ash_text)));

Here is the layout for a single item in RV. Image and text. The text is invisible.

<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
   android:layout_width="100dp"
   android:layout_height="135dp">
   <ImageView
      android:id="@ id/card"
      android:layout_width="80dp"
      android:layout_height="135dp"
      android:layout_marginStart="10dp"/>
   <TextView
      android:id="@ id/text"
      android:layout_width="80dp"
      android:layout_height="50dp"
      android:layout_marginStart="10dp"
      android:visibility="invisible"/>
</RelativeLayout>

Here is my Adapter class with OnClick listener.

public class CardGalleryAdapter extends RecyclerView.Adapter<CardGalleryAdapter.ViewHolder> {

  List<DeckCards> cards;
  Context context;
private ItemClickListener mClickListener;

public class ViewHolder extends RecyclerView.ViewHolder implements View.OnClickListener {
    private final ImageView card;
    TextView textView;

    public ViewHolder(View view){
        super(view);

        textView = view.findViewById(R.id.text);
        card = view.findViewById(R.id.card);
        view.setOnClickListener(this);

    }

    @Override
    public void onClick(View v) {
        if (mClickListener != null) mClickListener.onItemClick(v, getAbsoluteAdapterPosition());
    }
}

public CardGalleryAdapter(List<DeckCards> cards, Context context) {
    this.cards = cards;
    this.context = context;
}

//Create new Views
@NonNull
@Override
public ViewHolder onCreateViewHolder(@NonNull ViewGroup parent, int viewType) {
    View view = LayoutInflater.from(context)
            .inflate(R.layout.new_item_in_deck, parent, false);
    return new ViewHolder(view);
}

@Override
public void onBindViewHolder(@NonNull ViewHolder holder, int position) {
    Animation animation = AnimationUtils.loadAnimation(holder.itemView.getContext(), android.R.anim.fade_in);
    holder.card.setImageResource(cards.get(position).getCard());
    holder.textView.setText(cards.get(position).getCardText());
    holder.itemView.startAnimation(animation);
}

@Override
public int getItemCount() {
    return cards.size();
}

public int getItem(int id){
    return (cards.get(id).getCard());
}

// allows clicks events to be caught
public void setClickListener(ItemClickListener itemClickListener) {
    this.mClickListener = itemClickListener;
}

// parent activity will implement this method to respond to click events
public interface ItemClickListener {
    void onItemClick(View view, int position);
}

}

And here is the implementation of OnClick in my Fragment:

@Override
public void onItemClick(View view, int position) {
    cardView.setImageResource(cardGalleryAdapter.getItem(position));
    Animation fadeIn = AnimationUtils.loadAnimation(cardView.getContext(), android.R.anim.fade_in);
    cardView.startAnimation(fadeIn);
}

I know it's probabably very easy, but so far I don't see how should I do it. Thanks in advance.

P.S. Also, any tips how to improve my code are welcome, I'm still a rookie.

CodePudding user response:

As per the XML file the TextView(TV) is set to invisible, so in the code inside onClick method you have to set TextView(TV) visible by:

textView.setVisibility(View.VISIBLE);

CodePudding user response:

Modify interface according to what you need.

// parent activity will implement this method to respond to click events
public interface ItemClickListener {
    void onItemClick(View view, int position, String cardText);
}

So onClick() in ViewHolder is:

if (mClickListener != null) mClickListener.onItemClick(v, getAbsoluteAdapterPosition(), cards.get(getAbsoluteAdapterPosition).getCardText());

Finally, onItemClick in Fragment is:

@Override
public void onItemClick(View view, int position, String cardText) {
    cardView.setImageResource(cardGalleryAdapter.getItem(position));
    Animation fadeIn = AnimationUtils.loadAnimation(cardView.getContext(), android.R.anim.fade_in);
    cardView.startAnimation(fadeIn);

    textView.setText(cardText);
}
  • Related