Slow and jerky Android Custom Listview

Question

I've tried all the basic things like moving every heavy task to Async task, using cached references of views in getview(), enabling scrolling/drawing cache etc so please don't suggest them. I've identified the problem to be with using the ArrayList.

I am using a ArrayList with Hashmap to hold the data.

static ArrayList<HashMap<String, String>> mainList = new ArrayList<HashMap<String, String>>();

Adapter Code :

public static class LazyAdapter extends BaseAdapter {

    private Activity activity;
    private ArrayList<HashMap<String, String>> data;
    private LayoutInflater inflater = null;
    public ImageLoader imageLoader;

    public LazyAdapter(Activity a, ArrayList<HashMap<String, String>> d) {
        activity = a;
        data = d;
        inflater = (LayoutInflater) activity
                .getSystemService(Context.LAYOUT_INFLATER_SERVICE);
        imageLoader = new ImageLoader(activity.getApplicationContext());
    }

    public int getCount() {
        return data.size();
    }

    public Object getItem(int position) {
        return position;
    }

    public long getItemId(int position) {
        return position;
    }

    public View getView(int position, View convertView, ViewGroup parent) {

        ViewHolder holder;

        View vi = convertView;
        if (convertView == null) {
            vi = inflater.inflate(R.layout.list_row, null);

            holder = new ViewHolder();
            holder.title = (TextView) vi.findViewById(R.id.title);
            holder.artist = (TextView) vi.findViewById(R.id.artist);
            holder.duration = (TextView) vi.findViewById(R.id.duration);
            holder.newsid = (TextView) vi.findViewById(R.id.newsid);
            holder.thumb_image = (ImageView) vi
                    .findViewById(R.id.list_image);

            vi.setTag(holder);
        } else {
            holder = (ViewHolder) vi.getTag();
        }

        HashMap<String, String> song = new HashMap<String, String>();

        try {
            song = data.get(position);

            // Setting all values in listview

            if (song.get(MainActivity.TAG_SELECTED)
                    .equalsIgnoreCase("true")) {

                final CheckBox chk = (CheckBox) vi.findViewById(R.id.tick);
                chk.setChecked(false);
            } else {
                final CheckBox chk = (CheckBox) vi.findViewById(R.id.tick);
                chk.setChecked(true);
            }

            holder.newsid.setText(song.get(MainActivity.TAG_ID));

            holder.title.setText(song.get(MainActivity.TAG_TITLE));
            holder.title.setTypeface(myTypeface);
            holder.title.setTextSize(16);
            holder.artist.setText(song.get(MainActivity.TAG_DESCRIPTON));
            holder.artist.setTypeface(myTypeface);
            holder.artist.setTextSize(13);
            holder.duration.setText(song.get(MainActivity.TAG_CREATED));
            holder.duration.setTextSize(12);

            imageLoader.DisplayImage(song.get(MainActivity.TAG_IMAGE),
                    holder.thumb_image);

        } catch (Exception e) {
        }

        return vi;
    }
}

How can I make this work?

Answer 1

Here i am setting TypeFace and some default settings once and using them entire listview..

make sure create TypeFace once and use it every where.creating TypeFace is takes more resources and time too..

Crete ViewHolder inside Adapeter like this..

public static class ViewHolder {

    private TextView title;
    private TextView artist;
    private TextView duration;
    private TextView newsid;
    private ImageView thumb_image;
    private CheckBox chk;

    public ViewHolder(View vi) {
        title = (TextView) vi.findViewById(R.id.title);
        artist = (TextView) vi.findViewById(R.id.artist);
        duration = (TextView) vi.findViewById(R.id.duration);
        newsid = (TextView) vi.findViewById(R.id.newsid);
        thumb_image = (ImageView) vi.findViewById(R.id.list_image);
        chk = (CheckBox) vi.findViewById(R.id.tick);

        title.setTypeface(myTypeface);
        title.setTextSize(16);
        artist.setTypeface(myTypeface);
        artist.setTextSize(13);
        duration.setTextSize(12);
    }
}

And your getView() method will like this..

public View getView(int position, View convertView, ViewGroup parent) {
    ViewHolder holder;
    View vi = convertView;
    if (convertView == null) {
        vi = inflater.inflate(R.layout.list_row, null);
        holder = new ViewHolder(vi);
        vi.setTag(holder);
    } else {
        holder = (ViewHolder) vi.getTag();
    }

    HashMap<String, String> song ;
    try {
        song = data.get(position);
        // Setting all values in listview
        if (song.get(MainActivity.TAG_SELECTED).equalsIgnoreCase("true")) {
            holder.chk.setChecked(false);
        } else {
            holder.chk.setChecked(true);
        }
        holder.newsid.setText(song.get(MainActivity.TAG_ID));
        holder.title.setText(song.get(MainActivity.TAG_TITLE));
        holder.duration.setText(song.get(MainActivity.TAG_CREATED));
        imageLoader.DisplayImage(song.get(MainActivity.TAG_IMAGE),
                holder.thumb_image);
        holder.artist.setText(song.get(MainActivity.TAG_DESCRIPTON));
    } catch (Exception e) {
    }

    return vi;
}

Take one Util class for loading Typeface like this..

public class TypeFaceUtil {

public static Typeface typeface;

public static Typeface getTypeface(Context context) {
    if (typeface == null) {
        typeface = Typeface.createFromAsset(context.getAssets(),
                "arabic_font.otf");
    }
    return typeface;
}
}

And load the typeface once and use it entire your Application.

Answer 2

You need to make few changes for improving the performance,

> set typeface and textsize in holder

> utilize the object song instead of creating it everytime

Code :

public static class LazyAdapter extends BaseAdapter {

private Activity activity;
private ArrayList<HashMap<String, String>> data;
private LayoutInflater inflater = null;
public ImageLoader imageLoader;

//create an object of song
private static HashMap<String, String> song = new HashMap<String, String>();

public LazyAdapter(Activity a, ArrayList<HashMap<String, String>> d) {
    activity = a;
    data = d;
    inflater = (LayoutInflater) activity
            .getSystemService(Context.LAYOUT_INFLATER_SERVICE);
    imageLoader = new ImageLoader(activity.getApplicationContext());
}

public int getCount() {
    return data.size();
}

public Object getItem(int position) {
    return position;
}

public long getItemId(int position) {
    return position;
}

public View getView(int position, View convertView, ViewGroup parent) {

    ViewHolder holder;

    View vi = convertView;
    if (convertView == null) {
        vi = inflater.inflate(R.layout.list_row, null);

        holder = new ViewHolder();
        holder.title = (TextView) vi.findViewById(R.id.title);
        holder.artist = (TextView) vi.findViewById(R.id.artist);
        holder.duration = (TextView) vi.findViewById(R.id.duration);
        holder.newsid = (TextView) vi.findViewById(R.id.newsid);
        holder.thumb_image = (ImageView) vi
                .findViewById(R.id.list_image);

        // set typeface and textsize
        holder.title.setTypeface(myTypeface);
        holder.title.setTextSize(16);
        holder.artist.setTypeface(myTypeface);
        holder.artist.setTextSize(13);
        holder.duration.setTextSize(12);


        vi.setTag(holder);
    } else {
        holder = (ViewHolder) vi.getTag();
    }

    // instead of creating object of song everytime,do it once only and then assign the data into that

    try {
        song = data.get(position);

        // Setting all values in listview

        if (song.get(MainActivity.TAG_SELECTED)
                .equalsIgnoreCase("true")) {

            final CheckBox chk = (CheckBox) vi.findViewById(R.id.tick);
            chk.setChecked(false);
        } else {
            final CheckBox chk = (CheckBox) vi.findViewById(R.id.tick);
            chk.setChecked(true);
        }

        holder.newsid.setText(song.get(MainActivity.TAG_ID));

        holder.title.setText(song.get(MainActivity.TAG_TITLE));
        holder.artist.setText(song.get(MainActivity.TAG_DESCRIPTON));
        holder.duration.setText(song.get(MainActivity.TAG_CREATED));

        imageLoader.DisplayImage(song.get(MainActivity.TAG_IMAGE),
                holder.thumb_image);

    } catch (Exception e) {
    }

    return vi;


   }
}

Answer 3

Do not set custom type face and font size like below code

public View getView(int position, View convertView, ViewGroup parent) {

    ViewHolder holder;

    View vi = convertView;
    if (convertView == null) {
        vi = inflater.inflate(R.layout.list_row, null);

        holder = new ViewHolder();
        holder.title = (TextView) vi.findViewById(R.id.title);
        holder.artist = (TextView) vi.findViewById(R.id.artist);
        holder.duration = (TextView) vi.findViewById(R.id.duration);
        holder.newsid = (TextView) vi.findViewById(R.id.newsid);
        holder.thumb_image = (ImageView) vi
                .findViewById(R.id.list_image);

    holder.title.setTypeface(myTypeface);
        holder.title.setTextSize(16);
    holder.artist.setTypeface(myTypeface);
        holder.artist.setTextSize(13);
        holder.duration.setText(song.get(MainActivity.TAG_CREATED));
        holder.duration.setTextSize(12);

        vi.setTag(holder);
    } else {
        holder = (ViewHolder) vi.getTag();
    }

    HashMap<String, String> song = new HashMap<String, String>();

    try {
        song = data.get(position);

        // Setting all values in listview

        if (song.get(MainActivity.TAG_SELECTED)
                .equalsIgnoreCase("true")) {

            final CheckBox chk = (CheckBox) vi.findViewById(R.id.tick);
            chk.setChecked(false);
        } else {
            final CheckBox chk = (CheckBox) vi.findViewById(R.id.tick);
            chk.setChecked(true);
        }

        holder.newsid.setText(song.get(MainActivity.TAG_ID));
        holder.title.setText(song.get(MainActivity.TAG_TITLE));
        holder.artist.setText(song.get(MainActivity.TAG_DESCRIPTON));

        imageLoader.DisplayImage(song.get(MainActivity.TAG_IMAGE),
                holder.thumb_image);

    } catch (Exception e) {
    }

    return vi;
}