Note: This project is suitable for ionic beginners with knowledge of Angular

If you are familiar with Angular and want to try mobile development, I recommend ionic, which is based on Angular UI framework and packaged with Cordova to generate APK for Android and IPA for iOS.

For those of you who know Angular, writing code is easy, but packaging is the hard part. Build Android –prod ionic Cordova to generate debug.apk. You can use Android Studio to run packaged Android projects in the folder Platform/Android, and then sign them. For iOS, build iOS –prod with ionic Cordova and run the iOS project in the folder Platform/iOS using Xcode.

The main purpose of this article is to recommend an ionic mini-project I wrote about, HW-BASIC. This project looks relatively simple, but contains many commonly used functions.

  1. Screen adaptation
  2. Common Tool packaging
  3. Tab Icon Replacement
  4. Font library replacement
  5. Custom Address book
  6. The database
  7. Version information

Screen adaptation does not use the familiar flexible, but uses VW to realize a SCSS function REM () to solve this problem. It is very simple, but very clever.

Tab icon replacement is also a common function, how to replace the bottom Tab into their own, the code to the word part of the annotation, but does not affect the reading.

Some apps need to provide the address book function, the main trouble is to click the letter index bar to jump to the corresponding letter position, which is also implemented in the project, the only disadvantage is that the letter bar does not support sliding.

By implementing the address book function, we also demonstrated how to use the native database through the plug-in and how to parse the data returned from the database.

Finally, here’s a screenshot. Welcome to fork, issue and star.