onLayoutChanged property

Stream<DomService>? get onLayoutChanged

A stream that fires when a component should do a layout check.

NOTE:

  • The stream fires outside of a framework managed zone
  • The stream fires within a scheduled DOM read queue, making it safe to openly check elements size or positioning in this callback.

Implementation

Stream<DomService>? get onLayoutChanged {
  if (_onLayoutChangedStream == null) {
    _onLayoutChangedController = StreamController.broadcast(sync: true);
    _onLayoutChangedStream = ZonedStream(
        _onLayoutChangedController!.stream, _ngZone.runOutsideAngular);
    _ngZone.runOutsideAngular(() {
      // Capture events from Angular
      _ngZone.onTurnStart.listen((_) {
        if (_state != DomServiceState.Idle) return;
        _insideDigest = true;
      });
      // Trigger a layout check after the digest.
      _ngZone.onEventDone.listen((_) {
        if (_state != DomServiceState.Idle) return;
        _insideDigest = false;
        // Reduce layout checks to only those zone turns that mutated DOM.
        if (isDomMutatedPredicate == null ||
            isDomMutatedPredicate!() ||
            _writeQueueChangedLayout) {
          _scheduleOnLayoutChanged();
          _writeQueueChangedLayout = false;
        }
      });
      _listenOnLayoutEvents(_window.onAnimationEnd);
      _listenOnLayoutEvents(_window.onResize);
      _listenOnLayoutEvents(_window.onTransitionEnd);
      // Listening Angular turn done events coming from other apps.
      _window.addEventListener(_TURN_DONE_EVENT_TYPE, (_) {
        if (!_inDispatchTurnDoneEvent) {
          _scheduleOnLayoutChanged();
        }
      });
    });
  }
  return _onLayoutChangedStream;
}