I want to show my time on the TextField from the time that I select from the showTimePicker widget but I cannot figure out how will I display it on my box after picking a time Kindly help me out.
This is my screen without input on the Reminder section:
and this is what I want the output to be displayed under the Reminder section:
Code for Reminder is:
import 'package:epicare/Medicines.dart';
import 'package:flutter/material.dart';
import 'package:flutter_switch/flutter_switch.dart';
class AddMedicine extends StatefulWidget {
@override
_AddMedicineState createState() => _AddMedicineState();
}
class _AddMedicineState extends State<AddMedicine> {
final timeController = TextEditingController();
Widget build(BuildContext context) {
String value = "";
Size size = MediaQuery.of(context).size;
return Scaffold(
backgroundColor: Colors.white,
appBar: AppBar(),
body: SingleChildScrollView(
child: Column(
children: [
Container(
width: size.width,
padding: EdgeInsets.symmetric(horizontal: 34, vertical: 13),
child: Text(
'Reminder',
style: TextStyle(
fontFamily: 'Montserrat',
fontSize: 14,
color: const Color(0xff000000),
fontWeight: FontWeight.w600,
),
textAlign: TextAlign.left,
),
),
Container(
width: size.width * 0.85,
height: 52,
decoration: BoxDecoration(
borderRadius: BorderRadius.circular(6.0),
color: const Color(0xffffffff),
border: Border.all(width: 1.0, color: const Color(0xffdbe2ea)),
boxShadow: [
BoxShadow(
color: const Color(0x0a2c2738),
offset: Offset(0, 4),
blurRadius: 8,
),
],
),
child: TextField(
controller: timeController,
readOnly: true,
style: TextStyle(
fontFamily: 'Montserrat',
fontSize: 12,
color: const Color(0xff000000),
fontWeight: FontWeight.w500,
),
decoration: InputDecoration(
suffixIcon: IconButton(
onPressed: () async {
var time = await showTimePicker(
builder: (BuildContext context, Widget child) {
return Theme(
data: ThemeData.light().copyWith(
colorScheme: ColorScheme.dark(
primary: const Color(0xffE5E0A1),
onPrimary: Colors.black,
surface: Colors.white,
onSurface: Colors.black,
),
dialogBackgroundColor:Colors.white,
),
child: child,
);
},
context: context,
initialTime: TimeOfDay.now(),
//timeController.text = time.format(context)
);
print(time.format(context));
},
icon: Icon(
Icons.add_alert,
color: const Color(0xffd4d411),
),
),
contentPadding:
const EdgeInsets.symmetric(vertical: 18, horizontal: 20),
border: InputBorder.none,
hintText: "Add time(s) to eat your medicine",
hintStyle: TextStyle(
fontFamily: 'Montserrat',
fontSize: 13,
color: const Color(0xffcbd0d6),
),
),
onChanged: (text) {
value = text;
print(value);
},
),
),
],
),
),
);
}
}
All you need to do is move this line to outside of the showTimePicker
function.
timeController.text = time.format(context)
var time = await showTimePicker(
builder: (BuildContext context, Widget child) {
return Theme(
data: ThemeData.light().copyWith(
colorScheme: ColorScheme.dark(
primary: const Color(0xffE5E0A1),
onPrimary: Colors.black,
surface: Colors.white,
onSurface: Colors.black,
),
dialogBackgroundColor: Colors.white,
),
child: child,
);
},
context: context,
initialTime: TimeOfDay.now(),
//timeController.text = time.format(context) from here
); //end of showTimePicker
timeController.text = time.format(context); // to here
User contributions licensed under CC BY-SA 3.0