A date time picker form field
class MyApp extends StatelessWidget {
final String title;
final DateTime initialDateTime;
MyApp({Key key, this.title, this.initialDateTime}) : super();
// This widget is the root of your application.
@override
Widget build(BuildContext context) {
return MaterialApp(
title: 'DateTimeFormField Demo',
theme: ThemeData(
primarySwatch: Colors.blue,
),
home: MyHomePage(
title: title ?? 'Home Page',
initialDateTime: initialDateTime ?? DateTime.now(),
),
);
}
}
class MyHomePage extends StatefulWidget {
MyHomePage({Key key, @required this.title, @required this.initialDateTime})
: super(key: key);
final String title;
final DateTime initialDateTime;
@override
_MyHomePageState createState() => _MyHomePageState();
}
class _MyHomePageState extends State<MyHomePage> {
GlobalKey<FormState> _formKey;
DateTime _dateTime;
@override
void initState() {
_formKey = GlobalKey<FormState>();
super.initState();
}
@override
Widget build(BuildContext context) {
return Scaffold(
appBar: AppBar(
title: Text(widget.title),
),
body: Padding(
padding: const EdgeInsets.all(16.0),
child: Form(
key: _formKey,
child: Column(
children: <Widget>[
DateTimeFormField(
initialValue: widget.initialDateTime,
label: "Date Time",
validator: (DateTime dateTime) {
if (dateTime == null) {
return "Date Time Required";
}
return null;
},
onSaved: (DateTime dateTime) => _dateTime = dateTime,
),
Spacer(),
Padding(
padding: const EdgeInsets.all(16.0),
child: RaisedButton(
child: Text("Submit"),
onPressed: () {
if (_formKey.currentState.validate()) {
_formKey.currentState.save();
showDialog(
context: context,
builder: (BuildContext context) {
return AlertDialog(
title: Text("Date Time"),
content: Text(_dateTime.toIso8601String()),
);
},
);
}
},
),
),
],
),
),
),
);
}
}
initialValue - The intial date time, default value is 'DateTime.now()'
label - The label of form field, default value is 'Date Time'
onlyDate - Only show and edit date, default value is false
onlyTime - Only show and edit time, default value is false. onlyDate and onlyTime cannot be set to true at the same time.
formatter - The format of displaying date time in form field, default value is 'DateFormat("EE, MMM d, yyyy h:mma")' in date and time mode, 'DateFormat("EEE, MMM d, yyyy")' in date only mode, 'DateFormat("h:mm a") in time only mode
autovalidate - Whether validate every time, default value is false
validator - Validate function of form field
onSaved - Save value function of form field
Notice DateTimeFormField must has Material Widget ancestor such as MaterialApp