Detect listener on month scrolling in android times square

Question

I have implemented code for android times square, but I am unable to detect the event when the month change. I have to highlight multiple range of dates from months.

This is the way I have done but, I am unable to detect when month got changed while scrolling

code:

public class Calender extends Activity implements OnDateChangeListener,CalendarCellDecorator {

String BOOKING_URL="http://www.example.com/app/webroot/mobile/booking.php";
ArrayList<String>list=new ArrayList<String>();
CalendarPickerView calender;
ArrayList<Date> dates = new ArrayList<Date>();
Calendar lastYear,nextYear;
Calendar today;



@Override
public void onCreate(Bundle savedInstanceState) {
    super.onCreate(savedInstanceState);
    setContentView(R.layout.calender);

    getActionBar().setTitle("CALENDER");
    getActionBar().setIcon(R.drawable.back);
    getActionBar().setDisplayOptions(getActionBar().getDisplayOptions()| ActionBar.DISPLAY_SHOW_CUSTOM);
    ImageView imageView = new ImageView(getActionBar().getThemedContext());
    imageView.setScaleType(ImageView.ScaleType.CENTER);
    imageView.setImageResource(R.drawable.manu_btn);
    ActionBar.LayoutParams layoutParams = new ActionBar.LayoutParams(ActionBar.LayoutParams.WRAP_CONTENT,ActionBar.LayoutParams.WRAP_CONTENT, Gravity.RIGHT| Gravity.CENTER_VERTICAL);
    layoutParams.rightMargin = 40;
    imageView.setLayoutParams(layoutParams);
    getActionBar().setCustomView(imageView);
    centerActionBarTitle();
    imageView.setOnClickListener(new OnClickListener() {

        @Override
        public void onClick(View v) {
            // TODO Auto-generated method stub

        }
    });

    nextYear = Calendar.getInstance();
    nextYear.add(Calendar.YEAR, 2);

    lastYear= Calendar.getInstance();
    lastYear.add(Calendar.YEAR, -2);

    today = Calendar.getInstance();

    calender = (CalendarPickerView) findViewById(R.id.calendar);
    calender.setOnScrollListener(new OnScrollListener() {

        private int mLastFirstVisibleItem;

        @Override
        public void onScrollStateChanged(AbsListView view, int scrollState) {

        }

        @Override
        public void onScroll(AbsListView view, int firstVisibleItem,
                int visibleItemCount, int totalItemCount) {



            if(mLastFirstVisibleItem<firstVisibleItem)
            {
                Log.d("SCROLLING DOWN","TRUE");
            }
            if(mLastFirstVisibleItem>firstVisibleItem)
            {
                Log.d("SCROLLING UP","TRUE");

            }
            mLastFirstVisibleItem=firstVisibleItem;

        }   

    });


    calender1.init(lastYear.getTime(), nextYear.getTime());//.inMode(SelectionMode.RANGE);



    new MyAsyncTask(BOOKING_URL).execute();

}

.....


try {

            JSONArray array=new JSONArray(response);
            for (int i = 0; i < array.length(); i++) {

                JSONObject json=array.getJSONObject(i);
                list.add(json.getString("fromDate")+" "+json.getString("toDate"));

            }

            SimpleDateFormat sdf =  new SimpleDateFormat("yyyy-MM-dd");
            TimeZone gmt = TimeZone.getTimeZone("GMT");
            sdf.setTimeZone(gmt);
            sdf.setLenient(false);

            try {
                Date date = sdf.parse(list.get(0).split(" ")[0]);
                Date date1 = sdf.parse(list.get(0).split(" ")[1]);
                System.out.println(date);
                dates.add(date);
                dates.add(date1);
            } catch (Exception e) {
                e.printStackTrace();
            }                   

            calendar.init(lastYear.getTime(), nextYear.getTime()).inMode(SelectionMode.RANGE).withSelectedDates(dates);             

        } catch (JSONException e) {
            e.printStackTrace();

        }

....

@Override
public void decorate(CalendarCellView calendarCellView, Date date) {

    Log.d("TAG", "a"+date);

    if (date.getDate() < 5) {
        calendarCellView.setBackgroundResource(R.drawable.side_testi);
    } else {
        calendarCellView.setBackgroundResource(R.drawable.side_book);
    }
}

json response:

[
    {
        "fromDate": "2014-03-03",
        "toDate": "2014-03-07",
        "name": "Anurag",
        "email": "anuragk.evs@gmail.com",
        "phone": "2147483647",
        "address": "Y-51, 3rd Floor, Sector 12",
        "comment": "I wanna view here."
    },
    {
        "fromDate": "2014-04-09",
        "toDate": "2014-04-09",
        "name": "Dana Edgar",
        "email": "danae@bhmconstruction.com",
        "phone": "0",
        "address": "BHM Construction Inc.\r\n522 Walnut Avenue\r\nVallejo, CA 94592",
        "comment": "Primary guest will be Jeffery Mazet and his contact phone number is (530)601-0570. His email is jeffm@bhmconstruction.com."
    },
    {
        "fromDate": "2015-02-09",
        "toDate": "2015-02-25",
        "name": "Ghfb",
        "email": "testxzy@gmail.com",
        "phone": "2147483647",
        "address": "\nGffbbnn",
        "comment": "Dhgbngh"
    },
    {
        "fromDate": "2015-02-09",
        "toDate": "2015-02-25",
        "name": "Ghfb",
        "email": "testxzy@gmail.com",
        "phone": "2147483647",
        "address": "\nGffbbnn",
        "comment": "Dhgbngh"
    },
    {
        "fromDate": "2015-06-04",
        "toDate": "2015-09-04",
        "name": "rewr",
        "email": "manish@gmail.com",
        "phone": "2147483647",
        "address": "cbvcb",
        "comment": "vnbvbbm"
    }
]

---

layout:

<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:background="@android:color/white"
    android:orientation="vertical" >

     <com.squareup.timessquare.CalendarPickerView
      android:id="@+id/calendar"
      android:layout_width="match_parent"
      android:layout_height="0dp"
      android:layout_weight="1"
      android:paddingLeft="16dp"
      android:paddingRight="16dp"
      android:paddingBottom="16dp"
      android:scrollbarStyle="outsideOverlay"
      android:clipToPadding="false"
      android:background="#FFFFFF"
      />


</LinearLayout>

---

issues raised

• https://github.com/square/android-times-square/issues/199

• https://github.com/square/android-times-square/issues/205

• https://github.com/square/android-times-square/issues/135

It seems I am missing something. Any suggestion is appreciated.

Answer 1

Using the CalendarCellDecorator you could write something like this:

public class MonthDecorator implements CalendarCellDecorator {

    @Override
    public void decorate(CalendarCellView calendarCellView, Date date) {
        if (date.getDate() < 5) {
            calendarCellView.setBackgroundResource(R.drawable.red_background);
        } else {
            calendarCellView.setBackgroundResource(R.drawable.blue_background);
        }
    }
}

It is a simple example - the first 5 days in every month will have a different background than the rest of the days. Every cell in every month passes through the decorator, so you could use it to change the UI of cells in multiple months. Generally you'll have to store the dates which should be highlighted CalendarCellDecorator and in the decorate method check whether the given cellView is showing one of these dates. In my case I just check whether the date is before 5th, but you could make a more meaningful check there - i.e. give a range of dates and check whether the given date is inside this range for example.

EDIT: showing how to apply the decorator:

calendar.init(lastYear.toDate(), nextYear.toDate()).inMode(CalendarPickerView.SelectionMode.RANGE);
List<CalendarCellDecorator> decoratorList = new ArrayList<>();
decoratorList.add(new MonthDecorator());
calendar.setDecorators(decoratorList);