date_range_form_field
a flutter package for adding a daterange widget into a form. a date picker ux is provided by showdaterangepicker. the widget will accept inputdecoration or use the default from the app’s theme. additionally, the widget will accept a date format, defaulting to mm-dd-yyyy.
usage
this widget should be used like any other formfield within a form.
it is important to note that the firstdate and lastdate properties correspond to the first and last valid dates.
this widget must have a materialwidget ancestor, such as a materialapp
example
// import package
import 'package:flutter/material.dart';
import 'package:date_range_form_field/date_range_form_field.dart';
void main() {
runapp(new myapp());
}
class myapp extends statelesswidget {
@override
widget build(buildcontext context) {
return new materialapp(
home: myformfield(),
);
}
}
// make a form
class myformfield extends statefulwidget {
@override
_myformfieldstate createstate() => _myformfieldstate();
}
globalkey myformkey = new globalkey();
class _myformfieldstate extends state<myformfield> {
datetimerange mydaterange;
void _submitform() {
final formstate form = myformkey.currentstate;
form.save();
}
@override
widget build(buildcontext context) {
return scaffold(
appbar: appbar(
title: text("date range form example"),
),
body: safearea(
child: form(
key: myformkey,
child: column(
children: [
safearea(
child: daterangefield(
context: context,
decoration: inputdecoration(
labeltext: 'date range',
prefixicon: icon(icons.date_range),
hinttext: 'please select a start and end date',
border: outlineinputborder(),
),
initialvalue: datetimerange(
start: datetime.now(), end: datetime.now()),
validator: (value) {
if (value.start.isbefore(datetime.now())) {
return 'please enter a valid date';
}
return null;
},
onsaved: (value) {
setstate(() {
mydaterange = value;
});
}),
),
flatbutton(
child: text('submit'),
onpressed: _submitform,
),
if(mydaterange != null) text("saved value is: ${mydaterange.tostring()}")
],
),
),
),
);
}
}
Comments are closed.