【Cordova】cordova插件使用

修改安装的背景图标
下载文件
回退按钮
检测跳转第三方app

1.0 修改安装的背景图标

1.1 安装

cordova plugin add cordova-plugin-splashscreen

1.2 替换原有cordova的图片
1.3 在cordova config.xml 文件中引入以下代码

<platform name="android"><icon density="ldpi" src="res/icon/android/icon-36-ldpi.png" /><icon density="mdpi" src="res/icon/android/icon-48-mdpi.png" /><icon density="hdpi" src="res/icon/android/icon-72-hdpi.png" /><icon density="xhdpi" src="res/icon/android/icon-96-xhdpi.png" /><splash density="port-hdpi" src="res/screen/android/screen-hdpi-portrait.png" /><splash density="port-ldpi" src="res/screen/android/screen-ldpi-portrait.png" /><splash density="port-mdpi" src="res/screen/android/screen-mdpi-portrait.png" /><splash density="port-xhdpi" src="res/screen/android/screen-xhdpi-portrait.png" /></platform>

2.0 下载文件

2.1 安装

cordova plugin add cordova-plugin-file-transfer

2.2 文档地址：https://cordova.apache.org/docs/en/latest/reference/cordova-plugin-file-transfer/

2.3 案例地址：https://blog.csdn.net/mooonyuan/article/details/83090303

3.0 回退按钮

3.1 安装

cordova plugin add cordova-plugin-backbutton

3.2 文档地址：https://cordova.apache.org/docs/en/5.1.1/cordova/events/events.backbutton.html

以下是监听当跳转到home页的时候，监听回退按钮，执行退出程序

 mounted() {this.initialize();},data() {return {ready: false};}watch: {$route(to, from) {if (this.ready) {//监听路由，当设备准备好之后，判断to的值是否是需要监听回退按钮的值，是就开启监听，不是就移除监听if (  to.name === 'Home' ) {document.addEventListener('backbutton', this.onBackDown, false);} else {document.removeEventListener('backbutton', this.onBackDown, false);}}}},methods: {/* 初始化设备 */initialize() {document.addEventListener('deviceready',this.onDeviceReady.bind(this),false);},/* 设备初始化之后监听返回按钮事件 */onDeviceReady() {this.ready = true;},/* 返回按钮事件 */onBackDown() {/* 当设备已准备并且当前页时在主页的时候 退出程序 */navigator.app.exitApp();}},

4.0 检测跳转第三方app

4.1 检测是否安装了第三方app

cordova plugin add appavailability

4.1.1 文档地址： https://www.npmjs.com/package/cordova-plugin-appavailability

4.2 跳转第三方APP

ordova plugin add com.lampa.startapp

4.2.2 文档地址：https://github.com/lampaa/com.lampa.startapp

appAvailability.check('cn.com.lezhixing.clover.xf', //  Package Namefunction(info) {// Success callback 已安装// Info parameter is available only for androidwindow.location.href = "fleaf://lezhixing/open";},function() {_this.popupAppVisible = true;//未检测到安装});

注：如果你跳转的第三方是特殊的带头地址，需要在cordova的config.xml中添加以下代码

<allow-intent href="fleaf://lezhixing/*" />

【Cordova】cordova插件使用相关推荐

cordova开发插件，并在android studio中开发、调试
之前用过cordova Lib包装H5页面,自己写插件,但做法是野路子,不符合cordova插件的开发思路,这次项目又需要包装H5页面,同时需要自定义插件.所以又折腾了一次cordova自定义插件. ...
cordova自定义android插件,Cordova 自定义插件(Android版本)
Cordova 自定义插件(android) 特别注意 android 项目的包名必须为 com.example.hello,否则编译不会通过. 1.安装命令工具 $ npm i plugman - ...
ionic3 cordova ionic-native插件
ionic-native插件 cordova安装插件以及 ionic-native插件使用过程以及步骤 cordova plugin add cordova-plugin-插件名称. //安装插件 ...
Vue.js 使用cordova camera插件调取相机
介绍完上文用Cordova打包Vue项目之后,本文给出在vue.js里如何使用cordova的插件完成调取相机及图库,并完成图片上传的操作. 具体的操作步骤如下第一步:在cordova项目下安装c ...
vue调用cordova 插件_Vue.js 使用cordova camera插件调取相机
本文给出在vue.js里如何使用cordova的插件完成调取相机及图库,并完成图片上传的操作. 具体的操作步骤如下第一步:在cordova项目下安装cordova-plugin-camera插件 c ...
cordova camera插件——摄像头插件的使用及上传图片
介绍 cordova提供照相机API与设备相机进行交互. 通过照相机API.我们可以拍摄或者访问照片库中的照片,返回图片的base64编码字符串或者图片的url文件路径. 安装插件需要cordova ...
Cordova各个插件使用介绍系列（七）—$cordovaStatusbar手机状态栏显示
在项目中发现Android和iOS在手机状态栏样式不一样,然后就查到有一个cordova插件可以解决这个问题 1.下载插件$cordovaStatusbar命令: cordova plugin add ...
科大讯飞cordova语音插件填坑及api介绍
项目要求语音合成,准备调用科大讯飞的cordova插件,百度仅有一篇有价值的参考文章(再吐槽下,百度搜索到各种复制的文章....),谷歌有2篇,但介绍不全,只用typescript列出api,没有ap ...
cordova splashscreen插件在android平台的使用
先到插件网站找这个插件插件网站地址 http://cordova.apache.org/plugins/ 然后找到了这个 cordova-plugin-splashscreen 插件地址是htt ...
Cordova自定义插件
项目原因需要自定义Cordova插件,下面把实现过程记录以便将来查阅. 工程为Eclipse下的Android工程,该工程已经引入Cordova.Cordova版本4.0.2. 1.定义插件类Open ...