Make ListView Scroll Smoothly

Question

I have the following code to load my ListView (Each Item Has an Image and Text):

public View getView(final int i, View convertView, ViewGroup viewGroup) {
    View view = inflater.inflate(R.layout.contact_inflater, null);
    final Holder holder = new ContactAdapter.Holder();

    holder.ivPhoto = (ImageView) view.findViewById(R.id.ivImage);
    holder.tvFullName = (TextView) view.findViewById(R.id.tvName);
    holder.tvPhoneNumber = (TextView) view.findViewById(R.id.tvPhoneNo);
    holder.tvFullName.setText(Contact.get(i).get(0));
    holder.tvPhoneNumber.setText(Contact.get(i).get(1));
    holder.button = (Button) view.findViewById(R.id.ivButton);
        
    Picasso.with(context)
                .load(Contact.get(i).get(2))
                .into(holder.ivPhoto);
    
    return view;
}

The problem is the list isn't scrolling smoothly. How do I make it smooth?

EDIT: I have changed to RecycleView but I forgot to add the following code:

if(//IF//){ 
    Log.d("InInIn!", "InInIn!"); 
    
    //Turn to Tagged
}

When I turn it into a RecycleView, The button turns Tagged all over the pace and the tagged buttons change as a scroll. The buttons are changing all over the place even though they shouldn't. Whats the issue?

AFAIK, picasso will load the images asynchronously. The problem with scrolling here is not picasso. It's the lack of [viewholder pattern](https://stackoverflow.com/questions/21501316/what-is-the-benefit-of-viewholder) in your getView implementation — denvercoder9, Jul 23 '18 at 02:41
You don't *need* to use a RecyclerView, but you do at least need to change your ViewHolder code. The point of the ViewHolder is to not have to call `findViewById` every time (see https://developer.android.com/training/improving-layouts/smooth-scrolling and https://www.javacodegeeks.com/2013/09/android-viewholder-pattern-example.html). Picasso load may also be an issue though. You should profile it to see what's being slow. — Tyler V, Jul 23 '18 at 03:22

score 3 · Accepted Answer · edited Jul 07 '20 at 08:32

3

You should use recyclerView instead. It is a more advanced and flexible version of ListView. Go through https://developer.android.com/guide/topics/ui/layout/recyclerview for guide.

If you want to stick with ListView then in order to improve the performance you should recycle/reuse the views that are no longer visible to the user.

public View getView(final int i, View convertView, ViewGroup viewGroup) {
       
    Holder holder = null;
    if(convertView == null){
        convertView = inflater.inflate(R.layout.contact_inflater, null);
        final Holder holder = new ContactAdapter.Holder();
        holder.ivPhoto = (ImageView) convertView.findViewById(R.id.ivImage);
        holder.tvFullName = (TextView) convertView.findViewById(R.id.tvName);
        holder.tvPhoneNumber = (TextView) convertView.findViewById(R.id.tvPhoneNo);
        holder.button = (Button) convertView.findViewById(R.id.ivButton);
        convertView.setTag(holder)
    }
    else{
        holder = (Holder)convertView.getTag()
    } 

    holder.tvFullName.setText(Contact.get(i).get(0));
    holder.tvPhoneNumber.setText(Contact.get(i).get(1));

    Picasso.with(context)
                .load(Contact.get(i).get(2))
                .into(holder.ivPhoto);

    return convertView;
}

edited Jul 07 '20 at 08:32

justdrinkcoffee

53
2

answered Jul 23 '18 at 04:45

Amrita

455
4
12

This helped except for one issue. – Ron Arel Jul 23 '18 at 04:50
What is the issue? – Amrita Jul 23 '18 at 04:51
I will edit the code but change the button if the phonenumber equals something. If I do this above, The button changes all over the place even though it shouldn;t. – Ron Arel Jul 23 '18 at 04:51
I got your problem, try this: holder.tvFullName.setText(Contact.get(i).get(0)); holder.tvPhoneNumber.setText(Contact.get(i).get(1)); After this add your if-else for button change. – Amrita Jul 23 '18 at 04:52
What is the difference? – Ron Arel Jul 23 '18 at 04:53
I have edited my comment. What exactly you want to do with the button? – Amrita Jul 23 '18 at 04:56
You will have to provide an else for your if condition. if(postitons.contains(Contact.get(i).get(1))){...} else{holder.button.setText("whatever you want")} – Amrita Jul 23 '18 at 05:05

score 0 · Answer 2 · answered Jul 23 '18 at 02:45

0

You can debug and check what recived to Picasso, you add: un listener for watch the error

        .into(ontact.get(i).get(2), new Callback() {
            @Override
            public void onSuccess() {
            }

            @Override
            public void onError(Exception e) {
            }
        })

answered Jul 23 '18 at 02:45

Jesus Martinez

11
2

1

Picasso is not the issue? – Ron Arel Jul 23 '18 at 02:46
you check the documentation and show the error in debugger, i don't know what's the problem if don't show me the code when receive the data – Jesus Martinez Jul 23 '18 at 02:55

score 0 · Answer 3 · edited Jul 07 '20 at 06:02

public View getView(final int i, View convertView, ViewGroup viewGroup) {
    Holder holder;
    if(null == convertView){
        holder = new ContactAdapter.Holder();
        convertView = inflater.inflate(R.layout.contact_inflater, null);
        holder.ivPhoto = (ImageView) view.findViewById(R.id.ivImage);
        holder.tvFullName = (TextView) view.findViewById(R.id.tvName);
        holder.tvPhoneNumber = (TextView) view.findViewById(R.id.tvPhoneNo);
        holder.button = (Button) view.findViewById(R.id.ivButton);
        converView.setTag(holder);
    }else{
        holder = (Holder) convertView.getTag();
    }
    holder.tvFullName.setText(Contact.get(i).get(0));
    holder.tvPhoneNumber.setText(get(i).get(1));
    Picasso.with(context)
                    .load(Contact.get(i).get(2))
                    .into(holder.ivPhoto);
    return view;
}

score 0 · Answer 4 · answered Jul 23 '18 at 03:59

0

You will have to use Databinding in your list adapter and get layout components without using findViewById in your getView method.

answered Jul 23 '18 at 03:59

unzila

190
1
12

score 0 · Answer 5 · edited Jul 07 '20 at 08:21

try this:

This is the new and updated getView scroll faster

@Override
public View getView(int position, View convertView, ViewGroup paramViewGroup) {
    Object current_event = mObjects.get(position);
    ViewHolder holder = null;

    if (convertView == null) {
        holder = new ViewHolder();
        convertView = inflater.inflate(R.layout.row_event, null);
        holder.ThreeDimension = (ImageView) convertView.findViewById(R.id.ThreeDim);
        holder.EventPoster = (ImageView) convertView.findViewById(R.id.EventPoster);
        // This will now execute only for the first time of each row
        RelativeLayout.LayoutParams imageParams = new RelativeLayout.LayoutParams(measuredwidth, rowHeight);
        holder.EventPoster.setLayoutParams(imageParams);
        convertView.setTag(holder);
    } else {
        holder = (ViewHolder) convertView.getTag();
    }

    // This way you can simply avoid conditions
    holder.ThreeDimension.setVisibility(object.getVisibility());

    return convertView;
}

Make ListView Scroll Smoothly

5 Answers5