NativeScript Advanced Webview
An advanced webview using Chrome Custom Tabs on Android and SFSafariViewController on iOS.
Here is a video showing off Chrome CustomTabs in NativeScript.
Android
iOS
Why use this? Because Perf Matters
Demo
Android | iOS |
---|---|
Installation
To install execute
tns plugin add nativescript-advanced-webview
Example
TypeScript
Initiate the service before the app starts e.g app.ts, main.ts
;init;
; public whateverYouLike
Javascript
Initiate the service before the app starts e.g app.ts, main.ts
var AdvancedWebView = ; AdvancedWebView;
exports{ var opts = url: 'https://www.youtube.com/watch?v=dQw4w9WgXcQ' toolbarColor: '#ff4081' toolbarControlsColor: '#333' // iOS only showTitle: false // Android only { console; } ; AdvancedWebView;
API
- openAdvancedUrl(options: AdvancedWebViewOptions)
AdvancedWebViewOptions Properties
- url: string
- toolbarColor: string
- toolbarControlsColor: string - ** iOS only **
- showTitle: boolean - ** Android only **
- isClosed: Function - callback when the browser closes
Demo App
- fork the repo
- cd into the
src
directory - execute
npm run demo.android
ornpm run demo.ios