CODEWITHSUNDEEP
flutterdart
Jagath Ratchagan
Jagath Ratchagan

Reputation: 545

Flutter: DateRangePicker with default material calender design

How to implement DateRangePicker with Default material calender design without using any packages

Upvotes: 1

Views: 1145

Answers (1)

Jagath Ratchagan
Jagath Ratchagan

Reputation: 545

By using showDateRangePicker()

Future selectDateRange(BuildContext context) async {
DateTimeRange pickedRange = await showDateRangePicker(
    context: context,
    initialDateRange: DateTimeRange(
      start: DateTime.now(),
      end: DateTime.now(),
    ),
    firstDate: DateTime.now(),
    lastDate: DateTime(DateTime.now().year + 2),
    helpText: 'Select Date Range',
    cancelText: 'CANCEL',
    confirmText: 'OK',
    saveText: 'SAVE',
    errorFormatText: 'Invalid format.',
    errorInvalidText: 'Out of range.',
    errorInvalidRangeText: 'Invalid range.',
    fieldStartHintText: 'Start Date',
    fieldEndLabelText: 'End Date');

if (pickedRange != null) {
  print(
      'picked range ${pickedRange.start} ${pickedRange.end} ${pickedRange.duration.inDays}');
}

}

then call it on onPressed

    RaisedButton(
                  onPressed: () {
                    selectDateRange(context);
                  },
                  child: Text('select range'),
                )

output

Upvotes: 1

Related Questions