This project is copy from raindrop-c's library -> react-native-webview-tencentx5(v1.0.2) with some bug-fix!!!
Only for personal usage!!! Thanks to Raindrop-c.
将安卓中webview浏览器内核替换为腾讯X5内核并保留react-native-webview中各种API
可以优化Android版本低而使浏览器内核webveiw不正常显示,同时使用腾讯X5方便扩展。
总之,等于使用腾讯浏览器打开webview页面。
其中react-native-webview的API支持版本为v10.9.3,X5内核版本SDK为v4.3.0.67_43967。
$ npm install react-native-webview-tencentx5 --save
$ react-native link react-native-webview-tencentx5
暂不支持IOS,有需要可对照Android实现
- Open up
android/app/src/main/java/[...]/MainActivity.java
- Add
import in.fan.webviewx5.RNWebviewx5Package;
to the imports at the top of the file - Add
new RNWebviewx5Package()
to the list returned by thegetPackages()
method
- Append the following lines to
android/settings.gradle
:include ':react-native-webview-tencentx5' project(':react-native-webview-tencentx5').projectDir = new File(rootProject.projectDir, '../node_modules/react-native-webview-tencentx5/android')
- Insert the following lines inside the dependencies block in
android/app/build.gradle
:compile project(':react-native-webview-tencentx5')
为了保障X5内核的动态下发和正常使用,您需要在您的AndroidManifest.xml增加如下权限:
<uses-permission android:name="android.permission.WRITE_EXTERNAL_STORAGE" />
<uses-permission android:name="android.permission.ACCESS_NETWORK_STATE" />
<uses-permission android:name="android.permission.ACCESS_WIFI_STATE" />
<uses-permission android:name="android.permission.INTERNET" />
<uses-permission android:name="android.permission.READ_PHONE_STATE" />
import { WebView } from 'react-native-webview-tencentx5';
<WebView
source={{ uri: 'https://www.bilibili.com/' }}/>