问题描述
我正在尝试开发一个小型应用程序以学习Dart和Flutter。 现在，我有一个带有图标的视图。当我单击此图标时，会出现一个带有日期选择器的警报框。 我选择一个日期，然后单击“确定”按钮后，应该回到上一个视图。 在第一个视图上，我有一个文本小部件。这个应该显示先前选择的日期。 我的问题是“文本”小部件无法显示正确的日期。我试图将setState添加到文本窗口小部件，但出现错误。
请参阅下面的代码源。 非常感谢。
import 'package:Flutter/cupertino.dart';
import 'package:Flutter/material.dart';
import 'cupertino DatePicker.dart';
import 'package:intl/intl.dart';
var myselectedDate;
class AddProject extends StatefulWidget {
@override
_AddProjectState createState() => _AddProjectState();
}
class _AddProjectState extends State<AddProject> {
final GlobalKey<FormState> _formState = GlobalKey<FormState>();
var gender;
@override
Widget build(BuildContext context) {
String projectName = "";
return Scaffold(
appBar: AppBar(
title: Text(
"Add Project",),actions: <Widget>[
Padding(
padding: EdgeInsets.only(right: 20.0),child: GestureDetector(
onTap: () {},child: Icon(
Icons.save,size: 26.0,)
),]
),floatingActionButton: FloatingActionButton(
child: Icon(
Icons.send,color: Colors.white,onpressed: () {
//if (_formState.currentState.validate()) {
// _formState.currentState.save();
// Navigator.pop(context,true);
}
//}
),body: ListView(
children: <Widget>[
Form(
child: Column(
children: [
//Field : Type project Name
Padding(
padding: const EdgeInsets.fromLTRB(8.0,8.0,1.0),child: TextFormField(
decoration: Inputdecoration(hintText: "Project Name"),maxLength: 200,maxLines: 2,validator: (value) {
return value.isEmpty ? "Project name cannot be empty" : null;
},onSaved: (value) {
projectName = value;
},//Start Date text
Container(
alignment: Alignment.topLeft,child: Padding(
padding: const EdgeInsets.fromLTRB(8.0,18.0,child: Text("Start Date",style: TextStyle(color: Colors.black87),)
),Row(
mainAxisAlignment: MainAxisAlignment.start,children: [
Padding(
padding: const EdgeInsets.fromLTRB(1.0,5.0,10.0),child: IconButton(
splashColor: Colors.lightGreenAccent,icon: Icon(Icons.calendar_today),//Image.asset('assets/icons/tag.png',//height: 30.0,//=============================
onpressed: () {
showDialog(
context: context,builder: (BuildContext context) {
return StatefulBuilder(
builder: (context,setState){
return AlertDialog(
title: Text('Choose Date'),content: DatePickerDemo(),actions: <Widget>[
FlatButton(
child: Text("Cancel",style: TextStyle(
color: Colors.grey,)),onpressed: () {
//selectedContext=false;
Navigator.of(context).pop();
},shape: new RoundedRectangleBorder(borderRadius: new BorderRadius.circular(30.0))
),FlatButton(
child: Text("OK",style: TextStyle(
color: Colors.blue,onpressed: () {
myselectedDate= DateFormat('dd MMMM,yyyy').format(selectedDate);
print ('test=' + myselectedDate.toString());
Navigator.of(context).pop();
},],);
});
},);
}
//=============================
),Text('test=' + myselectedDate.toString()),},key: _formState,);
}
}
import 'package:Flutter/material.dart';
import 'package:Flutter/cupertino.dart';
import '09_project_add.dart';
//var mySelectedDate = selectedDate;
DateTime selectedDate = DateTime.Now();
class DatePickerDemo extends StatefulWidget {
@override
_DatePickerDemoState createState() => _DatePickerDemoState();
}
class _DatePickerDemoState extends State<DatePickerDemo> {
/// Which holds the selected date
/// Defaults to today's date.
/// This decides which day will be enabled
/// This will be called every time while displaying day in calender.
bool _decideWhichDayToEnable(DateTime day) {
if ((day.isAfter(DateTime.Now().subtract(Duration(days: 1))) &&
day.isBefore(DateTime.Now().add(Duration(days: 10))))) {
return true;
}
return false;
}
_selectDate(BuildContext context) {
final ThemeData theme = Theme.of(context);
assert(theme.platform != null);
switch (theme.platform) {
case TargetPlatform.android:
case TargetPlatform.fuchsia:
case TargetPlatform.linux:
case TargetPlatform.windows:
return buildMaterialDatePicker(context);
case TargetPlatform.iOS:
case TargetPlatform.macOS:
return buildCupertinoDatePicker(context);
}
}
@override
Widget build(BuildContext context) {
return Scaffold(
body: Center(
child: Column(
mainAxisSize: MainAxisSize.min,children: <Widget>[
Text(
"${selectedDate.toLocal()}".split('/')[0],style: TextStyle(fontSize: 55,fontWeight: FontWeight.bold),SizedBox(
height: 20.0,RaisedButton(
onpressed: () => _selectDate(context),child: Text(
'Select date',style:
TextStyle(color: Colors.black,color: Colors.greenAccent,);
}
buildCupertinoDatePicker(BuildContext context) {
showModalBottomSheet(
context: context,builder: (BuildContext builder) {
return Container(
height: MediaQuery.of(context).copyWith().size.height / 3,child: CupertinoDatePicker(
mode: CupertinoDatePickerMode.date,onDateTimeChanged: (picked) {
if (picked != null && picked != selectedDate)
setState(() {
selectedDate = picked;
myselectedDate = selectedDate;
});
},initialDateTime: selectedDate,minimumYear: 2020,maximumYear: 2125,);
});
}
buildMaterialDatePicker(BuildContext context) async {
final DateTime picked = await showDatePicker(
context: context,initialDate: selectedDate,firstDate: DateTime(2020),lastDate: DateTime(2125),initialEntryMode: DatePickerEntryMode.calendar,initialDatePickerMode: DatePickerMode.day,selectableDayPredicate: _decideWhichDayToEnable,helpText: 'Select booking date',cancelText: 'Not Now',confirmText: 'Book',errorFormatText: 'Enter valid date',errorInvalidText: 'Enter date in valid range',fieldLabelText: 'Booking date',fieldHintText: 'Date/Month/Year',builder: (context,child) {
return Theme(
data: ThemeData.light(),child: child,);
},);
if (picked != null && picked != selectedDate)
setState(() {
selectedDate = picked;
});
}
}
解决方法
您需要在正确的位置使用setState。在这里：
onPressed: () {
setState(() {
myselectedDate= DateFormat('dd MMMM,yyyy').format(selectedDate);
});
print('test=' + myselectedDate.toString());
Navigator.of(context).pop();
},