m3uzz / date_time_picker Goto Github PK

try to enable date-time selection in ar locale,
date part is localized and time part still in en locale, which causes an exception in formatting

When I update flutter to latest beta Flutter (Channel beta, 1.25.0-8.1.pre), I got error when compiling because not resolvable package dependency version.

Because date_time_picker 1.1.0 depends on flutter_localizations any from sdk which depends on intl 0.17.0-nullsafety.2, date_time_picker 1.1.0 requires intl 0.17.0-nullsafety.2.
And because date_time_picker 1.1.0 depends on intl ^0.16.1, date_time_picker 1.1.0 is forbidden.
So, because no versions of date_time_picker match >1.1.0 <2.0.0 and pulih_skizo_mobile depends on date_time_picker ^1.1.0, version solving failed.
pub get failed (1; So, because no versions of date_time_picker match >1.1.0 <2.0.0 and pulih_skizo_mobile depends on date_time_picker ^1.1.0, version solving failed.)

I think just loose the dependency version will resolve the problem like this

intl: ">=0.16.0 <=0.17.0-nullsafety.2"

Hi,

I am trying to get rid of that round clock time picker style (you have icon at the bottom for time entry by hand) but i cannot find any property to enable that manual input by default

I would like to have this by default:

When I set the initialValue of the field to be the empty string, and lastDate in the past, when I try to open the date picker, I get an exception because date time picker is opened with DateTime.now() as a default, which breaks the assertion that initial date must be before lastDate. It would be better to add a initialDatePickerDate field for that purpose so that we can keep initial value empty and still work with date time picker dialog properly.

When selected 12:00 in the time picker it displays AM or PM based on selected but when coverting to Timestamp via JS it displays it has AM always****

I tried
validator: (val) {
DateTime fDate = DateTime.parse(val);
print(fDate.weekday);
if(fDate.weekday == 1){
return 'false';
}
return null;
}

But i didn't got the print value.

i can't use DateInput with local('ar') it get invalid format
and can't select date in calendar mode it get null exception

Error Message:Try correcting the name to the name of an existing method, or defining a method named 'DateTimePicker'.
DateTimePicker(
^^^^^^^^^^^^^^

E/flutter (16941): [ERROR:flutter/lib/ui/ui_dart_state.cc(199)] Unhandled Exception: LocaleDataException: Locale data has not been initialized, call initializeDateFormatting().
E/flutter (16941): #0 UninitializedLocaleData._throwException
package:intl/src/intl_helpers.dart:80
E/flutter (16941): #1 UninitializedLocaleData.containsKey
package:intl/src/intl_helpers.dart:74
E/flutter (16941): #2 DateFormat.localeExists
package:intl/…/intl/date_format.dart:834
E/flutter (16941): #3 verifiedLocale
package:intl/src/intl_helpers.dart:159
E/flutter (16941): #4 new DateFormat
package:intl/…/intl/date_format.dart:266
E/flutter (16941): #5 _DateTimePickerState.set12HourTimeValues
package:date_time_picker/date_time_picker.dart:762
E/flutter (16941): #6 _DateTimePickerState._showDateTimePickerDialog
package:date_time_picker/date_time_picker.dart:875
E/flutter (16941):
E/flutter (16941):

This post on SO shows a time picker very similar to the time picker in this flutter library:

https://stackoverflow.com/a/65441149/1279002

The nice feature of the SO post is being able to select the time in blocks, say only 5 mins, or 10, or 15 or 20...
The time picker in the SO nicely greys out the minute options that are not available.

This date time picker already has a selectableDayPredicate. It would be nice to be able to have a predicate for hours and minutes.

Use case:

UPDATE
After further consideration the use case should also involve the date picker:

A hair salon has different opening hours depending on the day. Most days they are opened between 09:00 and 17:00. They have a late night on a Thursday 09:00 - 20:00 and finish early on a Saturday, 08:30 to 16:00.

To allow a booking slot to be made, the picker should only offer the hours dependant on the day that was selected in the date picker, so say if the date selected was a Thursday, the hours avaliable would be 09:00 - 20:00. Time slots are every 20 minutes, so the time picker should only offer, 00, 20 and 40 minutes to be selected.

": Warning: Operand of null-aware operation '??' has type 'Color' which excludes null.
../…/lib/flutter_datetime_picker.dart:311

• 'Color' is from 'dart:ui'.
  color: theme.backgroundColor ?? Colors.white,"

field already has default set in constructor:
" this.backgroundColor = Colors.white,"

creates annoying warning in debugger

How can i reduce the space of the date picker? it takes all the page. I would like to center it and to wrap it around the date, is there a parameter to do so?
Thank you.

I'm using DateTimePicker with type datetime. It was working fine but after upgrading flutter date stop changing. When I choose type only to date it works but when i chosse datetime date does not change but time changes.

how i can change the size of it?

The controller is not changed and has no effect at all

how can I set padding or margin ? I want to customize datetimepicker button

I was converting the 24 hours format to 12 hours but wasn't able to do that

Because no versions of date_time_picker match >1.1.1 <2.0.0 and date_time_picker 1.1.1 depends on intl ^0.16.1, date_time_picker ^1.1.1 requires intl ^0.16.1.
And because every version of flutter_localizations from sdk depends on intl 0.17.0, date_time_picker ^1.1.1 is incompatible with flutter_localizations from sdk.
So, because imperuim_plus depends on both flutter_localizations any from sdk and date_time_picker ^1.1.1, version solving failed.
pub get failed (1; So, because imperuim_plus depends on both flutter_localizations any from sdk and date_time_picker ^1.1.1, version solving failed.)

In de documentation, it states to add a dependency on:

icon_picker: ^1.0.0

This should be:

date_time_picker: ^1.0.0

The AM / PM will disappear when Opening the DateTimePicker and Tapping "OK" button without changing time time.

Step to replicate:

1. Open date time picker
2. Select a Date and time "5:00 AM"
3. Close the picker
4. Open Picker
5. Set the selected date time from previous selection as initial date
6. Picker shows "5:00 AM"
7. Tap "OK" button
8. Picker shows "5:00"

I got error when I try to use locale :(

Hi,

https://pub.dev/packages/date_time_picker shows the License as unknown. Can a standard license permitting commercial use be used for the library?

I am using Flutter 2.5.0 version.

I have setup this package in my project and there is a big problem for me that I am not able to change it's theme/colors.

There is no attribute / option to manage color/theme of background color or text color in popup of date picker and time picker?

Kindly help and share your suggestion, if any. Thanks a lot.

I am trying initialize the date_time_picker with the following parameters:
type: DateTimePickerType.date
initialTime: null
initialDate: 1972-11-30 00:00:00.000
initialValue: 11/30/1972

locale is "en_US".

Expected outcome:
I am expecting it to initialize with '11/30/1972' in the input field.

Actual outcome:
Instead, it initializes with todays date.

Hi. Could you, please, answer me if it is possible to convert time and date to unix time with this plugin?

I have noticed that there is no option to manage styles, foreground, background, text color options. Kindly add them to make this package good.

I am facing lots of issues in Dark theme related to colors. Please check and update it. Thanks a lot.

After setting the timeFormat to 12hrs the time went back to 24HRS after the user has picked a time.

Here is the code:

 DateTimePicker(
      type: DateTimePickerType.dateTimeSeparate,
      dateMask: 'd MMM, yyyy',
      locale: Locale('en', 'US'),
      initialValue: DateTime.now().toString(),
      firstDate: DateTime.now(),
      lastDate: DateTime.now().add(Duration(days: 365)),
      icon: Icon(Icons.time_to_leave),
      dateLabelText: 'Pick Up Date',
      autovalidate: true,
      timeLabelText: "Pick Up Time",
      onChanged: (val){

      },
      onSaved: (val) => print(val),
    );

I'm using a DateTimePicker with type: DateTimePickerType.dateTimeSeparate.

When tapping on the time field a time picker dialog opens with the current time.
Pressing OK closes the dialog but does not fill the text field with a time value.

This behavior does work correctly for the date picker, but not for the time picker.

When setting firstDate to a value after the current date and the initialValue is null, this error is shown:
!initialDate.isBefore(firstDate)
I have looked in the code and it is because a null initialValue will set initialDate to current date, eg.:
line 717: initialDate: _dDate ?? DateTime.now(),

Solution:
The internal initialDate should be set to firstDate if initialValue is null.

EDIT:
I've looked further in the code, and there seems to be a parameter named "initialDate" on the DateTimePicker.
This would solve my issue, given that setting "initialDate" still leaves the textfield empty.
However, I cannot use this parameter in my code, despite having the latest version.
Is this parameter a bug fix that simply hasn't been released yet?

DateTimePicker with the following type: DateTimePickerType.time
will not use multiple parameters. One example being the calendarTitle

For now I'm doing it this way, but it doesn't look very good because it keeps blinking all the time, someone has a better solution

Here's the sample code.

`class _FormBuilderDatePickerFieldState extends State {

String? seletedDate;
FocusNode dateTimePickerFocusNode = new FocusNode();
FocusNode textFormFieldFocusNode = new FocusNode();

@OverRide
void initState() {
super.initState();
}

@OverRide
Widget build(BuildContext context) {
return Column(
children: [
DateTimePicker(
type: DateTimePickerType.date,
dateMask: 'MMMM d, yyyy',
//initialValue: DateTime.now().toString(),
focusNode: dateTimePickerFocusNode,
initialValue: seletedDate,
firstDate: DateTime(1940),
lastDate: DateTime(2100),
decoration: InputDecoration(
labelText: widget.labelText,
hintText: 'Select a date',
),
onChanged: (val) {
seletedDate = val;
},
validator: widget.validator,
onSaved: (val) => print(val)
),
TextFormField(
decoration: InputDecoration(
border: UnderlineInputBorder(),
labelText: 'First Text Box'
),
focusNode: textFormFieldFocusNode,
),
SizedBox(height: 1000),
TextFormField(
decoration: InputDecoration(
border: UnderlineInputBorder(),
labelText: 'Last Text Box'
),
),
RaisedButton(
child: Text('Focus to DateTimePicker'),
onPressed: () {
dateTimePickerFocusNode.requestFocus();
},
),
RaisedButton(
child: Text('Focus to TextFormfield'),
onPressed: () {
textFormFieldFocusNode.requestFocus();
},
),
],
);
}
}`

So basically I created 3 fields (1Datetime picker and a textfields) and 2 buttons that each triggers the focus for DateTimePicker and TextField. Triggering the requestFocus() for DateTimePicker only highlights the field but does not scroll the view. Scroll focus works in the text field.

I have 2 controller for each DatePicker field in StatelessWidget:

  final dateStartController = TextEditingController();  
  final dateEndController = TextEditingController();

then i put clear button to clear its TextField value

Stack(
  children; [
    DateTimePicker(
        controller: dateStartController, // last picked date (doesn't clear after trigger IconButton)
        ...
    )    
    IconButton(
        icon: Icon(Icons.clear, size: 18, color: Colors.black38,),
            onPressed: () {
            dateStartController.clear(); // clear its value but not for its TextField
            log(dateStartController.text, name: 'DATE_START'); // empty
        },
    )
  ]
);

this is what it looks like

dateStartController.clear(); clear its value but not for its TextField. should i use Stateful?

date_time_picker ^2.0.1 which doesn't match any versions, version solving failed.
pub get failed (1; Because webanxo depends on date_time_picker ^2.0.1 which doesn't match any versions, version solving failed.)

Hi,

Thanks for this package. Very good and highly customizable.

How change default theme of blue color to other color and also how to remove edit button ?

If possible, please do date time picker as a widget instead of opening like popup.

It is possible to use it in Persian

I have a time picker and trying to clear text inside by using

_timeController.clear();

it has no effect. However _timeController.text = '12:45'; works fine. I alsohave tried _timeController.text = ''; but also no effect:

My setup:

DateTimePicker(
                          controller: _timeController,
                          type: DateTimePickerType.time,
                          firstDate: DateTime.now(),
                          lastDate: DateTime(2100),
                          icon: Icon(Icons.access_time),
                          timeLabelText: AppLocalizations.translate(TranslationKeys.shared, 'time_text'),
                          onChanged: (value) {
                            _timeController.text = value;
                          },
                          validator: (value) {
                            return null;
                          },
                        ))

The demo code on the offical pub.dev report the following error:

════════ Exception caught by widgets library ═══════════════════════════════════
The following assertion was thrown building _Head(dirty):
Assertion failed:
../…/lib/date_time_picker.dart:208
type == DateTimePickerType.time || firstDate != null
is not true

A copy-paste of the demo code:

DateTimePicker(
  initialValue: '',
  firstDate: DateTime(2000),
  lastDate: DateTime(2100),
  dateLabelText: 'Date',
  onChanged: (val) => print(val),
  validator: (val) {
    print(val);
    return null;
  },
  onSaved: (val) => print(val),
);

My runtime:

> flutter --version
Flutter 2.2.1 • channel stable • https://github.com/flutter/flutter.git
Framework • revision 02c026b03c (2 weeks ago) • 2021-05-27 12:24:44 -0700
Engine • revision 0fdb562ac8
Tools • Dart 2.13.1

Any idea?

This happens when 24hr mode is disabled, text returns in 12hr Mode which cannot be parsed

How do I set a value to the DateTimePicker from the outside?
I used setState() to set the initialValue but it hasn't changed.

Thanks for any help.

I've use24hours: false and yet I see 24hrs format in the text field. How do I fix this?

I am using the 12 Hr Format and would like to also capture AM and PM. Currently it only returns the time. Here's my code:

                     DateTimePicker(
                          type: DateTimePickerType.time,
                          use24HourFormat: false,
                          locale: Locale('pt', 'BR'),
                          icon: Icon(Icons.access_time),
                          timeLabelText: "Choose Opening Time",
                
                          onChanged: (val) => storeTiming.startTime = val,
                          validator: (val) {
                            print(val);
                            return null;
                          },
                          onSaved: (val) => storeTiming.startTime = val,
                        ),

What am I missing?

Donn't seem to be a method for clearing the field after a date has been selected.

Hi!

I just want to know if there is a possibility if I add a mask like this "##/##/####"

Thanks

I'm using this config
DateTimePicker( type: DateTimePickerType.dateTime, dateMask: 'd MMMM, yyyy - hh:mm a', controller: _controller2, firstDate: DateTime(2000), lastDate: DateTime(2100), dateLabelText: 'Date Time', use24HourFormat: false, locale: Locale('en', 'US'), ),
when i set the time to 9:00AM and i want to change it to 9:00PM it's not working it still AM

1)create a test project

2)add flutter_localizations and date_time_picker to pubspec.yaml

dependencies:
  flutter:
    sdk: flutter
  flutter_localizations:
    sdk: flutter

  cupertino_icons: ^1.0.2
  date_time_picker: ^1.1.1

3. after running flutter pub get, error occured:

[test_date_time_picker] flutter pub get
Running "flutter pub get" in test_date_time_picker...           
Because no versions of date_time_picker match >1.1.1 <2.0.0 and date_time_picker 1.1.1 depends on intl ^0.16.1, date_time_picker ^1.1.1 requires intl ^0.16.1.

And because every version of flutter_localizations from sdk depends on intl 0.17.0-nullsafety.2, date_time_picker ^1.1.1 is incompatible with flutter_localizations from sdk.

So, because test_date_time_picker depends on both flutter_localizations any from sdk and date_time_picker ^1.1.1, version solving failed.
pub get failed (1; So, because test_date_time_picker depends on both flutter_localizations any from sdk and date_time_picker ^1.1.1, version solving failed.)
exit code 1

4)when starting the test app, error occured:

Running "flutter pub get" in test_date_time_picker...
Because no versions of date_time_picker match >1.1.1 <2.0.0 and date_time_picker 1.1.1 depends on intl ^0.16.1, date_time_picker ^1.1.1 requires intl ^0.16.1.
And because every version of flutter_localizations from sdk depends on intl 0.17.0-nullsafety.2, date_time_picker ^1.1.1 is incompatible with flutter_localizations from sdk.
So, because test_date_time_picker depends on both flutter_localizations any from sdk and date_time_picker ^1.1.1, version solving failed.
pub get failed (1; So, because test_date_time_picker depends on both flutter_localizations any from sdk and date_time_picker ^1.1.1, version solving failed.)
Exited (1)