androidandroid-studioandroid-studio-3.0calendarview

Is it possible to customize the CalendarView widget to display events and customize the colour (Gradient colour)?


I am currently developing an app and I am stuck in implementing the calendar part of the app. Now I am trying to achieve something similar to this:

I did not find any functions on the original Calendar View which would let me display event indicator under days, add gradient colour instead of solid etc. I wanted to implement this design to my app:

enter image description here

I tried using Compact Calendar View by SundeepK however I did not manage to implement an event adapter to go with this calendar, I always received an error on passing context, as the custom calendar does not use context.

This code below I tried to implement the List view to be filled with the events in the month. So on month load or scroll, events would be loaded, passed to the adapter and the list view would be filled with new events. However, whatever I did I always got an error that I can't cast android.Context to the custom calendar Context.

CalendarActivity.java

        compactCalendarView.setListener(new CompactCalendarView.CompactCalendarViewListener() {
            @Override
            public void onDayClick(Date dateClicked) {
                List<Event> bookingsFromMap = compactCalendarView.getEvents(dateClicked);
                EventListAdapter adapter = new EventListAdapter(context, bookingsFromMap);

                ListView listView = (ListView) findViewById(R.id.calendar_event_list);
                listView.setAdapter(adapter);

                Log.d(TAG, "inside onclick " + simple_date_format.format(dateClicked));
                if (bookingsFromMap != null) {
                    Log.d(TAG, bookingsFromMap.toString());
                    mutableBookings.clear();
                    for (Event booking : bookingsFromMap) {
                        mutableBookings.add((String) booking.getData());
                        Log.d(TAG, "Events in this day found!");
                        }
                } else {
                    Log.println(Log.VERBOSE,TAG, "\n NO EVENTS FOUND \n");
                }
            }

EventListAdapter.java

public class EventListAdapter extends ArrayAdapter<Event> {

    public EventListAdapter(Context context, List<Event> feeds) {
        super(context,0,feeds);
    }

    @Override
    public View getView(int position, View convertView, ViewGroup parent) {
        Event feed = getItem(position);
        if(convertView == null) {
            convertView = LayoutInflater.from(getContext()).inflate(R.layout.event_feed_item_row, parent, false);
        }

        TextView eventName = (TextView) convertView.findViewById(R.id.event_list_dataText);
        TextView eventDay = (TextView) convertView.findViewById(R.id.event_list_dayTextView);
        TextView eventMonth = (TextView) convertView.findViewById(R.id.event_list_monthTextView);

        SimpleDateFormat simple_month = new SimpleDateFormat("Mmm", Locale.US);
        SimpleDateFormat simple_day = new SimpleDateFormat("dd", Locale.US);
        eventName.setText((String) feed.getData());
        eventMonth.setText(simple_month.format(feed.getTimeInMillis()));
        eventDay.setText(simple_day.format(feed.getTimeInMillis()));

        return convertView;
    }
}

Now from the screenshots here:

Calendar background can only be solid when I wanted to have a gradient as a background, the same as the selected date is a solid colour. enter image description here

The event list item looks like this(Trying to find a way to add the events dynamically by month): enter image description here

The ideal version should look something like this: enter image description here

Any suggestions would be appreciated.


Solution

  • To Do that in easy and fast way you just need to follow this git hub library which is much option to do your required functions.

    Link (https://github.com/mahimrocky/EventCalender)

    Bottom side will create in Recyler view as wel by using Database