如何解决Flutter中的TextField状态管理
我正在尝试创建一个记事应用。我在使用带前缀图标的文本字段，我的问题是，如果用户在文本字段中键入内容，然后选择一个日期，则该文本字段的输入将被清除。有什么建议 ？？提前致谢 ！ 这是完整的代码...
class AddTask extends StatefulWidget {
@override
_AddTaskState createState() => _AddTaskState();
}
class _AddTaskState extends State<AddTask> {
DateTime daytime;
@override
Widget build(BuildContext context) {
String newNoteTitle;
String newNoteText;
String newNoteId = DateTime.now().toIso8601String();
TextEditingController titleController = TextEditingController();
TextEditingController commentController = TextEditingController();
return SafeArea(
child: Scaffold(
appBar: AppBar(
automaticallyImplyLeading: false,centerTitle: true,backgroundColor: Colors.black12,title: Text(
'Add a note ',style: TextStyle(
fontFamily: 'Volkhov',color: Colors.white,fontWeight: FontWeight.w400,fontSize: 25.0),textAlign: TextAlign.center,),backgroundColor: Color(0xff212121),body: SingleChildScrollView(
child: Column(
mainAxisAlignment: MainAxisAlignment.start,children: [
// SizedBox(
// height: 80,// ),Container(
width: 400,height: 350,child: Card(
shape: RoundedRectangleBorder(
borderRadius: BorderRadius.all(
Radius.circular(20),margin: EdgeInsets.fromLTRB(30,20,30,20),color: Colors.white12,child: Column(
children: [
Padding(
padding: EdgeInsets.all(10),child: TextField(
maxLength: 20,maxLines: null,textAlign: TextAlign.start,decoration: InputDecoration(
prefixIcon: GestureDetector(
onTap: () {
showDatePicker(
context: context,initialDate: daytime == null
? DateTime.now()
: daytime,firstDate: DateTime(1970),lastDate: DateTime(2100),).then((date) {
setState(() {
daytime = date;
});
});
},child: Icon(
Icons.date_range,color: Colors.deepPurple,enabledBorder: OutlineInputBorder(
borderSide: BorderSide(color: Colors.amber),borderRadius: BorderRadius.all(
Radius.circular(10),hintText:
'Enter title or press the icon to select a date',hintStyle: TextStyle(color: Colors.white),focusedBorder: OutlineInputBorder(
borderSide: BorderSide(color: Colors.deepPurple),style: TextStyle(
fontSize: 11.0,// fontStyle: FontStyle.italic,controller: titleController,// onChanged: (newtitle) {
// newNoteText = newtitle;
// },SizedBox(
height: 30,Padding(
padding: EdgeInsets.all(10),child: TextField(
maxLines: null,maxLength: 500,decoration: InputDecoration(
enabledBorder: UnderlineInputBorder(
borderSide: BorderSide(color: Colors.amber),hintText: 'Comments',hintStyle: TextStyle(color: Colors.grey),focusedBorder: UnderlineInputBorder(
borderSide: BorderSide(color: Colors.deepPurple),style: TextStyle(
fontSize: 15.0,controller: commentController,// onChanged: (newText) {
// newNoteText = newText;
// },],SizedBox(height: 20),Row(
mainAxisAlignment: MainAxisAlignment.center,children: [
RaisedButton(
elevation: 20,onPressed: () {
Navigator.pop(context);
},color: Colors.amber,child: Icon(
Icons.arrow_back,color: Colors.black,SizedBox(
width: 20,RaisedButton(
elevation: 25,child: Text(
'Save',style: TextStyle(color: Colors.black),onPressed: () {
if (titleController.text.isEmpty && daytime == null) {
newNoteTitle = 'No title';
} else if (titleController.text.isEmpty &&
daytime != null) {
newNoteTitle = DateFormat('yyy/MM/dd').format(daytime);
} else if (titleController.text != null &&
daytime == null) {
newNoteTitle = titleController.text;
} else {
newNoteTitle = titleController.text +
' - ' +
DateFormat('yyy/MM/dd').format(daytime);
}
commentController.text.isEmpty
? newNoteText = 'No comments'
: newNoteText = commentController.text;
// Provider.of<Notes>(context,listen: false).addNote(
DBHelper.insert(
'user_notes',{
'title': newNoteTitle,'text': newNoteText,'id': newNoteId
},);
Navigator.pushReplacement(
context,MaterialPageRoute(builder: (context) => MainScreen()),);
},)
],);
}
}
我知道在日期选择器上设置状态时，我做错了...也为错误的代码...
解决方法
请检查此代码。两种工作都使用相同的文本字段，最好使用不同的文本字段。
TextField(
maxLength: 20,maxLines: null,textAlign: TextAlign.start,decoration: InputDecoration(
prefixIcon: GestureDetector(
onTap: () {
showDatePicker(
context: context,initialDate: daytime == null ? DateTime.now() : daytime,firstDate: DateTime(1970),lastDate: DateTime(2100),).then((date) {
setState(() {
daytime = date;
titleController.text =
daytime.toString() + titleController.text;
});
});
},child: Icon(
Icons.date_range,color: Colors.deepPurple,),enabledBorder: OutlineInputBorder(
borderSide: BorderSide(color: Colors.amber),borderRadius: BorderRadius.all(
Radius.circular(10),hintText: 'Enter title or press the icon to select a date',hintStyle: TextStyle(color: Colors.red),focusedBorder: OutlineInputBorder(
borderSide: BorderSide(color: Colors.deepPurple),style: TextStyle(
fontSize: 11.0,color: Colors.red,// fontStyle: FontStyle.italic,controller: titleController,)
不确定代码中到底发生了什么错误，但是您可以在外部设置用于维护变量的文本，然后将值分配给titleController.text
setState(() {
daytime = date;
titleController.text = 'Text Message';
});
我正以这种方式使用控制器，请在下面尝试
final titleController = TextEditingController();
final commentController = TextEditingController();
尝试从小部件构建中定义您的控制器，因为setState工作时，它会不断重建您的控制器。
TextEditingController titleController = TextEditingController();
TextEditingController commentController = TextEditingController();
Widget build(BuildContext context) {}
版权声明：本文内容由互联网用户自发贡献，该文观点与技术仅代表作者本人。本站仅提供信息存储空间服务，不拥有所有权，不承担相关法律责任。如发现本站有涉嫌侵权/违法违规的内容， 请发送邮件至 dio@foxmail.com 举报，一经查实，本站将立刻删除。