1 min read

App styling

App styling allows you to style the colors, icons, and fonts of your whole app with minimum effort. To do so, a custom Android Studio plugin will generate all the necessary XML style files from a JSON. This file is generated from the styles applied by your designer in the app manager web tool.

How to install the Android Studio plugin

In order to use App Styling you need to install an Android Studio plugin, to do so:

  1. Download AndroidAppStyling.zip.
  2. In Android Studio go to Preferences -> Plugins -> Settings -> Install Plugin from Disk… and select the downloaded zip file.
  3. Restart Android Studio.
  4. Now Android Studio shows a new option called AppStyling:

App styling tab
App styling tab

How to apply it

To apply the styles you need to download the files from the app manager web tool. When you click in Download zip, you will obtain a JSON and a zip file.

With the JSON file:

  1. Go to Android studio and click in Tools -> Generate App Styles.
  2. Copy and paste the content of the JSON file in the dialogue window.
  3. The plugin will generate all the necessary files and in the right folder to style your app.
Do not modify the auto-generated XML files, all starting with app_style_*.xml. If you modify them manually, those modifications will not remain when you reapply the JSON file.

With the zip file:

  1. Extract the zip file.
  2. With Android studio resource manager import the folders /android/icon and /android/images.
  3. Create a new resource folder in your project called font and copy the content of /android/font to it if it exists.

How to apply it to your custom layouts

When you create or customise a layout, you should use one of the generated App styling styles for your views. Doing so, your new layout will show the new styles when you reapply app styling.