ResizeSensor top-level property

  1. @Deprecated('Use the `ResizeSensor` component exported from `package:over_react/components.dart` instead. Will be removed in the 4.0.0 release of over_react.')
  2. @Factory()
UiFactory<ResizeSensorProps> ResizeSensor
getter/setter pair

A wrapper component that detects when its parent is resized, providing a ResizeSensorEvent as a callback argument to ResizeSensorPropsMixin.onResize.

Intended for use as a https://wicg.github.io/ResizeObserver/ polyfill.

(ResizeSensor()
  ..onResize = (ResizeSensorEvent event) {
    print('''
      Width was ${event.prevWidth}px, and is now ${event.newWidth}px.
      Height was ${event.prevHeight}px, and is now ${event.newHeight}px.
    ''');
  }
)(
  // children that will change width / height
)

If your implementation needs to know what the dimensions of the node were when it first mounted, ResizeSensorPropsMixin.onInitialize can be set, as long as ResizeSensorPropsMixin.quickMount is false.

(ResizeSensor()
  ..onInitialize = (ResizeSensorEvent event) {
    print('''
      Width was ${event.prevWidth}px when first mounted.
      Height was ${event.prevHeight}px, and is now ${event.newHeight}px.
    ''');
  }
  ..onResize = (ResizeSensorEvent event) {
    print('''
      Width was ${event.prevWidth}px, and is now ${event.newWidth}px.
      Height was ${event.prevHeight}px, and is now ${event.newHeight}px.
    ''');
  }
)(
  // children that will change width / height
)

The component must be put in a relative or absolutely positioned container.

Implementation

@Deprecated('Use the `ResizeSensor` component exported from `package:over_react/components.dart` instead. Will be removed in the 4.0.0 release of over_react.')
@Factory()
UiFactory<ResizeSensorProps> ResizeSensor = _$ResizeSensor;