Note:此项目适合对 Angular
了解的 ionic
初学者
假如对Angular熟悉的朋友想尝试下移动端开发,我推荐 ionic ,基于Angular的UI框架,通过 cordova 打包,生成可以在Android运行的apk,iOS运行的ipa。
对了解Angular的小伙伴来说,写代码比较简单,难的就是打包。Android的话,通过 ionic cordova build android --prod
就可以生成debug.apk,假如需要签名,可以使用 Android Studio
运行打包后位于文件夹 platform/android
下的Android项目,然后签名。iOS的话,通过 ionic cordova build ios --prod
,然后使用 Xcode
运行位于文件夹 platform/ios
的iOS项目。
上面都是废话,本文的主要目的是推荐下我写的 ionic
小项目 hw-basic。此项目看上去比较简单,但是包含了很多常用的功能。
- 屏幕适配
- 常用工具封装
- Tab图标替换
- 字体库替换
- 自定义通讯录
- 数据库
- 版本信息
屏幕适配没有使用大家熟悉的 flexible,而是使用了 vw
实现了一个scss
函数rem()
来解决这个问题,很简单,但是很巧妙,原理具体如何,还是自己看代码吧。
Tab图标替换也是常用的功能,如何将底部的Tab替换成自己的,代码中把字部分注释了,但是不影响阅读。
有些APP需要提供通讯录的功能,主要的麻烦就是点击字母索引栏跳转到相对应的字母位置,项目中也实现了,唯一的缺点就是暂不支持字母栏的滑动。
借着实现通讯录的功能,也示例了如何通过插件使用原生数据库,如何解析数据库中返回的数据。
最后,还是来张截图吧,欢迎大家fork、 issue 和 star。