Cordova WP8 插件开发

简介: 原文:Cordova WP8 插件开发  前面博客中介绍了Cordova WP8平台上的安装部署,Cordova扩展可以利用WP8本地代码扩展WebApp的功能,调用本地能力需要开发相应的插件,下面以闪光灯作为实例来描述创建一个WP8插件的详细步骤,对于闪光灯实现打开和关闭两个接口函数。
原文: Cordova WP8 插件开发

  前面博客中介绍了Cordova WP8平台上的安装部署,Cordova扩展可以利用WP8本地代码扩展WebApp的功能,调用本地能力需要开发相应的插件,下面以闪光灯作为实例来描述创建一个WP8插件的详细步骤,对于闪光灯实现打开和关闭两个接口函数。

  

1.  创建插件类

  创建闪光灯插件类FlashLight需继承BaseCommand,通常我们会在工程目录下创建Plugins目录用于存放插件类。即在Plugins目录下创建FlashLight.cs文件。

  编写FlashLight.cs文件,添加如下代码:

 1 using System;
 2 using System.Collections.Generic;
 3 using System.Linq;
 4 using System.Text;
 5 using System.Threading.Tasks;
 6 using Windows.Phone.Media.Capture;
 7 using WPCordovaClassLib.Cordova;
 8 using WPCordovaClassLib.Cordova.Commands;
 9 
10 namespace TestCordova.Plugins
11 {
12     class FlashLight : BaseCommand
13     {
14         /// <summary>
15         /// 闪光灯实例
16         /// </summary>
17         protected static AudioVideoCaptureDevice Device { get; set; }
18 
19         /// <summary>
20         /// 打开闪光灯
21         /// </summary>
22         /// <returns></returns>
23         public async Task trunOn(string options)
24         {
25             var sensorLocation = CameraSensorLocation.Back;
26 
27             try
28             {
29                 if (Device == null)
30                 {
31                     //取得 AudioViceoCaptureDevice
32                     Device = await AudioVideoCaptureDevice.OpenAsync(sensorLocation, AudioVideoCaptureDevice.GetAvailableCaptureResolutions(sensorLocation).First());
33                 }
34 
35                 // 打开闪光灯
36                 var supportedCameraModes = AudioVideoCaptureDevice.GetSupportedPropertyValues(sensorLocation, KnownCameraAudioVideoProperties.VideoTorchMode);
37                 if (supportedCameraModes.ToList().Contains((UInt32)VideoTorchMode.On))
38                 {
39                     Device.SetProperty(KnownCameraAudioVideoProperties.VideoTorchMode, VideoTorchMode.On);
40 
41                     // 设定亮度为最大
42                     Device.SetProperty(KnownCameraAudioVideoProperties.VideoTorchPower, AudioVideoCaptureDevice.GetSupportedPropertyRange(sensorLocation, KnownCameraAudioVideoProperties.VideoTorchPower).Max);
43                 }
44 
45                 //返回状态
46                 DispatchCommandResult(new PluginResult(PluginResult.Status.OK, "{data: \"ok\"}"));
47             }
48             catch (Exception ex)
49             {
50                 // 无法控制闪光灯,返回错误状态
51                 DispatchCommandResult(new PluginResult(PluginResult.Status.JSON_EXCEPTION));
52             }
53         }
54 
55         /// <summary>
56         /// 关闭闪光灯
57         /// </summary>
58         public void trunOff(string options)
59         {
60             var sensorLocation = CameraSensorLocation.Back;
61 
62             try
63             {
64                 var supportedCameraModes = AudioVideoCaptureDevice
65                     .GetSupportedPropertyValues(sensorLocation, KnownCameraAudioVideoProperties.VideoTorchMode);
66                 // 关闭闪光灯
67                 if (Device != null && supportedCameraModes.ToList().Contains((UInt32)VideoTorchMode.Off))
68                 {
69                     Device.SetProperty(KnownCameraAudioVideoProperties.VideoTorchMode, VideoTorchMode.Off);
70                 }
71 
72                 //返回状态
73                 DispatchCommandResult(new PluginResult(PluginResult.Status.OK, "{data: \"ok\"}"));
74             }
75             catch (Exception ex)
76             {
77                 // 无法控制闪光灯,返回错误状态
78                 System.Diagnostics.Debug.WriteLine(ex);
79                 DispatchCommandResult(new PluginResult(PluginResult.Status.JSON_EXCEPTION));
80             }
81         }
82     }
83 }
FlashLight

  由于调用闪光灯需要打开硬件的部分能力,所以需要配置WMAppManifest.xml文件勾选ID_CAP_ISV_CAMERAID_CAP_MICROPHONE

 

2.  配置config.xml

  打开config.xml文件在widget元素内加入配置:

1   <feature name="FlashLight">
2     <param name="wp-package" value="FlashLight" />
3   </feature>

  说明:以上配置是基于FlashLight类的命名空间为Cordova.Extension.Commands,如果将命名空间修改为其他,例如:TestCordova.Plugins,那么上述配置需修改为:

1   <feature name="FlashLight">
2     <param name="wp-package" value="TestCordova.Plugins.FlashLight" />
3   </feature>

 

3.  编写js代码

  打开index.html,编写js代码如下:

    <script type="text/javascript">
        app.initialize();

        function trunOn() {
            cordova.exec(
                function (data) {
                    //调用C#代码成功的回调函数
                    alert("Sucess:" + data);
                },
                function (data) {
                    //调用C#代码失败的回调函数
                    alert("Fail" + data);
                }
                , "FlashLight", "trunOn", ["input string"]);
        }

        function trunOff() {
            cordova.exec(
                function (data) {
                    //调用C#代码成功的回调函数
                    alert("Sucess:" + data);
                },
                function (data) {
                    //调用C#代码失败的回调函数
                    alert("Fail" + data);
                }
                , "FlashLight", "trunOff", ["input string"]);
        }
    </script>

  添加两个button按钮,代码如下:

    <div class="app">
        <h1>Apache Cordova</h1>
        <div id="deviceready" class="blink">
            <p class="event listening">Connecting to Device</p>
            <p class="event received">Device is Ready</p>
        </div>
        <div>
            <button type="button" value="打开" style="width: 100px; height: 50px; color: black; font-size: larger;" onclick="trunOn()">打开</button>
            <button type="button" value="关闭" style="width: 100px; height: 50px; color: black; font-size: larger;" onclick="trunOff()">关闭</button>
        </div>
    </div>

 

4.  运行

  编译并运行wp8工程,界面显示效果如下图:

目录
相关文章
|
4月前
|
开发工具 开发者 git
2023 Visual Studio Code 插件推荐:18 个提高开发效率的常用插件
Visual Studio Code (简称VSCode) 是一款强大的开源代码编辑器,它拥有众多功能强大的扩展插件,使得开发者可以根据自己的需求来定制编辑器的功能和外观。在本文中,我们将分享一些非常实用的 VSCode 插件,这些插件将提高您的开发效率,使编码变得更加愉快。
119 0
|
11月前
|
存储 前端开发 JavaScript
05. 使用 cordova plugman 编辑和添加插件
05. 使用 cordova plugman 编辑和添加插件
142 0
|
IDE 程序员 定位技术
phpstorm好用插件集
phpstorm好用插件集
632 0
|
开发工具
AndroidStudio插件开发(进阶篇之Editor)
AndroidStudio插件开发(进阶篇之Editor)
AndroidStudio插件开发(进阶篇之Editor)
|
JavaScript 前端开发 API
Webview的使用 | VSCode插件开发系列教程
其实VSCode也是基于electron框架的桌面软件,也就是说,你在VSCode里看到的所有的界面本就是网页。那在网页里再显示网页怎么做?相信你也想到了,就是iframe。
1150 0
Webview的使用 | VSCode插件开发系列教程
|
Web App开发 移动开发 Java
Cordova4.0 系列 -- 基本环境搭建(1)
  一. 安装Node.js基本环境   官网下载地址:https://nodejs.org/   安装成功之后可以使用简单命令查看其版本 node -v   npm相关命令 node cli.
1115 0
|
移动开发 JavaScript Java
给Ionic写一个cordova(PhoneGap)插件
    给Ionic写一个cordova(PhoneGap)插件   之前由javaWeb转html5开发,由于面临新技术,遂在适应的过程中极为挣扎,不过还好~,这个过程也极为短暂;现如今面临一些较为复杂的需求还会有一丝丝头痛,却没有一开始那么强烈了。
1928 0
|
Apache Android开发 JavaScript
WebStorm 之 Cordova 环境搭建
原文:WebStorm 之 Cordova 环境搭建 一、环境搭建   Cordova 环境配置之前,应先下载安装 Node.js ,中文官网:http://nodejs.cn/。   以管理员身份运行 cmd 命令行工具:   1、查看 Node.
1712 0
|
JavaScript Android开发 API
vs2017 js cordova + dotnet core 开发app
原文:vs2017 js cordova + dotnet core 开发app 1.记得在index.html加入          2.控件click事件绑定    document.querySelector('#button1').
1299 0