How to get flutter date picker value to the textfield?when i click the text field it is pop up date picker after choosing date. i wanted to be that date in the textfield
also.
i want to customise the color of the date picker
onTap: () {
FocusScope.of(context).requestFocus(new FocusNode());
showDatePicker(
context: context,
initialDate: DateTime.now(),
firstDate: DateTime(2019, 1),
lastDate: DateTime(2021,12),
);
},
I fix your code as below (you can select date from DatePicker and you can customise theme of DatePicker):
import 'package:flutter/material.dart';
import 'package:intl/intl.dart';
class TestPickerWidget extends StatefulWidget {
@override
_TestPickerWidgetState createState() => _TestPickerWidgetState();
}
class _TestPickerWidgetState extends State<TestPickerWidget> {
DateTime _selectedDate;
TextEditingController _textEditingController = TextEditingController();
@override
Widget build(BuildContext context) {
return Scaffold(
body: Center(
child: TextField(
focusNode: AlwaysDisabledFocusNode(),
controller: _textEditingController,
onTap: () {
_selectDate(context);
},
),
),
);
}
_selectDate(BuildContext context) async {
DateTime newSelectedDate = await showDatePicker(
context: context,
initialDate: _selectedDate != null ? _selectedDate : DateTime.now(),
firstDate: DateTime(2000),
lastDate: DateTime(2040),
builder: (BuildContext context, Widget child) {
return Theme(
data: ThemeData.dark().copyWith(
colorScheme: ColorScheme.dark(
primary: Colors.deepPurple,
onPrimary: Colors.white,
surface: Colors.blueGrey,
onSurface: Colors.yellow,
),
dialogBackgroundColor: Colors.blue[500],
),
child: child,
);
});
if (newSelectedDate != null) {
_selectedDate = newSelectedDate;
_textEditingController
..text = DateFormat.yMMMd().format(_selectedDate)
..selection = TextSelection.fromPosition(TextPosition(
offset: _textEditingController.text.length,
affinity: TextAffinity.upstream));
}
}
}
class AlwaysDisabledFocusNode extends FocusNode {
@override
bool get hasFocus => false;
}
and also you must add Intl dependency in your pubspec.yaml :
dev_dependencies:
flutter_test:
sdk: flutter
intl: ^0.16.1
Finally call TestPickerWidget in your main for testing it.