greatbskygreatbsky
70

React Native Webview2

screenshot of React Native Webview2
react-native

This is the WebView component in React Native both for Android and iOS, support Auto Height & Call JS between component and html page, very useful & easily!

Github

Overview

The react-native-webview2 is a powerful JavaScript-only implementation of the WebView component for React Native, designed to enhance user experience on both Android and iOS platforms. It allows developers to seamlessly integrate web content into their applications, supporting dynamic height adjustments and interaction between native code and JavaScript. With its simplistic approach, react-native-webview2 significantly streamlines the process of embedding web content in mobile applications.

This library stands out by providing easy-to-use features that allow for JavaScript execution within HTML documents and vice versa. Whether you're looking to fetch data from the web or display intricate webpages in your mobile application, this tool makes it not only possible, but also straightforward.

Features

  • Dynamic Height Adjustment: Automatically changes the height of the WebView based on the content when the proper source is set, ensuring optimal display without fixed height constraints.

  • JavaScript Interaction: Support for calling JavaScript from React Native using this.web.evalJs("js code...here"), allowing for robust two-way communication between the components.

  • Cross-Platform Compatibility: Works seamlessly on both Android and iOS, expanding the reach of your web features to a wider audience.

  • EvalReturn Functionality: Facilitates calling React Native code from the HTML page, enhancing interaction capabilities by using the evalReturn prop.

  • Customizable Navigation: Easily open new URIs within the WebView using the go function, allowing flexible navigation within your app.

  • Support for All WebView Props: Inherits functionality from standard React Native WebView, ensuring developers can leverage existing properties without additional overhead.

  • Open Source Licensure: Available under the MIT License, promoting a collaborative environment for developers to contribute and improve the library.

  • Demo Project: Accompanied by a demo to help developers understand implementation quickly, ensuring a smooth onboarding process.

react-native
React Native

React Native is a framework for building mobile applications using React and JavaScript. It enables developers to write once and deploy to multiple platforms, including iOS, Android, and the web, while providing a native app-like experience to users.