Why when I execute changes in other fields the selected elements of the CheckBox are deleted - Flutter

0

I have a set of CheckBoxes that work perfectly, but when making changes in another section within the same view they are cleaned and unmarked by themselves, why is this happening ?, I have not found anything on the web about that ...

This is how I generate the CheckBox:

Check box(
                  lbl: "Gloves",
                  variable: 'gloves',
                  callbackCheckBox: callbackCheckBox),

When I select the CheckBox I call a callback () to receive the selected object and know if it is true or false, like this:

  void callbackCheckBox (String variable, bool value) {
    setState (() {
      print ('callbackCheckBox: var = $ variable, value = $ value');
      if (variable == 'gloves' && value == true) gloves = true;
    });
  }

So far, everything is perfect, but when I execute this code, what is selected from the CheckBox is deleted:

void isVisibleSignatureC1 () {setState (() {_isVisibleSignatureC1 =! _isVisibleSignatureC1; if (! _ isVisibleSignatureC1) imageSignatureC1 = imageSignatureNetwork; else imageSignatureC1 = imageSignatureAssets;});}

I use this code to change the image that is displayed in a Container () and the same thing happens when I execute a validator () of a TexField, just as the selected fields of the CheckBox are deleted.

And this is my CheckBox class that I call to create it:

class LabeledCheckbox extends StatelessWidget {
  const LabeledCheckbox ({
    this.label,
    this.padding,
    this.value,
    this.onChanged,
  });

  final String label;
  end EdgeInsets padding;
  final bool value;
  final Function onChanged;

  @override
  Build widget (BuildContext context) {
    return InkWell (
      onTap: () {
        onChanged (! value);
      },
      child: Padding (
        padding: padding,
        child: Row (
          children: <Widget> [
            Expand (
                child: AutoSizeText (
                  label,
                  maxLines: 1,
                  style: TextStyle (
                      fontSize: 20,
                      fontWeight: FontWeight.bold,
                      fontFamily: 'Lato',
                      color: Colors.black),
                ),
            ),
            Check box(
              value: value,
              activeColor: Color (0xFFff0000),
              onChanged: (bool newValue) {
                onChanged (newValue);
              },
            ),
          ],
        ),
      ),
    );
  }
}

class CheckBox extends StatefulWidget {

  final String lbl;
  ending String variable;
  Function callbackCheckBox;

  Check box({
    Key key,
    @required this.lbl,
    @required this.variable,
    @required this.callbackCheckBox,
  });

  @override
  _CheckBox createState () => _CheckBox ();
}

class _CheckBox extends State <CheckBox> {
  bool _isSelected = false;

  @override
  Build widget (BuildContext context) {
    return LabeledCheckbox (
      label: widget.lbl,
      padding: const EdgeInsets.symmetric (horizontal: 20.0),
      value: _isSelected,
      onChanged: (bool newValue) {
        setState (() {
          _isSelected = newValue;
          widget.callbackCheckBox (widget.variable, _isSelected);
        });
      },
    );
  }
}

Here is where i call isVisibleSignatureC1():

containerSignaturePermit(String variableData, var image,
    var _isVisibleSignature) {
  return Container(
      alignment: Alignment.center,
      width: 100.0,
      height: 60.0,
      margin: EdgeInsets.all(4.0),
      decoration: BoxDecoration(
        borderRadius: BorderRadius.circular(10),
        color: Color(0xFFe5e5e5),
      ),
      //child: Text("${index + 1}", style: Theme.of(context).textTheme.title),
      child: GestureDetector(
        onTap: () =>
            setState(() {
              print('$variableData, isVisibleSignature: $_isVisibleSignature');
            if('$variableData' == 'capplicantsig1') isVisibleSignatureC1();
            }),
        child: Container(
          height: screenHeight,
          width: screenWidth,
          decoration: BoxDecoration(
            borderRadius: BorderRadius.circular(10),
            color: Colors.white,
          ),
          child: image,
        ),
      )
  );
}

Anyone know why it happens and how to fix it to leave the fields checked and not cleared when making other changes in the same view.

flutter
dart
asked on Stack Overflow Jun 24, 2020 by Matías nnr • edited Jun 25, 2020 by Matías nnr

1 Answer

0

From what you told me your CheckBox class lose the state after scrolling away and setState so maybe what you need is to use AutomaticKeepAliveClientMixin in the CheckBox class so even if it's out of the screen when you get back the value is preserved

class CheckBox extends StatefulWidget { //This is the same

  final String lbl;
  ending String variable;
  Function callbackCheckBox;

  Check box({
    Key key,
    @required this.lbl,
    @required this.variable,
    @required this.callbackCheckBox,
  });

  @override
  _CheckBox createState () => _CheckBox ();
}

class _CheckBox extends State<CheckBox> with AutomaticKeepAliveClientMixin<CheckBox> { //Add the mixin to the state
  bool _isSelected = false;

  @override
  bool get wantKeepAlive => true; //this tells the state to keep it alive

  @override
  Widget build(BuildContext context) {
    super.build(); // call this at the beginning of the build method, it's to save the state in the mixin
    return LabeledCheckbox (
      label: widget.lbl,
      padding: const EdgeInsets.symmetric (horizontal: 20.0),
      value: _isSelected,
      onChanged: (bool newValue) {
        setState (() {
          _isSelected = newValue;
          widget.callbackCheckBox (widget.variable, _isSelected);
        });
      },
    );
  }
}
answered on Stack Overflow Jun 25, 2020 by EdwynZN

User contributions licensed under CC BY-SA 3.0