HASH32 Engineering

Ionic app development tips for Android

February 20, 2018 | 3 Minute Read

Here are 2 tips for ionic app development for Android platforms.

Generating icon and splash screen

When I was a beginner in ionic framework, I wondered how to change the default icon and the splash screen with the brand. With the release of ionic 3, there is a handy command that can help you generate the icon and the splash screen.

First create a icon.png file and place it in the resources folder. The resolution of the icon image should be atleast 192x192. This makes sure that the icon gets resized for all android resolutions without loss of clarity.

Also create a splash.png file and place it in the resources folder. The minimum resolution of 1920x1920.

Android provides a set of four generalized sizes densities:

  • ldpi (low) ~120dpi
  • mdpi (medium) ~160dpi
  • hdpi (high) ~240dpi
  • xhdpi (extra-high) ~320dpi
  • xxhdpi (extra-extra-high) ~480dpi
  • xxxhdpi (extra-extra-extra-high) ~640dpi

You can read more about it here. https://developer.android.com/guide/practices/screens_support.html The image resolutions mentioned above are w.r.t these standards.

Next ionic toolchain provides a cli command to generate images for all android standard dpis.

Run the following command with ionic cli.

ionic cordova resources

This generates the images for the android standard dpis

Live-reload on an Android Device

Often times it takes time to generate a build and transfer it to your android device to check how it works in the device. You can directly debug your ionic app, by running it on your device, by connecting via USB to your development laptop/desktop.

On your mobile device look for Developer options in Settings. You need to enable the following options:

  • USB debugging
  • Install via USB
  • USB debugging (Security settings)

Based on you device the wordings for these options might defer.

Now connect you device via USB, and run the ionic cli command from the app folder.

ionic cordova run android

Allow all permissions that pop up on your device.

For debugging your applications on the device, you can run this cli command with the --livereload option.

ionic cordova run android --livereload

This will load the app changes on the device, as you edit the ionic app source code.

Get stories like the directly to your inbox.

Subscribe to our Newsletter

Tips and tricks, news about tech tools, recent blog entries and exclusive email only stories once every two weeks