CODEWITHSUNDEEP
flutterdartflutter-animation
justAnotherOverflowUser
justAnotherOverflowUser

Reputation: 625

Animation with StreamBuilder

Project

Hi, I have created with flutter a simple app that changes the height of a container with a streambuilder based on user vertical drag.

So because user input updates are very fast, this force the streambuider to rebuild multiple times, creating the effect of an animation.

Code

    final StreamController streamController = StreamController<double>();
    double height = 0.0;

    StreamBuilder(
      initialData: 0.0,
      stream: streamController.stream,
      builder: (context, snapshot) {
        return Container(
          height: snapshot.data,
        );
      },
    ),

     ....

     height += (dragUpdateDY);
     streamController.add(height);

Problem

Despite code is working as intended, I keep thinking that this is not a good solution because it forces the UI to rebuild an unpredictable amount of time in a second, maybe even beyond 60 times, exceeding display refresh rate.

Is there a better way?

Upvotes: 2

Views: 509

Answers (1)

creativecreatorormaybenot
creativecreatorormaybenot

Reputation: 126974

This is totally fine because build is actually not called by you! It is always called by the framework, which is why it will not be called more than 60 Hz.
This is true because StreamBuilder calls State.setState internally, which does the following:

Calling setState notifies the framework that the internal state of this object has changed in a way that might impact the user interface in this subtree, which causes the framework to schedule a build for this State object.

If you want more fine-grained control, you can create your own RenderObject and call markNeedsPaint or markNeedsLayout whenever you need it based on GestureRecognizers.

Upvotes: 2

Related Questions