title: Flutter - Stop FutureBuilder operation in between process
body: <p>How do I cancel <code>FutureBuilder</code> operation when rebuilding the widget</p>
  <p>Lets say I have a code like this... Every time i pressed the Floating button the widget rebuilds calling <code>myFuture</code> which waits five seconds and then the counter increments... Now I want that during that five seconds if I pressed the Floating button the current Future (which is still is delayed) should <strong>stop its operation</strong> and the new Future will be called...So at the end I should get a counter of 2 but instead I get 3...</p>
  <pre><code>class MyHomePage extends StatefulWidget {
  
    @override
    _MyHomePageState createState() =&gt; _MyHomePageState();
  }
  
  class _MyHomePageState extends State&lt;MyHomePage&gt; {
    var counter = 0;
    
    myFuture()async{
      await Future.delayed(Duration(seconds:5));
      counter++;
    }
  
    @override
    Widget build(BuildContext context) {
      return Scaffold(
        appBar: AppBar(),
        body: FutureBuilder(
          future: myFuture(),
          builder: (context, snapshot) {
            if (snapshot.connectionState == ConnectionState.waiting)
              return Center(child: CircularProgressIndicator());
            else return Text(counter.toString());
          }
        ),
        floatingActionButton: FloatingActionButton(
          onPressed: ()=&gt;setState(() {}),
          child: Icon(Icons.add),
        ),
      );
    }
  }
   
  </code></pre>