@brown-bear/react-native-autoheight-webview
@brown-bear/react-native-autoheight-webvie is a lightweight, high-performance React Native component that automatically adjusts its height
(and optionally width) to match the content of any inline HTML or web page. Built as a fork of the original iou90 library,
this package removes manual size calculations and nesting hacks—simply drop in <AutoHeightWebView>
and let it handle the rest.
Key highlights:
-
Seamless auto-height: Dynamically measures and resizes to the full height of your HTML content, eliminating scroll jumps or clipped layouts.
-
Inline auto-width support: For snippets or embedded HTML blocks, AutoHeightWebView can constrain itself to the width of its container.
-
Cross-platform: Fully compatible with both iOS and Android via react-native-webview.
-
Customizable styling & scripting: Inject custom CSS or JavaScript into the page head for on-the-fly theming, font loading, or interactive enhancements.
-
Performance optimized: Efficient size recalculation and minimal reflows keep your UI smooth, even with complex or rapidly changing content.
-
Easy integration: Zero configuration setup; supports custom onSizeUpdated callbacks, local/remote file injection, and full control over viewportContent, scrolling behaviors, and origin whitelisting.
-
Whether you’re rendering rich text articles, dynamic charts, or interactive widgets inside your React Native app, AutoHeightWebView handles sizing complexities so you can focus on building great user experiences.
Explore the package on npm or view the source code on GitHub.
URLS 🔗:
NPM URL: https://www.npmjs.com/package/@brown-bear/react-native-autoheight-webview
GITHUB URL: https://github.com/giannistolou/react-native-autoheight-webview