date_time_picker icon indicating copy to clipboard operation
date_time_picker copied to clipboard

fix inconsistent time format

Open sxtfv opened this issue 3 years ago • 5 comments

This PR fixes inconsistent time formats when use DateTimePickerType.time with 12 hour format. In current version, inputs will show time in format HH;mm a until you edit it manually. So, when you use widget like this:

late TextEditingController _timeController;
...
final now = DateTime(2021, 07, 15, 13, 0, 0);
final hours = DateFormat('HH').format(now);
final minutes = DateFormat('mm').format(now);
_timeController = TextEditingController(text: '$hours:$minutes');
...
DateTimePicker(
    type: DateTimePickerType.time,
    controller: _timeController,
    firstDate: DateTime(2000),
    lastDate: DateTime(2100),
    use24HourFormat: false,
    locale: Locale('en', 'US'),
    decoration: InputDecoration(
        border: OutlineInputBorder(
            borderRadius: BorderRadius.circular(4),
            borderSide: BorderSide(
                width: 2.0,
                color: Colors.black,
            ),
        ),
        floatingLabelBehavior: FloatingLabelBehavior.always,
        labelText: 'Time',
        suffixIcon: Icon(Icons.access_time),
    ),
),

It will be shown like this when screen loaded image when you pick another time and click 'OK' label will be shown like this: image Also, when you use controller with current plugin version - it's text may be different based on - did you select another time or not. That's why I call _effectiveController?.text = _sTime + _sPeriod; in initValues() Also, it will throw an exception when you try to pass a controller like this:

final now = DateTime(2021, 07, 15, 13, 0, 0);
final hours = DateFormat('hh').format(now);
final minutes = DateFormat('mm').format(now);
_timeController = TextEditingController(text: '$hours:$minutes PM');

this PR fixes it as well

sxtfv avatar Jul 15 '21 08:07 sxtfv

I applied your fix and I can now see the AM and PM on the UI when I choose time. However, the value in onchanged or onsaved is captured without AM or PM. Here's my code:

DateTimePicker(
                             type: DateTimePickerType.time,
                             use24HourFormat: false,
                             locale: Locale('en', 'US'),
                             icon: Icon(Icons.access_time),
                             decoration: InputDecoration(
                             border: OutlineInputBorder(
                                 borderRadius: BorderRadius.circular(4),
                                 borderSide: BorderSide(
                                     width: 4.0,
                                     color: Colors.black,
                                 ),
                             ),
                              floatingLabelBehavior: FloatingLabelBehavior.always,
                             labelText: 'Opening Time',
                             suffixIcon: Icon(Icons.access_time),
                         ),
                             
                             onChanged: (val) => storeTiming.startTime = val,
                             validator: (val) {
                               print(val);
                               return null;
                             },
                             onSaved: (val) => storeTiming.startTime = val,
                           ),

iesmail-znz avatar Jul 15 '21 17:07 iesmail-znz

@iesmail-znz Thanks for checking, I'll take a look. Could you please try to pass a controller as I shown in my example and check it's text? Sure that it works this way

sxtfv avatar Jul 16 '21 12:07 sxtfv

@iesmail-znz I've pushed a fix and checked with your configuration - looks good now. Could you please confirm?

sxtfv avatar Jul 19 '21 08:07 sxtfv

I'm having the same problem @iesmail-znz has with the onChanged and onSaved. Is this gonna be merge/fix any time soon?

lozdan avatar Sep 18 '21 04:09 lozdan

I'm trying to print AM PM in console or inside a string but i can only be able to get the time but without AM PM, but in the ui i can able to see AM PM

divyanshu2345 avatar Jun 27 '22 10:06 divyanshu2345