Knowledgebase

Supplementary guide: preparing application.config.json (5.0.0)

This is a supplementary guide to main Progressive Web Apps: 5.0.0 compilation documentation and covers preparation of application.config.json file required for further compilation steps.

Guide assumes that you have already:

1. Downloaded  "Skmobileapp 5.0.0"  source code of apps
   2. Unpacked downloaded skmobileapp.zip file. /skmobileapp/folder will be created.
   3. Opened /skmobileapp/ folder  and completed at least basic re-branding changes:
   
   The next step is making custom changes.

Case: Sign in page background image

    1. Prepare your custom images index.jpg (750x1334px) and index.jpg (1125x2001px). Move the image index.jpg (750x1334px) to the skmobileapp/application/assets/image/login folder, replacing the existing one. Then move the image index.jpg (1125x2001px) to the skmobileapp/application/assets/image/login/3.0x folder and the index.jpg (750x1334px) to the skmobileapp/application/assets/image/login/2.0x folder, replacing existing images.

2. Save the changes and continue making further modifications or compile the application.
   
   

Case: Changing Code in Application Components

Most of the files responsible for the application components are located in the skmobileapp/application/lib/src/module folder.

Example: To modify the source code of the dashboard page in the application:

1. Open the file skmobileapp/application/lib/src/module/dashboard/page/widget/profile/dashboard_profile_widget.dart.
2. Make the necessary changes to the file.
3. Save the changes and proceed with further modifications or compile the application. 

Example of Style Management:

To change the style parameters of the dashboard page in the application:

1. Open the file skmobileapp/application/lib/src/module/dashboard/page/style/profile/dashboard_profile_widget_style.dart.
2. Make the necessary changes to the file.
3. Save the changes and proceed with further modifications or compile the application.

Case: Changing Color in the Application

Colors of elements in the application's source code can be changed through global variables.

Note that the same variable can be used in more than one component. Therefore, changing variable properties may affect properties in multiple areas of the application.

Example:

To replace the red color of links on the dashboard page of the application:

1. Open the file skmobileapp/application/config/theme.config.tmpl.
2. Find the variable THEME_COMMON_DASHBOARD_PROFILE_LINK_COLOR (colors for the dark theme are also provided - THEME_COMMON_DASHBOARD_PROFILE_LINK_COLOR_DARK).
3. Replace the default color code with your custom color code ().
4. Save the changes and proceed with further modifications or compile the application.