寫在前面的話
過去一年自己接觸了不少手機前端開發,得益於現在手機性能的提升和4G普及,感覺使用混合技術開發手機App已經可以滿足越來越多的應用場景了。新年伊始,對自己2016年所學知識做一個階段性總結,記錄一個自制的“小而萌”Hybrid App開發歷程,共勉!
App預覽
(*模糊化的個人數據)
簡介
個人日常管理App,簡稱PDM(Personal Daily Management),大數據時代的小數據記錄工具,可進行日常記賬、活動記錄、事項規划,科學合理安排個人消費、辦公學習。
使用技術
Ionic+AngularJS+SQLite
〖擴展閱讀〗
設計與開發
開發環境搭建(Android)
- 安裝node
- 安裝Android SDK
- 安裝Python(后面安裝npm插件什么的可能用到)
- 安裝cnpm(npm大中華版,安裝好node后命令行:npm install -g cnpm)
〖擴展閱讀〗
搭建開發環境,並創建工程
搭建開發環境,並創建工程
創建ionic項目
1 ionic start PDM
本來是一條命令就能簡單搞定的事,在國內就行不太通了——網絡卡半天。這里介紹另一種“曲折立項”的方法,命令行分裂式開始:
1 ionic start PDM --v1 --skip-npm 2 cd PDM 3 cnpm install --save
至此,項目創建好,命令行在項目所在目錄,輸入:
1 ionic serve
就可看到(官方Tabs模板的)運行效果了
搭建框架
目錄一覽
項目的主要功能實現都在www目錄下,重點看以下文件:
- www/js/app.js ——項目初始化,自定義各種功能等
- www/views/* —— 這是本項目各個界面的實現代碼(按一個界面一個子目錄區分開來,html文件時視圖,js文件是控制器代碼)
具體可查看源碼文件
運行效果如下:
〖擴展閱讀〗
*【源碼文件】