phonegap的Notification 振动 响铃和弹窗 android

phonegap的API提供Notification 震动 响铃 调用原生弹窗功能.

此篇文章以cordova 3.3版本编写

据我总结核心步骤:  创建工程 ; 下载插件 ;编译工程; 调用插件;

          按照如下步骤就能生产出代码:

打开cmd 控制台

1 使用命令行 建立phonegap工程

2 进入到phonegap工程下的plugins 文件夹当中  ,使用命令行下载官方插件 ;(输入命令: cordova plugin add org.apache.cordova.vibration)

4 添加生成  android或者IOS 工程 ;android命令如下cordova platform add android     (注:oc的把android换成ios)

5 在命令行输入cordova build

6 最后将生成的工程导入编辑器(我用的eclipse)

在assets/www目录下在index.html中添加 javascript 调用语句

 

接下来给大家演示:

目测大家都是已经安装好环境的,如果没有搭好环境 可以查看我的phonegap配置文章点击打开链接

调用系统的API 官方文档地址   点击打开链接

<1> 在控制台    创建一个phonegap工程  命令如下

 

phonegap create my-app
 cd my-app
 phonegap run android

<2> 我们从命令行进入 到工程目录下的  plugins文件夹

 

cd my-app cd plugins

 

<3> 现在开始下载插件   本篇讲述camera  :

输入:

cordova plugin add org.apache.cordova.dialogs 
cordova plugin add org.apache.cordova.vibration


 

cordova plugin add org.apache.cordova.camera

 

 

插件下载完毕

<4> 添加android 平台工程  (ios把 "android" 替换)

 

cordova platform add android

<5> 编译android工程

 


 

cordova build

 

至此  Notification 已经生成...

 

 

检查下配置文件有没有生成      如果没有生成就再次   cordova.build     编译一次

 

(in app/res/xml/config.xml)
<feature name="Notification">    
<param name="android-package" value="org.apache.cordova.dialogs.Notification" />
</feature>
<feature name="Vibration">    
<param name="android-package" value="org.apache.cordova.vibration.Vibration" />
</feature> 
(in app/AndroidManifest.xml)
<uses-permission android:name="android.permission.VIBRATE" />


 


 


 

 

现在大家只需要将工程导入到eclipse当中 使用官方APi语句在javascript中调用

将下方语句考到   assets目录下  www/index.html  当中  完全复制过去;

 

 

example:

<!DOCTYPE html>
<html>  
<head>   
 <title>Capture Photo</title>  
 <script type="text/javascript" charset="utf-8" src="cordova.js"></script>   
 <script type="text/javascript" charset="utf-8">    
    var pictureSource;   // picture source 
    var destinationType; // sets the format of returned value    
    // Wait for device API libraries to load    //   
    document.addEventListener("deviceready",onDeviceReady,false);    
        // device APIs are available    //    
        function onDeviceReady() {        pictureSource=navigator.camera.PictureSourceType;        destinationType=navigator.camera.DestinationType;    }   
        // Called when a photo is successfully retrieved    //   
        function onPhotoDataSuccess(imageData) {      
        // Uncomment to view the base64-encoded image data      // 
        console.log(imageData);      
        // Get image handle      //      
        var smallImage = document.getElementById('smallImage');      
        // Unhide image elements      //     
        smallImage.style.display = 'block';      
        // Show the captured photo      // The in-line CSS rules are used to resize the image      //     
        smallImage.src = "data:image/jpeg;base64," + imageData;    }    
        // Called when a photo is successfully retrieved    //   
        function onPhotoURISuccess(imageURI) {      
        // Uncomment to view the image file URI      // 
        console.log(imageURI);      
        // Get image handle      //     
        var largeImage = document.getElementById('largeImage');      
        // Unhide image elements      //    
        largeImage.style.display = 'block';      
        // Show the captured photo      // The in-line CSS rules are used to resize the image      //    
        largeImage.src = imageURI;    }    
        // A button will call this function    //    
        function capturePhoto() {      
        // Take picture using device camera and retrieve image as base64-encoded string     
        navigator.camera.getPicture(onPhotoDataSuccess, onFail, { quality: 50,        destinationType: destinationType.DATA_URL });    }    
        // A button will call this function    //   
        function capturePhotoEdit() {      
        // Take picture using device camera, allow edit, and retrieve image as base64-encoded string    
        navigator.camera.getPicture(onPhotoDataSuccess, onFail, { quality: 20, allowEdit: true,        destinationType: destinationType.DATA_URL });    }    
        // A button will call this function    //    
        function getPhoto(source) {      
        // Retrieve image file location from specified source  
        navigator.camera.getPicture(onPhotoURISuccess, onFail, { quality: 50,        destinationType: destinationType.FILE_URI,        sourceType: source });    }    
        // Called if something bad happens.    //   
        function onFail(message) {      alert('Failed because: ' + message);    }   
    </script>
</head> 
<body>  
    <button οnclick="capturePhoto();">Capture Photo</button> <br>
    <button οnclick="capturePhotoEdit();">Capture Editable Photo</button> <br>  
    <button οnclick="getPhoto(pictureSource.PHOTOLIBRARY);">From Photo Library</button><br>  
    <button οnclick="getPhoto(pictureSource.SAVEDPHOTOALBUM);">From Photo Album</button><br> 
    <img style="display:none;width:60px;height:60px;" id="smallImage" src="" />  
    <img style="display:none;" id="largeImage" src="" />  

</body>
</html>

 

 

 

3个按钮

show alert 按钮 调用 Dialog

play Beep  按钮调用 声音提示

Vibrate   按钮调用  震动

 

参数详解:

      调用系统的API 官方文档地址 点击打开链接

phonegap的工程:

工程下载    点击打开链接

 

将phonegap的platforms导入到eclipse中  

如果报错clear一下  查看导的lib包 有没有报错

Demo 我亲自用真机测过  测试手机为 联想S939 与三星 s3 9300

 

如果还是报错    请查看 是否是  因为没有用android 最新的SDK   我目前的版本的是   4.4.2    ( API  19)

 

 

 

 

评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值