Home > OS >  Flutter: How to change button depending on state?
Flutter: How to change button depending on state?

Time:09-23

I'm trying to do the following: I have a container, and a button inside it and upon clicking on the button (onPressed) I would like to display a different button (aka. change the widget).

Would appreciate some help in doing so, thanks in advance!!

CodePudding user response:

define the initial value for example

double paddingLeft = 10.0;

And after clicking on that button update the state with actual value Like

setState(() {
  paddingLeft = 20.0
});

CodePudding user response:

There might be different ways. One of the methods is:

bool _val = true;

Container(
  child: _val ? button1(    // when _val is true button1 will be the child of container. So it will be visible.
      onPressed: () {
        _val = !_val;
        setState(() {
         });
       }) 
          : button2(),     // when _val is false button2 will be the child of container. So it will be visible.
);

CodePudding user response:

First of all, you need to make sure that the class you are in extends a StatefulWidget, because that means that the class will rerender when a state changes, which is what you need to be able to show another button.

Then you can define a state bool _showButton1 = true;

In your Container you can then have something like this:

Container(
  child: _showButton1 ? _button1() : _button2();
)

(Meaning: if _showButton1 is true, show the widget _button1, else show _button2)

where _button1 would look something like this:

Widget _button1() {
  return Button(
    onPressed: () => setState(() {
       _showButton1 = false;
    })
  );
}

(Meaning: when this button is pressed, update the state _showButton1 to false and rerender this class --> button 2 will be shown)

  • Related