Flutter - Text Field display date after date picked - flutter

Question

I am basically trying to create a signup screen for my app. I have already included all of the other TextFormField for the other data. However, I am now stuck on the date input section, I managed to create a TextFormField wrapped in a GestureDetector where it will open a date picker to select a date once the TextFormField is tapped. My problem is I want to set the value of the the date TextFormField with the date selected in the date picker, I don't know why with the code that I have it is very inconsistent, at times it does display the date and other times it doesn't update and keeps showing the hintText, and also since there is a date picker popping up when the field is tapped, how could I disable the keyboard from showing when focusing on the date field.
class DateState extends StatefulWidget {
const DateState({
Key key,
}) : super(key: key);
#override
_DateState createState() => _DateState();
}
class _DateState extends State<DateState> {
DateTime selectedDate = DateTime.now();
Future<Null> _selectDate(BuildContext context) async {
final DateTime picked = await showDatePicker(
context: context,
initialDate: selectedDate,
firstDate: DateTime(1950),
lastDate: DateTime.now());
if (picked != null && picked != selectedDate)
setState(() {
selectedDate = picked;
});
}
#override
Widget build(BuildContext context) {
var dateValue = TextEditingController();
return DateFieldContainer(
child: GestureDetector(
child: TextFormField(
controller: dateValue,
onTap: () {
_selectDate(context);
dateValue.text = "${selectedDate.toLocal()}".split(' ')[0];
},
decoration: InputDecoration(
hintText: "Select Date",
focusedBorder: UnderlineInputBorder(
borderSide: BorderSide(color: PrimaryColor),
),
),
),
),
);
}
}

Answer 1

Just replace your _selectDate() with below code.
void _selectDate(){
showDatePicker(
context: context,
initialDate: selectedDate,
firstDate: DateTime(1950),
lastDate: DateTime.now(),
).then((pickedDate) {
if (pickedDate == null) {
return;
}
setState(() {
selectedDate = pickedDate;
dateValue.text = "${selectedDate.toLocal()}".split(' ')[0];
});
});
}
Replace your onTap() implementation with below code
onTap: () {
_selectDate();
}
Keep var dateValue = TextEditingController(); outside build() method.