在我的应用程序中,用户需要手动选择任务时间,但我不知道在flutter应用程序中使用时间选择器并由用户手动选择(一天的)时间的正确方法是什么。
首先在类级别声明这个变量,
TimeOfDay selectedTime = TimeOfDay.now();
然后调用这个方法:
Future<void> _selectTime(BuildContext context) async {
final TimeOfDay? pickedTime = await showTimePicker(
context: context,
initialTime: selectedTime, builder: (BuildContext context, Widget child) {
return MediaQuery(
data: MediaQuery.of(context).copyWith(alwaysUse24HourFormat: false),
child: child,
);});
if (pickedTime != null && pickedTime != selectedTime )
setState(() {
selectedTime = pickedTime;
});
}
此代码将显示一个包含材料设计时间选择器的对话框。
请注意,
showTimePicker
是未来。因此,您需要使用 await
来获取时间。
TimeOfDay initialTime = TimeOfDay.now();
TimeOfDay pickedTime = await showTimePicker(
context: context,
initialTime: initialTime,
);
此外,您可以使用
builder
中的
showTimePicker
属性自定义时间选择器
TimeOfDay initialTime = TimeOfDay.now();
TimeOfDay pickedTime = await showTimePicker(
context: context,
initialTime: initialTime,
builder: (BuildContext context, Widget child) {
return Directionality(
textDirection: TextDirection.rtl,
child: child,
);
},
);
要了解更多信息,请参阅官方文档。
零安全
TimeOfDay selectedTime = TimeOfDay.now();
功能
Future<void> _selectTime(BuildContext context) async {
final TimeOfDay? picked_s = await showTimePicker(
context: context,
initialTime: selectedTime, builder: (BuildContext context, Widget? child) {
return MediaQuery(
data: MediaQuery.of(context).copyWith(alwaysUse24HourFormat: false),
child: child!,
);});
if (picked_s != null && picked_s != selectedTime )
setState(() {
selectedTime = picked_s;
});
}
致电
_selectTime(context);
您可以使用 flutter_datetime_picker 插件:
FlatButton(
onPressed: () {
DatePicker.showDatePicker(context,
showTitleActions: true,
minTime: DateTime(2018, 3, 5),
maxTime: DateTime(2019, 6, 7), onChanged: (date) {
print('change $date');
}, onConfirm: (date) {
print('confirm $date');
}, currentTime: DateTime.now(), locale: LocaleType.zh);
},
child: Text(
'show date time picker (Chinese)',
style: TextStyle(color: Colors.blue),
));
class CustomPicker extends CommonPickerModel {
String digits(int value, int length) {
return '$value'.padLeft(length, "0");
}
CustomPicker({DateTime currentTime, LocaleType locale}) : super(locale: locale) {
this.currentTime = currentTime ?? DateTime.now();
this.setLeftIndex(this.currentTime.hour);
this.setMiddleIndex(this.currentTime.minute);
this.setRightIndex(this.currentTime.second);
}
@override
String leftStringAtIndex(int index) {
if (index >= 0 && index < 24) {
return this.digits(index, 2);
} else {
return null;
}
}
@override
String middleStringAtIndex(int index) {
if (index >= 0 && index < 60) {
return this.digits(index, 2);
} else {
return null;
}
}
@override
String rightStringAtIndex(int index) {
if (index >= 0 && index < 60) {
return this.digits(index, 2);
} else {
return null;
}
}
@override
String leftDivider() {
return "|";
}
@override
String rightDivider() {
return "|";
}
@override
List<int> layoutProportions() {
return [1, 2, 1];
}
@override
DateTime finalTime() {
return currentTime.isUtc
? DateTime.utc(currentTime.year, currentTime.month, currentTime.day,
this.currentLeftIndex(), this.currentMiddleIndex(),
this.currentRightIndex())
: DateTime(currentTime.year, currentTime.month, currentTime.day,
this.currentLeftIndex(),
this.currentMiddleIndex(), this.currentRightIndex());
}
}
您可以将其用于 flutter 中的时间选择器
Future<void> _selectTime(BuildContext context) async {
TimeOfDay? picked = await showTimePicker(
context: context,
initialTime: TimeOfDay.now(), builder: (BuildContext context, Widget child) {
return MediaQuery(
data: MediaQuery.of(context).copyWith(alwaysUse24HourFormat: false),
child: child,
);});
if (picked != null && picked != TimeOfDay.now() )
}