SAP UI5 應用開發教程之五十 - 如何使用 Chrome 調試運行在手機上的 SAP UI5 Cordova 混合應用試讀版

Jerry 從 2014 年加入 SAP成都研究院 CRM Fiori 開發團隊之后開始接觸 SAP UI5，曾經在 SAP 社區和“汪子熙”微信公眾號上發表過多篇關于 SAP UI5 工作原理和源碼解析的文章。

在 Jerry 這篇文章 對 SAP UI5 一無所知的新手，從哪些材料開始學習比較好？ 曾經提到，Jerry 也是從 SAP UI5 菜鳥一路走過來，深知只有 ABAP 開發背景的開發者，向 SAP UI5 開發領域轉型的不易，因此我在業余時間設計了這份適合 SAP UI5 初學者的學習教程，把開發一個完整的 SAP UI5 應用的流程，拆分成若干個步驟，力求每個步驟里，把涉及到的知識點都涵蓋到。這些知識點可能不像我的 UI5 源碼分析系列文章那么深入，但力求淺顯易懂，便于 SAP UI5 初學者理解。

本教程每一個步驟的源代碼，都存放在我的 Github 上，分別用文件夾 01，02，03 等等來標識。

每一個步驟均是前一步驟的基礎上，添加了若干新特性。建議零基礎或者對 SAP UI5 知之甚少的初學者，按照順序從第一個步驟開始循序漸進地學習，把這些代碼下載到本地，配合教程的文字講解，自己動手，以加深理解。

大家如果對教程的每個步驟有任何疑問，歡迎在教程對應的步驟文章里給我評論，進行留言。

本教程的前一步驟，我們介紹了如何使用Cordova將已經開發好的，能夠在 PC 端運行的 SAP UI5 應用，構建并打包成 apk 文件，以便像 Android 原生應用一樣，安裝到安卓移動設備上運行：

SAP UI5 應用開發教程之五十 - 如何使用 Cordova 將 SAP UI5 應用生成一個能在 Android 手機上安裝的混合應用。

我們把通過 SAP UI5 經過 Cordova 打包之后生成的應用稱為Hybrid Application即混合應用。

當混合應用運行在移動設備上時，如果遇到不能按照我們期望工作的情形，如何進行調試呢？我們不需要使用重型的Android Studio進行調試，這是因為如上圖所示，Cordova 混合應用從本質上說，仍然是一個運行在 HTML Rendering Engine 即 WebView 容器中的 Web 應用，因此我們仍然可以采用本教程第 49 步驟介紹的調試方式，通過 PC 端 Chrome 開發者工具連接手機上的 Cordova 混合應用進行調試。

SAP UI5 應用開發教程之四十九 - 如何在桌面電腦端調試運行在手機上的 SAP UI5 應用

下面是詳細的調試步驟。

我選擇了將第 48 個步驟開發完成的代碼，制作成 Cordova 應用，試圖在手機上運行，條用手機攝像頭camera，進行條形碼的掃描：

SAP UI5 應用開發教程之四十八 - 如何在 SAP UI5 應用里開發條形碼掃描功能。

但是運行這個應用時，沒有看到期望的攝像頭掃描場景，而是顯示了一個掃描器不可用的提示：

我希望通過調試的方式，找到這個行為的原因。

按照這篇教程里的步驟，將教程第 48 個步驟開發成的 SAP UI5 應用，制作成 Cordova 應用，通過數據線 + apk 的方式，安裝到手機上運行。

下面是詳細的調試步驟和 SAP UI5sap.ndc.BarcodeScanner控件的工作原理分析。