android ListView with holder pattern on update item flicker

Question

I created a listView with Base Adapter who implements ViewHolder Pattern. Each item from listview have a countdownTimer. Works fine, but if i want to update listview countDownTimer is flickering beetween new value and old value.

How to resolve this issue?

BaseAdapter getView()

 @Override
public View getView(int position, View convertView, ViewGroup parent) {
    View rowView = convertView;
    if (rowView == null) {
        LayoutInflater inflater = LayoutInflater.from(context);
        rowView = inflater.inflate(R.layout.row_item, null);
        ViewHolder viewHolder = new ViewHolder();
        rowView.setTag(viewHolder);

        viewHolder.name = (TextView) rowView.findViewById(R.id.name);
        viewHolder.startingAt = (TextView) rowView.findViewById(R.id.starting_at);

    } else {
        rowView = convertView;

    }

    ViewHolder holder = (ViewHolder) rowView.getTag();
    Model current = list.get(position);
    holder.name.setText(current.name);

    return rowView;
}

CountDownTimer for each item

@Override
public void run() {
    int j = 0;
    for (int nTime : listOfTimes) {
        listOfTimes.set(j, nTime - 1);
        j++;
    }

    if (lv.getCount() <= 0) {
        return;
    }
    int nAmountVisible = lv.getLastVisiblePosition() - lv.getFirstVisiblePosition();
    for (int i = 0; i <= nAmountVisible; i++) {
        long lTimeFromList = listOfTimes.get(lv.getFirstVisiblePosition() + i);

        // transform timestamp to readable date
        long weeks = TimeUnit.SECONDS.toDays(lTimeFromList) / 7;
        long days = TimeUnit.SECONDS.toDays(lTimeFromList) - (7 * weeks);
        long hours = TimeUnit.SECONDS.toHours(lTimeFromList) - TimeUnit.DAYS.toHours(days) - TimeUnit.DAYS.toHours(7 * weeks);
        long minute = TimeUnit.SECONDS.toMinutes(lTimeFromList) - (TimeUnit.SECONDS.toHours(lTimeFromList) * 60);
        long second = TimeUnit.SECONDS.toSeconds(lTimeFromList) - (TimeUnit.SECONDS.toMinutes(lTimeFromList) * 60);

        View viewHolder = lv.getChildAt(i);
        AuctionAdapter.ViewHolder localHolder = (AuctionAdapter.ViewHolder) viewHolder.getTag();
        viewHolder.invalidate();

        localHolder.startingAt.setText(weeks + "w " + days + "d " + hours + "h " + minute + "m " + second + "s ");

    }
    mHandler.postDelayed(this, 1000);
}

and code from fragment who populate adapter and list of times for countdowntimer

  baseAdapter = new baseAdapter(getActivity(),list);
        baseAdapter.notifyDataSetChanged();
        runningLv.setAdapter(baseAdapter);
        runningLv.invalidateViews();

        ArrayList<Integer> listOfTimes = new ArrayList<Integer>();
        listOfTimes.clear();
        for (Model m : list) {
            listOfTimes.add(Integer.parseInt(m.starting_at) - m.current_time);
        }
        CountDownTime countDownTimer = new CountDownTime(listOfTimes, runningLv);
        countDownTimer.run();
        baseAdapter.notifyDataSetChanged();

UPDATE: this is onCreateView, i want to reuse view

    @Override
public View onCreateView(LayoutInflater inflater, ViewGroup container, Bundle savedInstanceState) {
    View view = null;
    if (view != null) {
        ViewGroup parent = (ViewGroup) view.getParent();
        if (parent != null) {
            parent.removeView(view);
        }
    } else {
        view = inflater.inflate(R.layout.fragment_running, null);
        setupViewItems(view);

    }
    return view;
}

score 1 · Answer 1 · edited Dec 11 '15 at 23:27

The correct way to use the holder should be like that:

@Override
public View getView(int position, View convertView, ViewGroup parent)
{
    ViewHolder holder = null;
    if (convertView == null)
    {
        LayoutInflater inflater = LayoutInflater.from(context);
        convertView = inflater.inflate(R.layout.row_item, null);
        holder = new ViewHolder();

        holder.name = (TextView) convertView.findViewById(R.id.name);
        holder.startingAt = (TextView) convertView.findViewById(R.id.starting_at);

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

    Model current = list.get(position);
    holder.name.setText(current.name);

    return convertView;
}

EDIT:

You should not set the TextView value from a running thread but directly from the getView method.

Add this line right before return convertView;:

holder.startingAt.setText(current.timer);

And in your Model class, add a new field:

public String timer = null;

Then in your running thread (Countdown timer):

@Override
public void run()
{
    for (int i = 0; i <= listOfTimes.size(); i++)
    {
        long lTimeFromList = listOfTimes.get(i);

        // transform timestamp to readable date
        long weeks = TimeUnit.SECONDS.toDays(lTimeFromList) / 7;
        long days = TimeUnit.SECONDS.toDays(lTimeFromList) - (7 * weeks);
        long hours = TimeUnit.SECONDS.toHours(lTimeFromList) - TimeUnit.DAYS.toHours(days) - TimeUnit.DAYS.toHours(7 * weeks);
        long minute = TimeUnit.SECONDS.toMinutes(lTimeFromList) - (TimeUnit.SECONDS.toHours(lTimeFromList) * 60);
        long second = TimeUnit.SECONDS.toSeconds(lTimeFromList) - (TimeUnit.SECONDS.toMinutes(lTimeFromList) * 60);

        listOfTimes.get(i).timer = weeks + "w " + days + "d " + hours + "h " + minute + "m " + second + "s ";
    }
    mHandler.postDelayed(this, 1000);
}

thank but not resolved my problem... i make an update at my question — ovluca, Jul 03 '14 at 08:41
Why do you want to use `onCreateView` to reuse the views ? The Listview mechanisms already do the job. — Manitoba, Jul 03 '14 at 08:42
i think this is a better approach. to reuse view how much you can. i will try without. — ovluca, Jul 03 '14 at 08:45
I've updated my answer. The problem looks to be located in your `run` method. — Manitoba, Jul 03 '14 at 08:56
thanks for help.. but if i do that textview starting_at isn't change anymore at one second — ovluca, Jul 03 '14 at 09:32
1. Get the item. 2. Change the `timer` value. 3. Set it back to the list (`set(position, item)`) — Manitoba, Jul 03 '14 at 10:58

score 0 · Answer 2 · answered Jul 03 '14 at 08:54

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

ViewHolder viewHolder;
if (convertView == null) {
    LayoutInflater inflater = LayoutInflater.from(context);
    convertView = inflater.inflate(R.layout.row_item, null);
    viewHolder = new ViewHolder();

    viewHolder.name = (TextView) convertView.findViewById(R.id.name);
    viewHolder.startingAt = (TextView) convertView.findViewById(R.id.starting_at);
    convertView.setTag(viewHolder );

} else {

    viewHolder = (ViewHolder) convertView.getTag();
}

Model current = list.get(position);
viewHolder.name.setText(current.name);

return convertView;
}

android ListView with holder pattern on update item flicker

2 Answers2