不到一個月用業餘時間擼了個App

Keep-Up發表於2020-10-27
APP

起因

雖然是個程式設計師，但是從來沒做過 Android 和 iOS 應用的開發。但是一直有一個想法，想開發一個自己的 App 並且釋出。
為此，也做了一些瞭解，釋出到 Apple App Store 需要開發者賬號，這個賬號每年 99 刀，在這不得不吐槽一句太貴了，還不是終身，而是每年 99 刀，尤其對於我這種非專業 iOS 開發者來說，又沒那麼多應用釋出，就有些不值得。所以只能轉 Android 平臺了，也瞭解了一下國內的眾多安卓應用市場，這裡也得吐槽一下，國內的 Android 市場太混亂了，每家都有一個，每家有每家的要求和政策。但是基本上都是需要軟著的，這個是沒辦法繞過去的。所以，必須要去申請一個軟著（目前還在申請中）。然後，國外的 Android 商店就是 Google Play 了，開發者賬號25刀，並且還是終身的（不得不說，對於開發者來說很良心啊）。這麼便宜，我也就申請了一個，準備也釋出到 Google Play上。

相識

去年底的時候，無意中看到了 Flutter，它是 Google 開源的 UI 工具包，可以讓開發者通過一套程式碼庫，高效的構建多平臺精美應用，現在可以說是全平臺支援了，移動、Web、桌面和嵌入式平臺都支援。真是非常強大啊。後邊也一直有關注和了解，發現使用的人也越來多，我也嘗試了安裝和跑通了官方的 Demo。Flutter 本身就提供了非常多的漂亮內建元件，讓你即使在沒有美工設計的情況下，程式設計師自己都能非常方便的設計出好看介面。這就非常適合我這種不會畫圖和設計的程式設計師了。而且Flutter 還有很多開源的第三方 Package 包，在這裡可以找到各種工具包，避免重複造輪子。

總之，Flutter 給我的感覺就是很強大，結合本身自帶基礎元件和第三方 Package 包，能夠大大提高開發者的效率。只是有兩點：1、Flutter 使用的是 Dart 語言，這個語言比較小眾，不過有程式設計基礎的學起來非常快，邊用邊學，基本很快就能上手。2、Dart 程式碼的謎之巢狀，程式碼可能會巢狀 n 多層，在修改的時候可能會比較麻煩，不過使用 AndroidStudio 和 VS Code 編輯器都提供了非常方便的快捷鍵，也基本能解決這個問題。

開始

我是在這個十一假期正式開始這個 App 的開發。都說熟悉一門新的框架，從一個 Todolist 開始。我這次也不例外，也是一個 Todo 類應用。

因為我也想通過這個 App 熟悉整個 Flutter 的框架和一個完整 App 的開發流程。所以我給自己的這款 App 確定了以下功能，在確定功能的同時還要調研實現這個功能需要那些技術和平臺支援，比如說實現註冊和登入功能，那就需要有伺服器，自己也沒寫過伺服器，所以就找有沒有提供類似功能支援的平臺。最後國內我找到了兩家提供支援的平臺 LeanCloud 和 Bmob，通過比較最後我選擇了 LeanCloud，兩家功能差不多（當然不止是註冊登入功能，還有很多服務），我只是根據我自己的需求選擇了其中一家。國外當然是首選 Firebase 了，免費，功能強大（可惜國內不支援）。最後我確定了以下功能和技術選型：

  • 註冊登入功能（國內 LeanCloud，國外 Firebase）
  • Todo list 功能，todo 提醒功能
  • 筆記本功能
  • 主題切換
  • 多語言切換

主要就是以上幾個主要功能，下面帶你們來看一下，沒有美工，一個程式設計師使用 Flutter 能做出來什麼樣的介面。

登入

登入本來打算實現郵件密碼登入和手機號驗證碼登入，微信、QQ等第三方登入。奈何調研之後發現，手機驗證碼是需要付費的，本人窮屌絲一枚，無奈只能放棄手機驗證碼登入；微信和QQ等第三方登入大都需要企業資質，無奈個人開發者也只能放棄（當然，如果你確實需要可以個人註冊公司，或者找第三方掛靠）。最後只能使用郵件和密碼登入了。國外也是使用郵件密碼登入，不過還接入了 Google 第三登入（後續會加上FB，Twitter等），不需要什麼資質和條件，在這不得不說一下，國外貌似對個人開發者更加友好。

然後就是忘記密碼，通過郵件重置密碼。下面是截圖：

BMGPdH.png

Todo

Todo 可以建立一個 Todo list 列表，然後列表裡新增具體的 Todo 事項，Todo 列表可以收起和展開，可以為不同的 Todo 列表設定不同的顏色來區分，具體的 Todo 事項可以新增提醒功能。大體就這麼多。來看一下應用內截圖。

BMGCee.png
BM8zQK.png
BMGSsO.png

筆記

可以把一些重要的東西或者內容記下來，隨你使用，自己記日記，寫作文都沒問題。

BM8vz6.png

設定

最後就是設定裡邊，可以切換深淺兩種主題，切換不同的語言，還有退出登入。

BMGpLD.png
BMYwGR.jpg

推薦

在整個開發的過程中我把我用的一些好用的工具和網站推薦給大家。

技術類：
美術類：

最後我要隆重介紹一下這個 AI 設計工具：Hotpot ，因為現在上傳 Google Play 需要上傳 Google Play Feature Graphics 和 Screenshots，也就是一張置頂大圖還有應用截圖，但是我又不會 PS ，最後在網上找到這個工具網站，功能十分強大，直接網頁線上設計，提供了很多模板，我上邊的螢幕截圖就是在這個網站設計的，是不是很漂亮。通過 Promo code 可以免費使用。

這個還有一個小插曲，因為 Promo code 需要去國外各大社交等網站找，或者在 FB，Twitter 分享後獲得，我有點等不及，所以直接付了 1 美金來設計和下載，但是設計完之後需要連線外網才能儲存和下載，結果就是我的沒能下載成功，然後我就發郵件聯絡網站，後面我們通過網頁聊天視窗交流，我使用我蹩腳的英文，一邊利用翻譯軟體一邊交流，快到最後解決的時候發現了對方是美籍華人，懂中文只是不太好，後邊我們果斷使用中文交流了，我還教了他很多說中文需要注意的地方。最後他幫我下載了設計圖，並送了我一個免費七天的無限下載 code。

總結

現在國內和國外的第一個版本都已經開發完成了，國外的已經發布到 Google Play，目前正在稽核中，貌似現在這個特殊時期稽核時間大大加長了，不知道什麼時候才能過。國內的還在申請軟著中。不過我已經使用蒲公英內測分發了，感興趣的小夥伴可以去這裡下載安裝：https://www.pgyer.com/JdvS 。或者掃下面二維碼，安裝密碼：1111

BMNZNQ.png

蒲公英內測每個版本下載次數限制為 10 次/天，如果不能下載可以使用百度雲下載：
連結: https://pan.baidu.com/s/1WP3xGRqoi0aFSt5AZaaqwA 提取碼: 82q5

我一個從來沒接觸過移動開發的人，從十月一開始到今天二十多天，每天也就利用業餘的一兩個小時，從學習查資料，調研技術，選擇平臺，美術資源等等一個人搞定。可見 Flutter 還是能大大提高開發者效率的，如果是從事移動開發，肯定會比我更快。在這個過程我也學習了很多，也有很大的收穫，最後完成的時候也有很大的成就感，雖然只是一個簡單的工具類應用。

相關文章