2021年3月3日 星期三

jQuery Mobile 學習筆記 (十八) : 用 appsgeyser 將行動網頁轉成 App

以前曾經找到一個 appsgeyser 網站可將行動網頁轉成原生 App, 那時只用一個簡單的網頁測試了一下, 確定產生的 Apk 檔可順利安裝到 Android 手機 (手機設定須開啟 "允許不明的來源"), 這對不需要用到手機硬體例如相機與 GPS 等功能的行動網頁而言非常方便, 參考 :



首先在 appsgeyser 首頁按 "CREATE APP NOW" 鈕 :




在 "Website URL" 欄填入行動網頁首頁 index.htm 網址, 按 NEXT 鈕 :




在 "APP NAME" 欄位填入 App 名稱, 按 NEXT 鈕 :




在 "ICON" 欄勾選 "Custom icon" (也可用預設), 再按右邊的 "Upload" 鈕上傳最大 512*512 px 的圖檔 (png/jpg/gif 等), 我下載聯合國的 Covid-19 圖示加以編輯, 加上 STOP 字樣作為 App 的圖示, 再用線上軟體 https://www.remove.bg/ 去背, 上傳後還可以截圖, 不需要就直接按 "Crop 鈕" 即可, 按 NEXT 鈕即完成 App 製作準備 : 

 




按 "CREATE" 鈕即開始轉換為 App 作業 :  




但轉換前會要求註冊為會員 (免費會員一次只能轉一個 App), 我因上回已註冊過, 故按 Log In 鈕直接登入, 一會兒便轉換完畢了 (檔名為 _Vaccine_Test_13322400.apk) : 






按 Download 鈕出現 Email 傳送 Apk 檔與 QR code 兩種下載方式 :




也可以按 Apk id 旁的下載鈕將其下載到電腦中保存 :




我用手機掃 QR code 直接下載 Apk 檔, 但安裝前須在手機設定中開啟 Chrome "允許安裝未知來源程式" 權限才行, 以我的三星 Note8 為例 (Android 9), 程序如下 :







參考 :


這樣便能安裝從 Chrome 下載的 Apk 檔了 (因為 appsgeyser 是網路服務, 所產生的 Apk 是從 Chrome 下載, 所以要選擇 Chrome), 安裝時還會出現安全警示, 接受後即可順利安裝, 完畢就可在桌面看到這個有自訂圖示特色的 App 了 : 




點擊執行此 App 確認功能與使用瀏覽器操作行動網頁時完全相同, 轉成原生 App 的好處就是不需要記網址了. 由於 appsgeyser 免費用戶一次只能保存一個專案, 因此上面轉換出來的 Apk 下載 QR code 因為轉別的行動網頁而失效, 因此我將這次下載的 Apk 檔與其圖示 vaccine_test.png 壓縮為 zip 檔寄存 GitHub :

沒有留言:

張貼留言