Dani
Dani

Reputation: 4186

Update a part of the UI on Flutter

To update the whole widget is easy, we call SetState() and we do our changes but what happens if I don't need to update everything?

I have this UI: enter image description here

When I load that page I get my array of elements from my app provider:

Widget build(BuildContext context) {
   var elements = shuffle(Provider.of<GameSettings>(context).set.elements);

(took it from this answer: List.shuffle() in Dart?)

I need the context to get my saved list of elements, that's why I put it there.

I also have the progress bar which I need to refresh:

void _startTimer() {
    var sub = countDownTimer.listen(null);
    sub.onData((duration) {
      setState(() {
        _current = _start + duration.elapsed.inSeconds;
      });
    });

    sub.onDone(() {
      sub.cancel();
    });
  }
}

But when I refresh it, I'm also refreshing my element. This is happening because the whole widget is being called and so my shuffle function.

I tried moving the progress button to a different widget, but still the same. How could I just refresh this progress?

Upvotes: 3

Views: 6294

Answers (2)

Mohammed Ali
Mohammed Ali

Reputation: 144

You can use StatefulBuilder()

your code will be :

void _startTimer() {
    StatefulBuilder(
        builder: (BuildContext context, setState){
           var sub = countDownTimer.listen(null);
           sub.onData((duration) {
              setState(() {
                   _current = _start + duration.elapsed.inSeconds;
                });
            });

            sub.onDone(() {
             sub.cancel();
            });
         }
     )

 }

Upvotes: 2

Sahandevs
Sahandevs

Reputation: 1160

you can use StreamController and StreamBuilder widget for that

https://api.flutter.dev/flutter/widgets/StreamBuilder-class.html

Upvotes: 0

Related Questions