Change calendar background

5 posts, 1 answers
  1. Licensing
    Licensing avatar
    16 posts
    Member since:
    Jul 2006

    Posted 27 Oct 2014 Link to this post

    Hi, we recently purchased the Telerik UI's for Android and are thrilled with their out of box functionality. One small concern however is the color of the calendar. The default color is a light grey tone which does not sit well with the look and feel of our app, and I cannot seem to find a way to change it. I've read through the documentation regarding customizing the calendar, and have found ways to style a specific cell, but not the entire calendar. Is this functionality supported/possible? 
  2. Answer
    Todor
    Admin
    Todor avatar
    778 posts

    Posted 28 Oct 2014 Link to this post

    Hello Amadeus,

    Thank you for your question.

    In order to provide this functionality we have exposed a method setAdapter(CalendarAdapter), which allows you to define your own adapter which provides the calendar elements. Of course you don't need to start from scratch, you can simply extend our implementation and set a different background of the desired cells. Here's an example:

    class CustomCalendarAdapter extends CalendarAdapter {
        CustomCalendarAdapter(Context context, Calendar calendar, Locale locale) {
            super(context, calendar, locale);
        }
     
        @Override
        public CalendarCell getDateView(Long date, List<Event> eventList, boolean includeWeekNumber) {
            CalendarCell cell = super.getDateView(date, eventList, includeWeekNumber);
            cell.setBackgroundResource(R.drawable.my_calendar_cell);
            return cell;
        }
     
        @Override
        public CalendarCell getDayNameView(int index) {
            CalendarCell cell = super.getDayNameView(index);
            cell.setBackgroundColor(Color.GREEN);
            return cell;
        }
     
        @Override
        public TextView getTitleView(Context context, long date, CalendarDisplayMode displayMode) {
            TextView title = super.getTitleView(context, date, displayMode);
            title.setBackgroundColor(Color.BLUE);
            return title;
        }
    }

    Additionally, you can also override the methods getWeekNumberView and getCalendarMonthCell, if you need to. As you may guess, with this adapter the calendar will have blue background on its title, green on the names of the days, and for the cells with dates the resource my_calendar_cell will be used. You can define this resource in the resources of your application. Here's our default implementation which you can use as a reference:

    <selector
        android:constantSize="true">
        <item android:drawable="@drawable/calendar_cell_today" calendar:state_calendar_cell_today="true"/>
        <item android:drawable="@drawable/calendar_cell_pressed" android:state_pressed="true"/>
        <item android:drawable="@drawable/calendar_cell_selected" android:state_selected="true"/>
        <item android:drawable="@drawable/calendar_cell_disabled" android:state_enabled="false"/>
        <item android:drawable="@drawable/calendar_cell_normal"/>
    </selector>

    Defined this way, the calendar cell uses a different resource in its different states, here's the example for the standard cells (calendar_cell_normal):

        <solid android:color="#E5E5E5" />
    </shape>

    Don't forget to actually set an instance of your adapter to the calendar:

    calendarView.setAdapter(new CustomCalendarAdapter(this, Calendar.getInstance(), Locale.getDefault()));

    If you need further assistance, don't hesitate to get back to us.

    Regards,
    Todor
    Telerik
     

    Check out the Telerik Platform - the only platform that combines a rich set of UI tools with powerful cloud services to develop web, hybrid and native mobile apps.

     
  3. DevCraft banner
  4. Licensing
    Licensing avatar
    16 posts
    Member since:
    Jul 2006

    Posted 28 Oct 2014 in reply to Todor Link to this post

    Thank you for the detailed and informative response Todor, thats exactly what we were looking for!
  5. Marcel
    Marcel avatar
    1 posts
    Member since:
    Mar 2009

    Posted 06 Jan 2015 Link to this post

    Hi,

    I'm currently evaluating Telerik_UI_for_Android_2014_3_1204 and the CalendarAdapter API no longer(?) matches what is described in this post. 

    For example, method getDateView is no longer part of this class. Has the API been changed in the meantime?

    Thanks,
    Marcel
  6. Antony Jekov
    Admin
    Antony Jekov avatar
    88 posts

    Posted 07 Jan 2015 Link to this post

    Hello Marcel,

    The API for the CalendarAdapter is indeed changed since the last release of the Calendar in December 2014.
    The calendar has been optimized to use a single View for displaying its elements and the cells are no longer Views themselves. Therefore the adapter no longer returns a View by using getDateView() but returns a CalendarDayCell by using getDateCell();

    If interested you can read some more about the release notes and the changes since the last update in the following blog post: http://blogs.telerik.com/androidteam/posts/14-12-09/improved-android-calendar-and-chart-with-the-q3-2014-service-pack

    Regards,
    Antony Jekov
    Telerik
     

    Check out the Telerik Platform - the only platform that combines a rich set of UI tools with powerful cloud services to develop web, hybrid and native mobile apps.

     
Back to Top
DevCraft banner