how to show time in date time picker in flutter..? - flutter

Question

suppose you have a API and a key-value for this API is
"time": "22:05"
i want to show this time in a in a field and when i press the field the date time picker is pop up with time value and i change the time like 22:40 and the 22:05 will replace to 22:40
I have try this..
time = TimeOfDay.now();
final String hour = time.hour.toString().padLeft(2, '0');
final String minute = time.minute.toString().padLeft(2, '0');
GestureDetector(
onTap: () async {
TimeOfDay? pickTime = await showTimePicker(
context: context,
initialTime: time,
);
if (pickTime != null) {
setState(() => time = pickTime);
}
It always show my current system time

Answer 1

Here is a working example:
import 'package:flutter/material.dart';
const Color darkBlue = Color.fromARGB(255, 18, 32, 47);
void main() {
runApp(MyApp());
}
class MyApp extends StatelessWidget {
#override
Widget build(BuildContext context) {
return MaterialApp(
theme: ThemeData.dark().copyWith(
scaffoldBackgroundColor: darkBlue,
),
debugShowCheckedModeBanner: false,
home: Scaffold(
body: Center(
child: MyWidget(),
),
),
);
}
}
class MyWidget extends StatefulWidget {
const MyWidget({ super.key });
#override
State<MyWidget> createState() => _MyWidgetState();
}
class _MyWidgetState extends State<MyWidget> {
TimeOfDay? selectedTime;
#override
Widget build(BuildContext context) {
return
GestureDetector(
onTap : () async {
TimeOfDay? newTime = await showTimePicker(
initialTime: TimeOfDay.now(),
context: context,
);
setState((){
selectedTime = newTime;
});
},
child: Text(
selectedTime.toString(),
style: Theme.of(context).textTheme.headline4,
),
);
}
}

Answer 2

this is my usual way. with TextFormfied. so you can use validator if you need too.
TextFormField(
readOnly: true,
decoration: kInputDecor,
controller: _ctrl,
onTap: () async {
final selectedTime = await showTimePicker(
context: context,
initialTime: TimeOfDay.now(),
);
if (selectedTime != null) {
final String hour =
selectedTime.hour.toString().padLeft(2, '0');
final String minute =
selectedTime.minute.toString().padLeft(2, '0');
// _ctrl.text = selectedTime.format(context);
_ctrl.text = '${hour} :$minute';
}
},
),
result:
demo : https://dartpad.dev/?id=be4ccb0cad0930c9797bb4c2b63cd70e