Line data Source code
1 : part of apptive_grid_form_widgets;
2 :
3 : /// FormComponent Widget to display a [DateTimeFormComponent]
4 : class DateTimeFormWidget extends StatefulWidget {
5 : /// Creates a Widget to display and select a Date and a Time contained in [component]
6 : ///
7 : /// Clicking on the Date part will show a DatePicker using [showDatePicker]
8 : /// Clicking on the Time part will show a TimePicker using [showTimePicker]
9 3 : const DateTimeFormWidget({
10 : Key? key,
11 : required this.component,
12 3 : }) : super(key: key);
13 :
14 : /// Component this Widget should reflect
15 : final DateTimeFormComponent component;
16 :
17 2 : @override
18 2 : State<StatefulWidget> createState() => _DateTimeFormWidgetState();
19 : }
20 :
21 : class _DateTimeFormWidgetState extends State<DateTimeFormWidget> {
22 : final TextEditingController _dateController = TextEditingController();
23 : final TextEditingController _timeController = TextEditingController();
24 :
25 2 : @override
26 : Widget build(
27 : BuildContext context,
28 : ) {
29 8 : if (widget.component.data.value != null) {
30 1 : final dateFormat = DateFormat.yMd();
31 5 : final dateString = dateFormat.format(widget.component.data.value!);
32 2 : _dateController.text = dateString;
33 1 : final timeFormat = DateFormat.jm();
34 5 : final timeString = timeFormat.format(widget.component.data.value!);
35 2 : _timeController.text = timeString;
36 : }
37 2 : return FormField<DateTime>(
38 1 : validator: (input) {
39 3 : if (widget.component.required && input == null) {
40 1 : return ApptiveGridLocalization.of(context)!
41 4 : .fieldIsRequired(widget.component.property);
42 : } else {
43 : return null;
44 : }
45 : },
46 : autovalidateMode: AutovalidateMode.onUserInteraction,
47 2 : builder: (state) {
48 2 : final localization = ApptiveGridLocalization.of(context)!;
49 2 : return InputDecorator(
50 2 : decoration: InputDecoration(
51 8 : helperText: widget.component.options.description,
52 : helperMaxLines: 100,
53 : labelText:
54 14 : widget.component.options.label ?? widget.component.property,
55 2 : errorText: state.errorText,
56 : ),
57 2 : child: Row(
58 : crossAxisAlignment: CrossAxisAlignment.start,
59 2 : children: [
60 2 : Flexible(
61 2 : child: InkWell(
62 1 : onTap: () {
63 : final initialDate =
64 5 : widget.component.data.value ?? DateTime.now();
65 1 : showDatePicker(
66 : context: context,
67 : initialDate: initialDate,
68 1 : firstDate: DateTime.fromMillisecondsSinceEpoch(0),
69 1 : lastDate: DateTime.fromMillisecondsSinceEpoch(
70 1 : const Duration(days: 100000000).inMilliseconds,
71 : ),
72 2 : ).then((value) {
73 : if (value != null) {
74 1 : state.didChange(value);
75 2 : setState(() {
76 4 : widget.component.data.value = value;
77 : });
78 : }
79 : });
80 : },
81 2 : child: AbsorbPointer(
82 2 : child: TextField(
83 2 : controller: _dateController,
84 2 : decoration: InputDecoration(
85 2 : hintText: localization.dateTimeFieldDate,
86 : border: InputBorder.none,
87 : isDense: true,
88 : filled: false,
89 : contentPadding: EdgeInsets.zero,
90 : ),
91 : ),
92 : ),
93 : ),
94 : ),
95 2 : Flexible(
96 2 : child: InkWell(
97 1 : onTap: () {
98 : final initialDate =
99 5 : widget.component.data.value ?? DateTime.now();
100 1 : showTimePicker(
101 : context: context,
102 1 : initialTime: TimeOfDay.fromDateTime(initialDate),
103 2 : ).then((value) {
104 : if (value != null) {
105 2 : setState(() {
106 1 : final newDate = DateTime(
107 1 : initialDate.year,
108 1 : initialDate.month,
109 1 : initialDate.day,
110 1 : value.hour,
111 1 : value.minute,
112 1 : initialDate.second,
113 1 : initialDate.millisecond,
114 1 : initialDate.microsecond,
115 : );
116 4 : widget.component.data.value = newDate;
117 1 : state.didChange(newDate);
118 : });
119 : }
120 : });
121 : },
122 2 : child: AbsorbPointer(
123 2 : child: TextField(
124 2 : controller: _timeController,
125 2 : decoration: InputDecoration(
126 2 : hintText: localization.dateTimeFieldTime,
127 : isDense: true,
128 : filled: false,
129 : border: InputBorder.none,
130 : contentPadding: EdgeInsets.zero,
131 : ),
132 : ),
133 : ),
134 : ),
135 : ),
136 : ],
137 : ),
138 : );
139 : },
140 : );
141 : }
142 :
143 2 : @override
144 : void dispose() {
145 4 : _dateController.dispose();
146 2 : super.dispose();
147 : }
148 : }
|