内容为空时更改textformfield装饰

问题描述

我想实现一个设计，但是对如何执行设计一无所知。就像图片中用户选择字段时一样，其颜色也会改变。我更改了文本字段的颜色，以验证文本字段是否聚焦。但是我怎么知道，如果文本字段为空，则更改边框的颜色以及内容未聚焦的颜色？ 设计已附上。

这是代码

class EditMneomic extends StatefulWidget {
@override
_EditMneomicState createState() => _EditMneomicState();
}
class _EditMneomicState extends State<EditMneomic> {
FocusNode _focusNode;
TextEditingController _controller;
final _formKey = GlobalKey<FormState>();
@override
void dispose() {
super.dispose();
_focusNode.dispose();
}
@override
void initState() {
super.initState();
// if (_formKey.currentState.validate() == null)
_focusNode = new FocusNode();
_focusNode.addListener(_onOnFocusNodeEvent);
}
_onOnFocusNodeEvent() {
setState(() {
// Re-renders
});
}
@override
Widget build(BuildContext context) {
return new Scaffold(
appBar: new AppBar(
title: new Text('Changing Colors'),),body: new Container(
//         height: 50,//         width: double.infinity,decoration: BoxDecoration(
borderRadius: BorderRadius.all(
Radius.circular(20),color: _getContainerBackgroundColor(),// padding: new EdgeInsets.all(40.0),child: Form(
key: _formKey,autovalidate: true,child: new TextFormField(
// onEditingComplete: () {
//   print('true');
// },// autovalidate: true,// validator: (value) {
//   // if(value.isEmpty){}
//   if (value.isEmpty) {
//     return 'Please enter some text';
//   }
//   return null;
//   // if (_controller.text == "") {
//   //   _getContainerBackgroundColor();
//   // } else {
//   //   return null;
//   // }
// },decoration: InputDecoration(
prefixIcon: Padding(
padding: const EdgeInsets.all(8.0),child: Container(
decoration: BoxDecoration(
color: Color.fromRGBO(255,255,1),borderRadius: BorderRadius.all(
Radius.circular(10.0),child: Text(
'1',textAlign: TextAlign.center,errorBorder: OutlineInputBorder(
// gapPadding: 10,borderSide: BorderSide(
color: Colors.white,filled: true,// focusedBorder: OutlineInputBorder(
//     borderSide: BorderSide(color: Colors.red),//     borderRadius: BorderRadius.circular(20)),// border: OutlineInputBorder(
//   borderRadius: const BorderRadius.all(
//     const Radius.circular(25.0),//   ),// ),// style: new TextStyle(color: _getInputTextColor()),focusNode: _focusNode,)),);
}
Color _getContainerBackgroundColor() {
return _focusNode.hasFocus
? Color.fromRGBO(233,238,249,1)
: Color.fromRGBO(0,85,1);
}
//   Color _getAppBarBackgroundColor() {
//     return _focusNode.hasFocus ? Colors.green : Colors.red;
//   }
Color _getInputTextColor() {
return _focusNode.hasFocus ? Colors.white : Colors.pink;
}
}

解决方法

暂无找到可以解决该程序问题的有效方法，小编努力寻找整理中！

如果你已经找到好的解决方法，欢迎将解决方案带上本链接一起发送给小编。

小编邮箱:dio#foxmail.com (将#修改为@）