header.jpg

Flutter widget form select a date in horizontal timeline with customizable styles.

Getting Started

You can use this package when you need to add a date picker that takes up little screen space, so we can always have it visible, and that facilitates use with one hand.

example.gif

Properties

PropertyTypeDescription
initialDateDateTimeInitial date selected
firstDateDateTimeFirst date available in calendar
lastDateDateTimeLast date available in calendar
selectableDayPredicateSelectableDayPredicateSignature for predicating dates for enabled date selections
onDateSelectedOnDateSelectedCallback to notify that a date has been selected
leftMargindoubleLeft margin to month and day list
monthColorColorColor for month list elements
dayColorColorColor for day list elements
activeDayColorColorColor for selected day text
activeBackgroundDayColorColorColor for selected day background
dotColorColorColor for top dots in select day
localeStringLocale string to get formatted date

Use example

You can review the example folder for a complete example of using the widget.

CalendarTimeline(
  initialDate: DateTime(2020, 4, 20),
  firstDate: DateTime(2019, 1, 15),
  lastDate: DateTime(2020, 11, 20),
  onDateSelected: (date) => print(date),
  leftMargin: 20,
  monthColor: Colors.blueGrey,
  dayColor: Colors.teal[200],
  activeDayColor: Colors.white,
  activeBackgroundDayColor: Colors.redAccent[100],
  dotsColor: Color(0xFF333A47),
  selectableDayPredicate: (date) => date.day != 23,
  locale: 'en_ISO',
)

Libraries

calendar_timeline