nativescript-awesome-webview
A WebView plugin for NativeScript {N} that uses Chrome Custom Tabs in Android and SFSafariViewController in iOS. It is awesome because now you can use the system's default browser, letting people maintain active logins across websites (instead of having to freshly login to sites in the scope of your app's webview). Which means the custom tabs (or safari view) loads really fast! Also you can set the color of the title bar and controls of the custom tab / safari view.
Prerequisites / Requirements
As of now, there aren't any prerequisites. This should work with any device, any OS.
Installation
For tns
projects (Angular, Typescript, Javascript)
tns plugin add nativescript-awesome-webview
For vue-cli
projects (Nativescript-Vue)
npm install nativescript-awesome-webview
Usage
Require
Javascript -
const {init, openWebView} = require('nativescript-awesome-webview');
Typescript -
import {init, openWebView} from 'nativescript-awesome-webview';
1. Initialise (optional, only Android)
init()
NOTE: This warms up the Chrome Custom Tab on Android For details check this
Calling init()
does nothing on iOS. So if you're making for both OS, calling the function doesn't hurt in iOS.
2. Open an URL
openWebView({
url: 'http://google.com',
toolbarColor: '#2277aa',
toolbarControlsColor: '#eebb99'
});
openWebView options
AwesomeWebviewOptions
structure (the object you pass into openWebView
)
Property | Default | Description |
---|---|---|
url | required | The URL to open |
showTitle | false | Shows title bar in the webview |
toolbarColor | undefined | Color of the toolbar |
toolbarControlsColor | undefined | (only iOS) color of buttons on toolbar |
isClosed | undefined | callback function that will be called when webview is closed |
License
This is free, open source and do-whatever-you-want-ware. I really don't care. But if you need an official license -
Apache License Version 2.0, January 2004