Thursday, March 28, 2024

Flutter Calendar Strip Widget

Easy to use and beautiful calendar strip component for Flutter.

Install

dependencies:
          ...
          calendar_strip: ^1.0.6

Usage Example

Container(
  child: CalendarStrip(
    startDate: startDate,
    endDate: endDate,
    onDateSelected: onSelect,
    dateTileBuilder: dateTileBuilder,
    iconColor: Colors.black87,
    monthNameWidget: _monthNameWidget,
    markedDates: markedDates,
    containerDecoration: BoxDecoration(color: Colors.black12),
  ))

DateBuilder Widget Method Usage

MonthName Widget Method Usage

Full Example

Widget Properties

Initial data and onDateSelected handler

PropDescriptionTypeDefault
startDateDate to be used for setting starting date in a date range.DateTime
endDateDate to be used for setting ending date in a date range.DateTime
selectedDateDate to be used for setting a date as pre-selected instead of current Date.DateTime
markedDatesList of DateTimes to be marked in UI. It is also passed as parementer in dateTileBuilder method,List<DateTime>
iconColorIcon colors of both Left and Right Chevron Icons.ColorColors.black87
containerHeightThe Height of the calendar strip.int90
containerDecorationBox Decoration object styling the container for more custom styling.BoxDecoration
monthNameWidgetFunction that returns a custom widget for rendering the name of the current month.Function
dateTileBuilderFunction that returns a custom widget for rendering the name of the current monthFunction
onDateSelectedFunction that is called on selection of a date. (Required)FunctionRequired
addSwipeControlBoolean that is used to turn on or off swipe control on the calendar stripBoolean