drawFrame method

  1. @protected
void drawFrame()

Pump the rendering pipeline to generate a frame.

This method is called by handleDrawFrame, which itself is called automatically by the engine when it is time to lay out and paint a frame.

Each frame consists of the following phases:

  1. The animation phase: The handleBeginFrame method, which is registered with PlatformDispatcher.onBeginFrame, invokes all the transient frame callbacks registered with scheduleFrameCallback, in registration order. This includes all the Ticker instances that are driving AnimationController objects, which means all of the active Animation objects tick at this point.

  2. Microtasks: After handleBeginFrame returns, any microtasks that got scheduled by transient frame callbacks get to run. This typically includes callbacks for futures from Tickers and AnimationControllers that completed this frame.

After handleBeginFrame, handleDrawFrame, which is registered with dart:ui.PlatformDispatcher.onDrawFrame, is called, which invokes all the persistent frame callbacks, of which the most notable is this method, drawFrame, which proceeds as follows:

  1. The layout phase: All the dirty RenderObjects in the system are laid out (see RenderObject.performLayout). See RenderObject.markNeedsLayout for further details on marking an object dirty for layout.

  2. The compositing bits phase: The compositing bits on any dirty RenderObject objects are updated. See RenderObject.markNeedsCompositingBitsUpdate.

  3. The paint phase: All the dirty RenderObjects in the system are repainted (see RenderObject.paint). This generates the Layer tree. See RenderObject.markNeedsPaint for further details on marking an object dirty for paint.

  4. The compositing phase: The layer tree is turned into a Scene and sent to the GPU.

  5. The semantics phase: All the dirty RenderObjects in the system have their semantics updated. This generates the SemanticsNode tree. See RenderObject.markNeedsSemanticsUpdate for further details on marking an object dirty for semantics.

For more details on steps 3-7, see PipelineOwner.

  1. The finalization phase: After drawFrame returns, handleDrawFrame then invokes post-frame callbacks (registered with addPostFrameCallback).

Some bindings (for example, the WidgetsBinding) add extra steps to this list (for example, see WidgetsBinding.drawFrame).

Implementation

//
// When editing the above, also update widgets/binding.dart's copy.
@protected
void drawFrame() {
  rootPipelineOwner.flushLayout();
  rootPipelineOwner.flushCompositingBits();
  rootPipelineOwner.flushPaint();
  if (sendFramesToEngine) {
    for (final RenderView renderView in renderViews) {
      renderView.compositeFrame(); // this sends the bits to the GPU
    }
    rootPipelineOwner.flushSemantics(); // this sends the semantics to the OS.
    _firstFrameSent = true;
  }
}