Home - News ( United States | United Kingdom | Italy | Germany ) - Football scores

Showing content from https://github.com/DevExpress-Examples/devextreme-components-with-resize-observer below:

DevExpress-Examples/devextreme-components-with-resize-observer: This example demonstrates how to implement ResizeObserver to update a DevExtreme component layout if an external container visibility/size is changed.

This example demonstrates how to implement ResizeObserver to update a DevExtreme component layout if an external container visibility/size is changed.

No ResizeObserver

With ResizeObserver

Implement an ObserverHelper helper class. This class creates a single ResizeObserver instance and contains the following API:

• The subscribe method allows you to track changes in a parent container for the required component. It accepts the following parameters:

  • component - a widget instance.
  • element - the DOM node (HTML element) whose state you wish to track.
  • resizeAction - the callback that needs to be called.
  • delta - specify this parameter to avoid changing a component if size changes are small.
  • delay - specify this parameter to re-render a component with a delay (e.g., after animation is finished).

• The disconnect method clears all active subscriptions and removes a ResizeObserver instance.

The resizeCallback function in the helper class is called every time the container size is changed. In this example, we also demonstrated how to reduce the number of calls using the delay and delta parameters.

• jQuery
  • index.html
  • index.js
  • utils.js
• Angular
  • app.component.html
  • app.component.ts
  • observer.service.ts
• React
  • App.js
  • Content.js
  • ResizeObserver.js

• API Reference - updateDimensions
• API Reference - repaint
• API Reference - render

(you will be redirected to DevExpress.com to submit your response)

RetroSearch is an open source project built by @garambo | Open a GitHub Issue

Search and Browse the WWW like it's 1997 | Search results from DuckDuckGo

HTML: 3.2 | Encoding: UTF-8 | Version: 0.7.4