Horizontal scrollable calendar view

Question

I want to create horizontally scrollable calendar view like below image.

I have got some thirdparty libraries to create calendar view, but all those supports only normal calendar. I want minimized version of the calendar in horizontally scrollable and on click of a date the content should be updated.

Answer 1

This is an old post but I want to share my findings

This library offers great customization, is written in Kotlin and support SDK >=21

SingleRowCalendar GitHub

And check this Medium post for a step-by-step guide.

Here are some sample UIs you can easily produce

Answer 2

You can try this great https://github.com/Mulham-Raee/Horizontal-Calendar , it has everything you need.

Here is an example of use

First add this to your xml file

<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" />

Then is your activity declare an instance of HorizontalCalendar

private HorizontalCalendar horizontalCalendar;

Fianally the java code

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();
        }

      });