Home > Mobile >  Value change but UI don't
Value change but UI don't

Time:09-27

I want to show a button only if the new value is different from the old one. But its not working, the button isn't showing

class ViewPatientPage extends StatefulWidget {
  final int status;
  final String name;
  const ViewPatientPage({required this.status, required this.name, super.key});

  @override
  State<ViewPatientPage> createState() => _ViewPatientPageState();
}

class _ViewPatientPageState extends State<ViewPatientPage> {
  String name = '';
  @override
  void initState() {
    super.initState();
    name = widget.name;
  }

  SizedBox space() {
    return const SizedBox(height: 15);
  }

  @override
  Widget build(BuildContext context) {
    return GestureDetector(
      onTap: () {
        FocusManager.instance.primaryFocus?.unfocus();
      },
      child: Scaffold(
        appBar: AppBar(
          actions: [
           (name != widget.name) ? TextButton(
                onPressed: () {},
                child: const Text(
                  'Editar',
                  style: TextStyle(color: Colors.white),
                )): const SizedBox.shrink()
          ],
        ),
        body: Padding(
          padding: const EdgeInsets.symmetric(horizontal: 10),
          child: Column(
            children: [
              space(),
              TextFormField(
                initialValue: widget.name,

                // keyboardType: keyboardType,
                validator: (val) {
                  if (val.toString().isEmpty || val == null || val == '') {
                    return 'Fill field';
                  }
                  return null;
                },
                decoration: InputDecoration(
                    label: const Text('Name'),
                    contentPadding: const EdgeInsets.symmetric(horizontal: 20),
                    border: OutlineInputBorder(
                        borderSide: const BorderSide(color: Colors.black),
                        borderRadius: BorderRadius.circular(20))),
                onChanged: (value) {
                  name = value.trim();
                  print(name);
                  print('widget ${widget.name}');
                },
                // inputFormatters: inputFormatters,
              ),
              space(),
            ],
          ),
        ),
      ),
    );
  }
}

#random text to satisfy the site's rules flutter code vscode button textButton random text to satisfy the site's rules flutter code vscode button textButton random text to satisfy the site's rules flutter code vscode button textButton random text to satisfy the site's rules flutter code vscode button textButton random text to satisfy the site's rules flutter code vscode button textButton random text to satisfy the site's rules flutter code vscode button textButton

CodePudding user response:

You need to call setState() in onChanged.

Something like:

onChanged: (value) {
          setState(() {
            name = value.trim();
          });
          print(name);
          print('widget ${widget.name}');
        },

CodePudding user response:

Call setState inside onChanged function setState(() { name = value.trim(); });

CodePudding user response:

To update the UI, you have to a call a setState() in the onChanged: (value) {}

setState(()
{
...

});
  • Related