SAP UI5 应用开发教程之五十二 - 如何使用 SAP UI5 的标准控件结合 Cordova 插件调用手机摄像头进行条形码扫描试读版

简介: SAP UI5 应用开发教程之五十二 - 如何使用 SAP UI5 的标准控件结合 Cordova 插件调用手机摄像头进行条形码扫描试读版

本教程之前的这几篇文章,算是围绕着 SAP UI5 和 Cordova 的一个小系列:

  • SAP UI5 应用开发教程之四十八 - 如何在 SAP UI5 应用里开发条形码扫描功能 - 通过这篇文章介绍的步骤开发而成的 SAP UI5 应用,只能在桌面浏览器里正常运行,在用户授权的情况下,打开笔记本电脑的摄像头。
  • SAP UI5 应用开发教程之四十九 - 如何在桌面电脑端调试运行在手机上的 SAP UI5 应用
  • SAP UI5 应用开发教程之五十 - 如何使用 Cordova 将 SAP UI5 应用生成一个能在 Android 手机上安装的混合应用
  • SAP UI5 应用开发教程之五十一 - 如何使用 Chrome 调试运行在手机上的 SAP UI5 Cordova 混合应用 - 如果一个 SAP UI5 应用使用了 sap.ndc.BarcodeScanner并且通过 Cordova 构建打包,生成 apk 文件安装到安卓手机上。在手机上运行时,点击 Scan 按钮,仍然不能弹出我们期望看到的手机摄像头扫描界面。通过调试发现,这是由于 sap.ndc.BarcodeScanner 的内部实现里,首先会去检测 cordova.plugins.barcodeScanner 是否可用。当且仅当我们在将 SAP UI5 应用打包成 Cordova 应用时,显式添加 `` 这个 Cordova plugin 到项目时,cordova.plugins.barcodeScanner 才会被赋予正确的值。


20.png

本文余下部分介绍如何在一个 Cordova 应用中启用 cordova-plugin-barcodescanner.

实现的效果如下:

21.png

选择仅在使用该应用时允许即可。

我们在允许该请求之前,HelloCordova 应用在手机 设置 面板里,在权限里显示的是无需权限

image.png

允许 Cordova 应用请求摄像头的申请后,权限面板显示如下:

image.png

现在就能使用手机摄像头,扫描条形码了:

22.png

扫描成功的界面如下图所示:

23.png

详细步骤参考这篇文章


目录
相关文章
使用 SAP UI5 Event Bus 机制,修复 SAP UI5 分页显示数据的一个 bug 试读版
使用 SAP UI5 Event Bus 机制,修复 SAP UI5 分页显示数据的一个 bug 试读版
|
11月前
|
中间件 开发工具
使用 SAP Fiori Tools 提供的中间件导入本地下载的 SAP UI5 库文件来启动 SAP UI5 应用试读版
使用 SAP Fiori Tools 提供的中间件导入本地下载的 SAP UI5 库文件来启动 SAP UI5 应用试读版
|
2月前
|
JavaScript
vue + element UI【实战】音乐播放器/语音条(内含音频的加载、控制,事件监听,信息获取,手机网页阴影的去除等技巧)
vue + element UI【实战】音乐播放器/语音条(内含音频的加载、控制,事件监听,信息获取,手机网页阴影的去除等技巧)
44 1
|
11月前
|
JavaScript 前端开发 应用服务中间件
SAP UI5 本地开发时 ui5.yaml 文件对构建 Release 版本应用目录的影响分析试读版
SAP UI5 本地开发时 ui5.yaml 文件对构建 Release 版本应用目录的影响分析试读版
|
11月前
|
XML 存储 大数据
使用 SAP UI5 sap.ui.export.Spreadsheet API 进行 Excel 导出的一些限制
使用 SAP UI5 sap.ui.export.Spreadsheet API 进行 Excel 导出的一些限制
|
11月前
|
XML 开发框架 数据格式
SAP UI5 应用开发教程之五十七 - 基于 OData 注解的 Smart Field 使用方法学习试读版
SAP UI5 应用开发教程之五十七 - 基于 OData 注解的 Smart Field 使用方法学习试读版
SAP UI5 应用开发教程之五十七 - 基于 OData 注解的 Smart Field 使用方法学习试读版
|
11月前
SAP UI5 应用开发教程之五十二 - 如何使用 SAP UI5 的标准控件结合 Cordova 插件调用手机摄像头进行条形码扫描试读版
SAP UI5 应用开发教程之五十二 - 如何使用 SAP UI5 的标准控件结合 Cordova 插件调用手机摄像头进行条形码扫描试读版
SAP UI5 应用开发教程之五十二 - 如何使用 SAP UI5 的标准控件结合 Cordova 插件调用手机摄像头进行条形码扫描试读版
|
11月前
使用 UI5 Tools 这款 Visual Studio Code 扩展来管理和运行本地 SAP UI5 应用试读版
使用 UI5 Tools 这款 Visual Studio Code 扩展来管理和运行本地 SAP UI5 应用试读版
|
11月前
|
JavaScript 前端开发 API
通过一个实际例子,理解 SAP UI5 sap.ui.model.odata.v2.ODataModel API 中 BindingContext 绑定上下文的概念和用法试读版
通过一个实际例子,理解 SAP UI5 sap.ui.model.odata.v2.ODataModel API 中 BindingContext 绑定上下文的概念和用法试读版
|
11月前
|
XML 前端开发 API
SAP UI5 sap.ui.export.Spreadsheet API 介绍
SAP UI5 sap.ui.export.Spreadsheet API 介绍
下一篇
DDNS