Start a native view relative to your cordova app, or an external app
Start an UIViewController(IOS) or Activity(Android) relative to your cordova app, or an external app (based in cordova plugin startapp cordova plugin)
You can use this in a standalone project (basic cordova project), or into an existing native Android/IOS application, like described in Embed Cordova in native apps
OBS: If you wish just EXIT from cordova app or back to native view (Android only), use:
navigator['app'].exitApp()
cordova plugin add cordova-plugin-nativeview --save
# using IONIC
ionic cordova plugin add cordova-plugin-nativeview --save
ALL PLATFORMS
Make sure that config.xml
file contains the <feature>
tag below:
<feature name="NativeView">
<param name="android-package" value="br.com.mfdeveloper.cordova.NativeView" />
<param name="onload" value="true" />
</feature>
IOS
config.xml
from your cordova project to root XCode project directory.# Objective-C version (Default)
pod 'cordova-plugin-nativeview', '~> 1.0.7'
# Swift version (needs update to latest Objective-c implementations)
pod 'cordova-plugin-nativeview', :git => 'https://github.com/mfdeveloper/cordova-plugin-nativeview.git', :branch => 'swift'
ANDROID
Add this code snippet below to your build.gradle
file
allprojects {
repositories {
...
maven { url 'https://jitpack.io' }
}
}
implementation ('com.github.mfdeveloper:cordova-plugin-nativeview:1.0.7')
This dependency is added using jitpack
Or add, the NativeView
class directly to your android project:
From your cordova project:
platforms/android/assets/www
folder to your android project (usually, app/src/main/assets
).
Or create a gradle task to do this.config.xml
to src/main/res/xml
android project folder.Clone this repo, and copy the class: src/android/NativeView.java
to your Android project
Or create a .jar
or a .aar
that contains this class, and import like a Android module dependency
Verify if the code snippet below is present in your AndroidManifest.xml
. This is required to open a specific Activity from a Intent (using [package + activityName])
<activity android:name=".MyActivity" >
<intent-filter>
<action android:name="com.mypackage.MyActivity" />
<category android:name="android.intent.category.DEFAULT" />
</intent-filter>
</activity>
If this filter not exists in
AndroidManifest.xml
, you will get this error: No Activity found to handle Intent splash screen
OR
Shows a native view.
document.addEventListener("deviceready", function() {
// pass a package name and a activity by params
cordova.plugins.NativeView.show('com.mycompany', 'MyActivity')
.then(function() {
/**
* Do something when open the activity.
* This code here will be executed in paralell,
* not after open.
*/
}).catch(function(error) {
/**
* error.success => Will be "false"
* error.name => Exception type from the captured error
* error.message => A exception message
*/
});
// Preferably, pass the Package and Activity in a json
cordova.plugins.NativeView.show({
packageName: 'com.mycompany',
className: 'MyActivity',
});
}, false);
Storyboard
name and storyboard id
document.addEventListener("deviceready", function() {
/*
* The first param is a storyboard name, and
* the second param is a storyboardId
* (conventionally the same name of the ViewController class name)
*/
cordova.plugins.NativeView.show('MyStoryboard', 'MyUIViewController')
.then(function() {
/**
* Do something when open the activity.
* This code here will be executed in paralell,
* not after open.
*/
});
// Preferably, pass the ViewController and Storyboard in a json
cordova.plugins.NativeView.show({
storyboardName: 'MyStoryboard',
viewControllerName: 'MyUIViewController'
});
}, false);
ViewController
class/xib name/*
* Or, pass only the UIViewController name, if you don't
* use storyboards in your project. This plugin try instantiate
* from a ".xib" file. If not exists, try instantiate just by
* UIViewController class.
*
* By convention, your ViewController class/xib needs contains 'Controller'
* string in any part of the name
* .
*/
cordova.plugins.NativeView.show('MyUIViewController');
// Preferably, pass the ViewController in a json
cordova.plugins.NativeView.show({
viewControllerName: 'MyUIViewController'
});
Storyboard
name/*
* Or, pass only the Storyboard name. If you don't pass a
* ViewController class name in second param, the
* "rootViewController" of your storyboard will be
* instantiated.
*
* By convention, your Storyboard name needs contains 'Storyboard'
* string in any part of the name
*/
cordova.plugins.NativeView.show('MyStorboard');
// Preferably, pass the Storyboard in a json
cordova.plugins.NativeView.show({
storyboardName: 'MyStorboard'
});
OR
Verify if another app that responds to a
uri
is installed on device.
cordova.plugins.NativeView.checkIfAppInstalled('another-app://custom-host')
.then(function() {
console.log('The app is INSTALLED!');
}).catch(function(error) {
console.log("The app is NOT INSTALLED!");
throw error;
});
// Preferably, pass the uri in a json
cordova.plugins.NativeView.show({
uri: 'another-app://custom-host'
});
OR
Open the store (Apple Store/Google Play) app installed in your device, or in a browser.
// Pass a app package on Android (found this on Google Play)
cordova.plugins.NativeView.showMarket('my.company.other.app');
// Preferably, pass the marketId in a json
cordova.plugins.NativeView.show({
marketId: 'my.company.other.app'
});
// Pass a app id from the Apple Store
cordova.plugins.NativeView.showMarket('idxyz1?mt=x');
// Preferably, pass the marketId in a json
cordova.plugins.NativeView.showMarket({
marketId: 'idxyz1?mt=x'
});
Get the current Android build variant configured in
/*
* Pass the param "catchError", and use the `catch()` method to verify an
* error (if happens)
*
* Otherwise, this method will return the variant like a string,
* or null if not found.
*
* This is useful if you need show a NativeView by environment
*/
cordova.plugins.NativeView.getBuildVariant({
catchError: true
}).then(function(value) {
console.log('My environment is: ' + value);
}).catch(function(error) {
if (!error.success && error.message) {
console.log(error.message);
}
});
/* Optionally, don't pass any parameter and get the Build Variant
* value, or NULL
*/
cordova.plugins.NativeView.getBuildVariant()
.then(function(value) {
console.log('My environment is: ' + value);
});
Replace document.addEventListener
event to this.platform.ready().then(...)
service method. See IONIC Platform documentation
This project is licensed under the MIT License - see the LICENSE file for details
Swift
implementation