0

I created a RecyclerView with two columns using StaggeredGridLayoutManager, every item contain 2 images and text, the size for the first image can be (284*572 , 840*401 or 283*232) the second 35*35 and a text, the list looking great but the problem is that when the user scroll down the scrolling is not smooth and not continuous, the images are taking from the local storage (drawable), what can we do for approving the scrolling experience.

FantasyTabAdpter.java

public class FantasyTabAdapter extends RecyclerView.Adapter<FantasyTabAdapter.MyViewHolder> {
    private LayoutInflater inflater;
    private ArrayList<Fantasy> fantasies;

    public FantasyTabAdapter(Context context, ArrayList<Fantasy> fantasies) {
        inflater = LayoutInflater.from(context);
        this.fantasies = fantasies;
    }

    @Override
    public MyViewHolder onCreateViewHolder(ViewGroup parent, int viewType) {
        View view = inflater.inflate(R.layout.fantasy_tab_item, parent, false);
        MyViewHolder holder = new MyViewHolder(view);
        return holder;
    }

    @Override
    public void onBindViewHolder(final MyViewHolder holder, int position) {
        final Fantasy fantasy = fantasies.get(position);
        holder.setData(fantasy, position);
    }

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

    class MyViewHolder extends RecyclerView.ViewHolder{
        ImageView fantasyImage;
        TextView fantasyTitle;
        ImageView fantasyStatus;

        public MyViewHolder(View itemView) {
            super(itemView);
            fantasyImage = (ImageView) itemView.findViewById(R.id.fantasy_tab_image);
            fantasyTitle = (TextView) itemView.findViewById(R.id.fantasy_tab_title);
            fantasyStatus = (ImageView) itemView.findViewById(R.id.fantasy_tab_status);
        }

        public void setData(Fantasy fantasy, int position) {
            this.fantasyTitle.setText(fantasy.getFantasyHeader());
            this.fantasyImage.setImageResource(fantasy.getFantasyHeaderImageID());
            this.fantasyStatus.setImageDrawable(fantasy.statusImagePlsgod);
        }
    }
}

Setting the RecyclerView in a Fragment

RecyclerView myRecyclerView = (RecyclerView) rootView.findViewById(R.id.my_recycler_view);

StaggeredGridLayoutManager setLayoutManager = new StaggeredGridLayoutManager(2, StaggeredGridLayoutManager.VERTICAL);
FantasyTabAdapter fantasyTabAdapter = new FantasyTabAdapter(getActivity(),fantasies);

myRecyclerView.setLayoutManager(setLayoutManager);
myRecyclerView.setAdapter(fantasyTabAdapter);
Chris Stillwell
  • 10,266
  • 10
  • 67
  • 77
user1684140
  • 444
  • 6
  • 18
  • Fantasy is an object containing information about fantasy movie, from there we are getting the id of the images and the text – user1684140 Apr 01 '16 at 05:10

1 Answers1

2

You can cache your images to improve performance. first watch these two videos:

Caching UI data

The Magic of LRU Cache

then after understanding the reason and the idea on how to solve it you can use image libraries like:

Glide

picasso

those implement caching strategy so all you need is import one of them and use it for example instead of:

 this.fantasyImage.setImageResource(fantasy.getFantasyHeaderImageID());

you can use

Picasso.with(context).load(fantasy.getFantasyHeaderImageID()).into(this.fantasyImage);