---

theme: channing-cyan

距離2022年終總結過去了還沒一個月，我又回來寫文章啦！

依稀記得當時給2023年立下的flag（文章鏈接：再見2022，我的點點滴滴！！！），其中之一就是：完成公司的“電子秤冷庫APP項目”,在大餅的誘惑下，我拼命的碼功能，終於從2023.01.04 寫下第一行代碼，到2023.01.18，完成所有功能，併產出第一個測試版本。（當然我前期的 demo案例功能測試也為其做出了巨大貢獻，極大地縮短了開發所需的時間）。

這波APP功能開發過程中，敲得我每天手都是酸的，也再次讓我重新認識了自己（我真是太牛掰了！！！）。這是除了剛入行時，半個月完成150張App頁面之後，又一件讓我印象很深的事。

在此特意進行記錄下本次開發之旅，做一下總結收穫，並且希望當大家有類似需求的時候，回想起我的這篇文章能有所啟迪。

技術選型

1. HBuilderX 進行uniapp項目的搭建
2. Android Studio進行原生插件開發，以及離線打包測試
3. UView 進行項目頁面UI搭建

所需設備

1. 安卓屏，（安卓4.0 版本不支持；目前開發使用的安卓6.0.1）
2. 電子秤
3. 打印機
4. 掃碼槍

實現功能

1. 進行商品稱重、商品信息標籤打印
2. 進行商品信息錄入、入庫，信息查詢
3. 進行商品掃碼，出庫

開發過程（相關功能實現，採取的技術方案）

1. 稱重、打印

在本次項目開發中，電子秤、打印機採用的是串口通訊的方式。電子秤採用RS485串口接入安卓屏，打印機採用的RS232串口接入安卓屏。
因此，這個功能的實現離不開串口通訊。主要方法：與電子秤、打印機插件要相關串口通訊資料、demo，一般這些是採用安卓開發的，有相關原生的arr，支持在原生開發中直接調用已經封裝好的方法。只需要在原生Android開發中直接引入就可以了。
但是問題來了，我們採用的技術是uniapp進行安卓開發，這下應當怎麼辦呢！想必大家還記得我之前的文章：uniapp開發安卓原生插件，這也是我在該項目開始之前，做的技術沉澱。
我們可以採用開發安卓原生插件的方式，將電子秤、打印機相關的原生arr，封裝為可以在uniapp中使用的原生插件。這樣我們就可以在該項目中對電子秤、打印機隨心所欲的操控了！（我真是太機智了）。

注意事項：

在這裏我再次強調一下原生插件過程中應當注意的事： 1. 注意配置相關的簽名 2. 注意配置安卓包名，不能落了。

原生插件開發完畢後，我們可以在當前的項目中使用了。我們只需要在項目中添加nativeplugins目錄並進行相關配置即可。（具體的操作步驟詳情，請看上一篇文章：uniapp開發安卓原生插件）

正常情況下，我們在運行到安卓屏中後可以完成電子秤、打印機相關的控制。那麼如果我們要打包，在本機進行調試應該怎麼辦呢

1.1 雲打包

採用雲打包的形式，我們依靠HBuilder X 將我們的項目打包。在這個過程中，我們只需要輸入當前應用的證書信息即可。我們可以靜靜的等待打包完成，由於採用了原生插件所需的時間有點長，我們可以去喝個咖啡或者吞雲吐霧放鬆一下，回來你就會發現一切都已順利完成！（當然如果是第一次，大概率會發現出 bug 了。不要怕，根據提示信息進行修改即可） 當時DCloud對開發者，每天可以進行雲打包、製作自定義基座是有次數限制的，超額了需要花錢。作為一個勤儉持家的當代好青年，我們肯定不樂意，那麼下面的：本地打包方案，就有效解決了我們的問題。

1.2 本地打包

我們採用HBuilder X 中本地打包功能，可以生成本地打包資源。然後我們可以將資源引入 官方為我們提供的 app離線sdk中的 HBuilder-Integrate-AS 中，然後在進行了配置後，可以在Android Studio中進行調試。
採用這種方案，我們可操作的空間更大，也更便於我們對一些問題的排查。

注意事項

1. 我們要採用跟當前HBuilder X版本一致的 app離線sdk進行調試，否則會報：版本不一致，有潛在的問題
2. 我們要提前將 sdk 總的項目配置好，簽名、資源包
3. 我們要將自主開發的原生插件導入到 lib中，並在 assets - dcloud_uniplugins.json 中進行配置
4. 別忘了將 原生的打印機、電子秤arr也放到 lib中，否則有可能會出現異常

2. 掃碼

掃碼槍採用的USB連接，因此在項目中只需要在當前頁面中監聽 keydown 事件即可。然後將監聽獲取到的 keyCode 轉換為對應的字符即可。

注意事項

在完成該功能進行自測階段發現一個問題：
因為當前頁面中有 input 組件，用户有可能進行了點擊操作，此時 input 框聚焦，在這個時候就會出現一個現象：掃碼槍獲取到的值會作為輸入值，輸入到 input 中，這個時候頁面的 keydown 監聽是監聽不到該行為的。
當用户取消input聚焦後，再次進行掃碼操作，此時會出現：掃碼槍最後一個Enter操作消失，無法獲取 keyCode === 66 這個值。

解決方法

思路：掃碼槍造成的輸入操作，所花費的時間遠遠小於用户輸入的時間，因此可以設置個定時器，用來防止該行為的發生。

```js // 掃碼槍輸入內容 let inputValue = ''; // 掃碼槍input定時器。防止input聚焦導致的問題 let scanTimer = null;

onLoad() { uni.showLoading({ title: '加載中', mask: true });

// 添加鍵盤輸入的監聽；防止當前input 聚焦後，再次掃碼，無法觸發 enter
// #ifdef APP-PLUS
plus.key.addEventListener("keydown", (e) => {
    if(!inputValue) {
        uni.showLoading({
            title: '掃碼並獲取信息中...',
            mask: true,
        })
    }
    if (e.keyCode === 66 || e.key =='Enter') {
        // 根據獲取的條形碼數據，獲取商品信息
        clearTimeout(scanTimer);
        scanTimer = null;
        inputValue = '';
    } else {
        // keyMap 為 keyCode 對應的 字符表
        inputValue += keymap[e.keyCode];
        if(!scanTimer) {
            scanTimer = setTimeout(() => {
                scanTimer = null;
            }, 2000)
        }
    }
});
// #endif

}, ```

3. 商品信息錄入，信息查詢

要實現該功能的話，我們需要採用 官方提供的 SQLite（數據庫）模塊，相關資料可查看：SQLite官方文檔 該模塊在 下載的Android 離線SDK中可以找到（注意：要使用與開發版本一致的，防止出現未知的問題。）
我們創建數據庫，然後針對不同的信息、查詢需要，創建對應的數據表，即可。然後根據功能，進行增刪改查。在開發中，可以將於數據庫的相關操作、配置都提取出來，這樣便於整體項目的使用，也便於問題的排查。

至此，該項目大致功能的思路都已經介紹完畢，希望對各位有所啟發！
現在天選打工人的我還在上班，明天還有一天，公司堅持不到最後一天，絕不放假。各位看我這麼命苦，趕快給我點個贊，鼓勵鼓勵我吧！！感謝！！