Flutter: Use switch to set slider value to 0-CodePudding

I have the below code. I want to use the switch, when turned off/false to set the slider value to 0 but keep the slider in it's original place so when switch is turned on/true, the output value of the slider returns to it's original value.

First time here and just learning so please be gentle.

 mainAxisAlignment: MainAxisAlignment.start,
          mainAxisSize: MainAxisSize.max,
          children: <Widget>[
            SfRadialGauge(
              axes: <RadialAxis>[
                RadialAxis(
                    minimum: -10,
                    maximum: 60,
                    interval: 10,
                    pointers: <GaugePointer>[
                      RangePointer(
                        value: 28,
                        enableAnimation: true,
                      )
                    ],
                    annotations: <GaugeAnnotation>[
                      GaugeAnnotation(widget: Text("28"))
                    ])
              ],
            ),
            Text("LED"),
            Row(
              mainAxisAlignment: MainAxisAlignment.spaceEvenly,
              mainAxisSize: MainAxisSize.max,
              children: <Widget>[
                Switch(
                    value: switchstate,
                    onChanged: (bool s) {
                      setState(() {
                        switchstate = s;
                        print(switchstate);
                      });
                    }),
                Slider(
                  value: sliderval,
                  onChanged: (sliderval) => setState(
                    () => this.sliderval = sliderval,
                  ),
                  min: 0,
                  max: 100,
                ),
              ],
            ),
          ],

CodePudding user response：

Try this:

Slider(

// if you want it to always show the value, use this.
// value: sliderval,

//if you want it ZERO if it's turned off, and show a value only when it's on[Better UX].
value: switchState ? sliderval : 0, //This will check if switchState is true first. It's called a ternary operator.
onChanged: (value) => setState(
() => sliderval = value,
),

CodePudding user response：

Instead of changing the value to 0 when the switch is turned off, why not just disable it, so that user cannot use the slide until the switch is turned off, with this, the slider will remain in it position, just that users won't be able to use slider.

Incase you still want to go with what you want, try the code below.


Row(
              mainAxisAlignment: MainAxisAlignment.spaceEvenly,
              mainAxisSize: MainAxisSize.max,
              children: <Widget>[
                Switch(
                    value: switchstate,
                    onChanged: (bool s) {
                      setState(() {
                        switchstate = s;
                        print(switchstate);
                      });
                    }),
                Slider(
                  value: switchState == true ? sliderval : 0,
                  onChanged: (sliderval) => setState(
                    () => this.sliderval = sliderval,
                  ),
                  min: 0,
                  max: 100,
                ),
              ],
            ),

Note: switchState == true ? sliderval : 0 on the slider widget, it checks if the switch is ON, it show the slider value, else it shows 0.