Search code examples
androidcalendarview

How to make a calendar view with horizontal scrolling week view

I am trying to make a calendar view similar to this one. One with horizontal scrolling week view, and list of events below the selected date.

I have tried using this library https://github.com/prolificinteractive/material-calendarview but the appearance is not the same. The calendar consumes a lot of screen space since the day name and dates are so wide apart. How can I make similar like this one below?

Thank you

enter image description here

Solution

  • use this library,,, 

    compile 'devs.mulham.horizontalcalendar:horizontalcalendar:1.1.7'

    and this in xml 

      <devs.mulham.horizontalcalendar.HorizontalCalendarView
                            android:id="@+id/calendarView"
                            android:layout_width="match_parent"
                            android:layout_height="wrap_content"
                            android:background="#FAFAFA"
                            app:selectedDateBackground="#00ffffff"
                            app:selectorColor="#c62828"
                            app:textColorNormal="#bababa"
                            app:textColorSelected="@color/blue_color"
                            app:textSizeDayName="20sp"
                            app:textSizeDayNumber="20sp" />

    and here Java 

    private HorizontalCalendar horizontalCalendar;

   Calendar endDate = Calendar.getInstance();
        endDate.add(Calendar.MONTH, 1);
        Calendar startDate = Calendar.getInstance();
        startDate.add(Calendar.MONTH, -1);

        horizontalCalendar = new HorizontalCalendar.Builder(root, R.id.calendarView)
                .startDate(startDate.getTime())
                .endDate(endDate.getTime())
                .datesNumberOnScreen(5)
                .dayNameFormat("EEE")
                .dayNumberFormat("dd")
                .monthFormat("MMM")
                .textSize(14f, 24f, 14f)
                .showDayName(true)
                .showMonthName(true)

                .build();

        horizontalCalendar.setCalendarListener(new HorizontalCalendarListener() {
            @Override
            public void onDateSelected(Date date, int position) {
//                Toast.makeText(getContext(), DateFormat.getDateInstance().format(date) + " is selected!", Toast.LENGTH_SHORT).show();
            }

        });