TextField value is not getting updated in Flutter-CodePudding

class UserInputArea extends StatefulWidget {
  @override
  State<UserInputArea> createState() => _UserInputAreaState();
}

class _UserInputAreaState extends State<UserInputArea> {
  @override
  Widget build(BuildContext context) {
    String convertedText='';
    setState(() {
       convertedText = Provider.of<UserText>(context, listen: true).convertedText;
       print('convertedText :: $convertedText');
    });
    return Card(
      elevation: 10,
        child: Container(
          padding: EdgeInsets.all(10),
          child: TextField(
              decoration: InputDecoration(hintText: convertedText.isNotEmpty ? convertedText : 'Enter text'),
              keyboardType: TextInputType.multiline,
              maxLines: 5,
              onChanged: (value){
                Provider.of<UserText>(context, listen: false).updateText(value);
              },
            ),
        ),
    );
  }
}

Need to update hintText field whenever convertedText gets updated. This update is happening only if screen refreshed somehow (In Appbar, if click on home-button-icon the data get updated in TextField), Using Provider package that should listen the changes and update the required feild, didnot work. So converted page to Stateful widget and addedd setState() & moved convertedText variable inside it. But still its not working, and not able to figure it out, what is exactly missing here? Anyhelp appreciated. Thanks in advance

CodePudding user response：

Please use TextEditingController class

your code will be somthing like this

    class UserInputArea extends StatefulWidget {
      @override
      State<UserInputArea> createState() => _UserInputAreaState();
    }
    
    class _UserInputAreaState extends State<UserInputArea> {
      final TextEditingController _controller = TextEditingController();
      @override
      Widget build(BuildContext context) {
       
        return Card(
          elevation: 10,
            child: Container(
              padding: EdgeInsets.all(10),
              child: TextField(
               controller: _controller,
                  decoration: InputDecoration(hintText: convertedText.isNotEmpty ? convertedText : 'Enter text'),
                  keyboardType: TextInputType.multiline,
                  maxLines: 5,

                ),
            ),
        );
      }
    }

and on editing complete or when you submit your form assign your controller

_controller.text = Provider.of<UserText>(context, listen: true).convertedText;

CodePudding user response：

I think that putting SetState() into the method and calling the method from onChanged could solve the issue. And moving it from Widget build. Something like this:

    class UserInputArea extends StatefulWidget {
          @override
          State<UserInputArea> createState() => _UserInputAreaState();
        }
        
        class _UserInputAreaState extends State<UserInputArea> {
          String convertedText='';
          void _updateField() {
             setState(() {
             convertedText = Provider.of<UserText>(context, listen: true).convertedText;
             print('convertedText :: $convertedText');
          });

          @override
          Widget build(BuildContext context) {
            return Card(
              elevation: 10,
                child: Container(
                  padding: EdgeInsets.all(10),
                  child: TextField(
                      decoration: InputDecoration(hintText: convertedText.isNotEmpty ? convertedText : 'Enter text'),
                      keyboardType: TextInputType.multiline,
                      maxLines: 5,
                      onChanged: (value){
                        Provider.of<UserText>(context, listen: false).updateText(value);
                        _updateField();
                      },
                    ),
                ),
            );
          }
        }