How to Handle Multiple Countdown Timer in ListView

Here's the example How to add countdown Timer in each Listview Item. In this example you will get Perfect countdown. It has been seen that when user scroll list data get refreshed and time mismatches.
In this example we have taken care of that carefully.

In this example we have created a view separately. So that in listview adapter you only need to add only one line to set text.

Here's the code: 

STEP-1

In layout.xml create a seprate layout that you want to show in countdown timer.

<?xml version="1.0" encoding="utf-8"?>
<com.view.CountDownTimerView xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:app="http://schemas.android.com/apk/res-auto"
    xmlns:countdownview="http://schemas.android.com/apk/res-auto"
    android:id="@+id/counterview"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:layout_marginTop="@dimen/space_five"
    android:gravity="center">

    <LinearLayout
        android:layout_width="@dimen/space_seventy"
        android:layout_height="wrap_content"
        android:gravity="center"
        android:orientation="vertical">



            <TextView
                android:id="@+id/tvCountDays"
                android:layout_width="match_parent"
                android:layout_height="match_parent"
          />
  <TextView
                android:id="@+id/tvCounthours"
                android:layout_width="match_parent"
                android:layout_height="match_parent"
          />
      <TextView
                android:id="@+id/tvCountMinute"
                android:layout_width="match_parent"
                android:layout_height="match_parent"
          />
       
 <TextView
                android:id="@+id/tvCountSeconds"
                android:layout_width="match_parent"
                android:layout_height="match_parent"
          />
    
    </LinearLayout>

</com.view.CountDownTimerView>

STEP-II

Create a .java file named as CountDownTimerView for the view That is extending a LinerLayout

package com.view;

import android.app.Activity;
import android.content.Context;
import android.content.Intent;
import android.os.Handler;
import android.util.AttributeSet;
import android.widget.LinearLayout;


/**
 * Created by rahul.agrahari on 11/17/2015.
 */
public class CountDownTimerView extends LinearLayout {
    Handler handler;
    CountRunnable countRunnable;
    String endtime;
    boolean endtimeoverflag = false;
    ServiceReciever serviceReciever;
    Context mContext;
    int position;
    private transient TextView tvCountDays;
    private transient TextView tvCounthours;
    private transient TextView tvCountMinute;
    private transient TextView tvCountSeconds;

    public CountDownTimerView(Context context) {
        super(context);
    }

    public CountDownTimerView(Context context, AttributeSet attrs) {
        super(context, attrs);
    }

    public CountDownTimerView(Context context, AttributeSet attrs, int defStyleAttr) {
        super(context, attrs, defStyleAttr);
    }

    @Override
    protected void onFinishInflate() {
        super.onFinishInflate();
        tvCountDays = (TextView ) findViewById(R.id.tvCountDays);
        tvCounthours = (TextView ) findViewById(R.id.tvCounthours);
        tvCountMinute = (TextView ) findViewById(R.id.tvCountMinute);
        tvCountSeconds = (TextView ) findViewById(R.id.tvCountSeconds);
        countRunnable = new CountRunnable();
        handler = new Handler();
    }

    public void setCountDownData() {
        handler.postDelayed(countRunnable, 1000);
    }

    public void setEndTime(String endtime) {
        this.endtime = endtime;
        setCountDownData();
    }

    public boolean getendtimeflag() {
        return endtimeoverflag;
    }

  

    public void setContext(Context context,int position) {
        this.mContext = context;
        this.position=position;
    }

    @Override
    protected void onDetachedFromWindow() {
        super.onDetachedFromWindow();
        handler.removeCallbacks(countRunnable);
    }

    class CountRunnable implements Runnable {

        @Override
        public void run() {
            String[] countdowntimearray = Utils.getCounterTime(endtime);

            if (Integer.parseInt(countdowntimearray[0]) <= 0) {
                tvCountDays.setText("0");
                endtimeoverflag = false;
            } else {
                tvCountDays.setText(countdowntimearray[0]);
                endtimeoverflag = true;
            }

            if (Integer.parseInt(countdowntimearray[1]) <= 0) {
                tvCounthours.setText("0");
                endtimeoverflag = false;
            } else {
                tvCounthours.setText(countdowntimearray[1]);
                endtimeoverflag = true;
            }

            if (Integer.parseInt(countdowntimearray[2]) <= 0) {
                tvCountMinute.setText("0");
                endtimeoverflag = false;
            } else {
                tvCountMinute.setText(countdowntimearray[2]);
                endtimeoverflag = true;
            }

            if (Integer.parseInt(countdowntimearray[3]) <= 0) {
                tvCountSeconds.setText("0");
                endtimeoverflag = false;
            } else {
                tvCountSeconds.setText(countdowntimearray[3]);
                endtimeoverflag = true;
            }

            setCountDownData();
        }
    }
}




STEP-III Create Methods in Utils class named as getCounterTime()

/**This method is used to get days,hours,minutes,seconds from a date given in yyyy-MM-dd HH:mm:ss format/

public static String[] getCounterTime(String endtime) {
        String[] counttimearray = null;
        if (!endtime.equals("")) {
            Calendar calender = Calendar.getInstance();
            SimpleDateFormat sdf = new SimpleDateFormat("yyyy-MM-dd HH:mm:ss");
            String strDate = sdf.format(calender.getTime());
            try {
                Date currentdate = sdf.parse(strDate);
                Date enddate = sdf.parse(endtime);
                counttimearray = printDifference(currentdate, enddate);
            } catch (ParseException e) {
                e.printStackTrace();
            }
        } else {
            counttimearray = new String[]{"0", "0", "0", "0"};
        }
        return counttimearray;

    }

 /**This method print the diffrence betwwen given time and betwwen current time/

   public static String[] printDifference(Date startDate, Date endDate) {
        String[] counttime = new String[4];

        //milliseconds
        long different = endDate.getTime() - startDate.getTime();

        /*System.out.println("startDate : " + startDate);
        System.out.println("endDate : " + endDate);
        System.out.println("different : " + different);*/

        long secondsInMilli = 1000;
        long minutesInMilli = secondsInMilli * 60;
        long hoursInMilli = minutesInMilli * 60;
        long daysInMilli = hoursInMilli * 24;

        long elapsedDays = different / daysInMilli;
        different = different % daysInMilli;

        long elapsedHours = different / hoursInMilli;
        different = different % hoursInMilli;

        long elapsedMinutes = different / minutesInMilli;
        different = different % minutesInMilli;

        long elapsedSeconds = different / secondsInMilli;

      /*  System.out.printf(
                "%d days, %d hours, %d minutes, %d seconds%n",
                elapsedDays,
                elapsedHours, elapsedMinutes, elapsedSeconds);*/
        counttime[0] = String.valueOf(elapsedDays);
        counttime[1] = String.valueOf(elapsedHours);
        counttime[2] = String.valueOf(elapsedMinutes);
        counttime[3] = String.valueOf(elapsedSeconds);

        return counttime;
    }


STEP IV:
Now in thisstep add the xml file into your list_item.xml LIKE

   <LinearLayout
                android:layout_width="@dimen/space_seventy"
                android:layout_height="wrap_content"
                android:gravity="center"
                android:orientation="vertical">

                <include layout="@layout/countdown_timer_layout" />
            </LinearLayout>

STEP V:

Inside ListView Adapter call the method setEndTime() on the holder.countdownView Like




  viewHolder.counterview = (CountDownTimerView) convertView.findViewById(R.id.counterview);

viewHolder.counterview.setEndTime(model.getEndtime());

HERE's the output: 

screen 1.0

How to Handle Multiple Countdown Timer in ListView How to Handle Multiple Countdown Timer in ListView Reviewed by Unknown on 00:56 Rating: 5

1 comment:

  1. Hi, good work. Have you a example, i can download.
    Greats Ralf

    ReplyDelete

Powered by Blogger.