title: Flutter: update page before running method in setState()
body: <p>I need the run a method in a setState() after some previous variables in the same setState() have been updated. At the moment it waits for the method to complete before updating the page.</p>
  
  <p>(I'm new to Flutter and my programming skills aren't very good).</p>
  
  <p>I have tried splitting the setState() into different ones:</p>
  
  <pre class="lang-dart prettyprint-override"><code>// this method is called once the animation has finished
  void _solve() {
    setState(() {
      _isSolving = true; // I need to update the display here
    });
  
    setState(() {
      _solution = PuzzleSolver().solve(); // this takes some time and returns a map
    });
  
    setState(() {
      _isSolving = false; // and I need to update the display again here
    });
  }
  
  </code></pre>
  
  <p>But this didn't help, because I don't really know how it all works.</p>
  
  <p>Here's the stripped down version of the code:</p>
  
  <pre class="lang-dart prettyprint-override"><code>import 'package:flutter/material.dart';
  import './puzzleSolver.dart';
  
  class SomePage extends StatefulWidget {
    @override
    _SomePageState createState() =&gt; _SomePageState();
  }
  
  class _SomePageState extends State&lt;SomePage&gt; with TickerProviderStateMixin {
    AnimationController animationController;
    Map _solution = {};
    bool _isSolving = false;
  
    void initState() {
      super.initState();
      animationController = AnimationController(
          vsync: this, duration: Duration(seconds: 5))
        ..addStatusListener(
            (state) =&gt; (state == AnimationStatus.dismissed) ? _solve() : null); // run _solve() once the animation has finished
      animationController.reverse();
    }
  
    // this method is called once the animation has finished
    void _solve() {
      setState(() {
        _isSolving = true; // I need to update the display here
        _solution = PuzzleSolver().solve(); // this takes some time and returns a map
        _isSolving = false; // and I need to update the display here again
      });
  
      // at the moment it updates the display here
    }
  
    @override
    Widget build(BuildContext context) {
      return Scaffold(
        appBar: AppBar(
          title: Text('Some Page'),
        ),
        body: Column(
          children: &lt;Widget&gt;[
            (_isSolving == false &amp;&amp; _solution.isEmpty)
                ? Text('hello world') // only show when it's not solving and there is no solution
                : RaisedButton(
                    child: Text('show solution'),
                    onPressed: (_isSolving)
                        ? null // disable the button when its solving
                        : () {}, // enable it when its solved
                  ),
            AnimatedBuilder(
              animation: animationController,
              builder: (BuildContext context, Widget child) {
                return Container(); // this is where the animated widgets would be
              }
            ),
          ],
        ),
      );
    }
  }
  </code></pre>