how to call function from Switch

Question

With the default Flutter app created in Android Studio, I tried to test the Switch, so I added the below code:

new Switch(value: true, onChanged: (bool newValue) {
  setState(() {
    _incrementCounter();  // executed only if the value is true
  });
},),

The incrementCounter function is:

  void _incrementCounter() {
    setState(() {
      _counter++;
    });
  }

The issue I've is that the incrementCounter function is called and executed once the Switch value is switched back to false, while what I expect is the incrementCounter function should be called every time the switch is switched, i.e. regardless the new value is true or false!

Answer 1

import 'package:flutter/material.dart';

void main() => runApp(new MyApp());

class MyApp extends StatelessWidget {
  // This widget is the root of your application.
  @override
  Widget build(BuildContext context) {
    return new MaterialApp(
      title: 'Flutter Demo',
      theme: new ThemeData(
        primarySwatch: Colors.deepOrange,
      ),
      home: new MyHomePage(title: 'Flutter Demo Home Page'),
    );
  }
}

class MyHomePage extends StatefulWidget {
  MyHomePage({Key key, this.title}) : super(key: key);

  final String title;

  @override
  _MyHomePageState createState() => new _MyHomePageState();
}

class _MyHomePageState extends State<MyHomePage> {

  var _value=false;
  double _bodyHeight=0.0;

  void onchange(bool value) {
    setState(() {
      _value = value;
      this._bodyHeight = (value == true) ? 400.0 : 0.0;
    });
  }

  @override
  Widget build(BuildContext context) {
    return new Scaffold(
      backgroundColor: Colors.grey[500],
      appBar: new AppBar(
        title: new Text(widget.title),
      ),
      body: new SingleChildScrollView(
        child: new Column(
          mainAxisAlignment: MainAxisAlignment.center,
          children: <Widget>[
            new Card(
              child: new Container(
                height: 50.0,
                child: new Row(
                  mainAxisAlignment: MainAxisAlignment.end,
                  children: <Widget>[
                    new Text("Select me pls"),
                    new Switch(value: _value, onChanged: (bool value) => onchange(value)),
                  ],
                ),
              ),
            ),
            new Card(
              child: new AnimatedContainer(
                child: new ListView(
                  children: <Widget>[
                      new ListTile(
                      leading: const Icon(Icons.person),
                      title: new TextField(
                        decoration: new InputDecoration(
                          hintText: "Name",
                        ),
                      ),
                    ),
                    new ListTile(
                      leading: const Icon(Icons.phone),
                      title: new TextField(
                        decoration: new InputDecoration(
                          hintText: "Phone",
                        ),
                      ),
                    ),
                    new ListTile(
                      leading: const Icon(Icons.email),
                      title: new TextField(
                        decoration: new InputDecoration(
                          hintText: "Email",
                        ),
                      ),
                    ),
                    const Divider(
                      height: 1.0,
                    ),
                    new ListTile(
                      leading: const Icon(Icons.label),
                      title: const Text('Nick'),
                      subtitle: const Text('None'),
                    ),
                    new ListTile(
                      leading: const Icon(Icons.today),
                      title: const Text('Birthday'),
                      subtitle: const Text('February 20, 1980'),
                    ),
                      new ListTile(
                        leading: const Icon(Icons.group),
                        title: const Text('Contact group'),
                        subtitle: const Text('Not specified'),
                      ),
                      new ListTile(
                        leading: const Icon(Icons.person),
                        title: new TextField(
                          decoration: new InputDecoration(
                            hintText: "Name",
                          ),
                        ),
                      ),
                      new ListTile(
                        leading: const Icon(Icons.phone),
                        title: new TextField(
                          decoration: new InputDecoration(
                            hintText: "Phone",
                          ),
                        ),
                      ),
                      new ListTile(
                        leading: const Icon(Icons.email),
                        title: new TextField(
                          decoration: new InputDecoration(
                            hintText: "Email",
                          ),
                        ),
                      ),
                      const Divider(
                        height: 1.0,
                      ),
                      new ListTile(
                        leading: const Icon(Icons.label),
                        title: const Text('Nick'),
                        subtitle: const Text('None'),
                      ),
                      new ListTile(
                        leading: const Icon(Icons.today),
                        title: const Text('Birthday'),
                        subtitle: const Text('February 20, 1980'),
                      ),
                      new ListTile(
                        leading: const Icon(Icons.group),
                        title: const Text('Contact group'),
                        subtitle: const Text('Not specified'),
                      )
                  ],
                ),
                curve: Curves.easeInOut,
                duration: const Duration(milliseconds: 500),
                height: _bodyHeight,
                // color: Colors.red,
              ),
            ),
          ],
        ),
      ),
    );
  }
}

Answer 2

as @aziza said the problem is :

You are not switching the value.

So this should work

class MyApp extends StatefulWidget {
  @override
  MyAppState createState() {
    return new MyAppState();
  }
}

class MyAppState extends State<MyApp> {
  var _value=false;
  var inc=0;
  onchange(bool value){
    setState((){
     inc++;
     _value=value;
    });
  }
  @override
  Widget build(BuildContext context) {
    return new Scaffold(
      appBar: new AppBar(),
      body : new Column(children: <Widget>[
        new Switch(value: _value, onChanged: (bool value)=>onchange(value)),
        new Center(child: new Text("value ${inc}"),)
      ],)
    );
  }
}

Answer 3

You are not switching the value.

The error is basically in your code in this line:

value: true

You can have a class level boolean to handle this.

Example:

//State level class

bool switchValue = false;
  _dummyMethod(){
    print (this.switchValue);
  }
  @override
  Widget build(BuildContext context) {
    return new Scaffold(
      appBar: new AppBar(),
      body: new Center(
        child: new Switch(
          onChanged: (newValue){
            setState((){
              this.switchValue = newValue;
            });
            _dummyMethod();
          },
         value: switchValue,)
      ),
    );
  }