DatePicker

A text-field-styled date picker that opens Flutter's own date picker dialog, with an optional time component.

View source on GitHub ↗

FBDatePicker.outlined(
  selectedDate: date,
  onDateChanged: (d) => setState(() => date = d),
  hintText: 'Select date',
);

CLI

Install this component into your project:

date-picker

$flutter_beautify add date-picker

Variants

FBDatePicker.outlined() · FBDatePicker.filled()

Key parameters

Parameter	Type	Default
selectedDate	DateTime?	—
onDateChanged	ValueChanged<DateTime?>?	—
firstDate / lastDate	DateTime?	—
hintText / labelText	String	'Select date' / ''
showTime	bool	false — adds a time component

Usage

import 'package:your_app/widgets/date_picker.dart';

FBDatePicker.outlined(
  selectedDate: dueDate,
  onDateChanged: (d) => setState(() => dueDate = d),
  showTime: true,
);