Custom Application Layout

Canvas Technology enables you to customize the application layouts based on your project requirements. The following four configurations can be customized to get the desired custom application layout:

  1. Landing Page
  2. Panel Page
  3. Header Configuration
  4. Footer Configuration

All the above configurations have different attributes that can be customized with different values. For example, the tab layout has the workspaces listed in tab with no footer and if the user wishes to include a footer and panel page, a customized layout using different configurations must be created.

The customized layout component must be registered in CLCR registry as given below in the layout component file.

Example:

CLCR.registerCmp({

	"CONFIG": "APPLICATION_LAYOUT",
	"LAYOUT": "UTKARSH"

}, canvas.applnlayout.utkarsh.component); 

The newly customized layout has to be set in systempreferences.properties file. The layout common for desktop, mobile, and tablet must be specified in APPLICATION_LAYOUTTYPE. If the layout requirement differs for mobile and tablet from desktop, then the mobile layout must be specified in M_APPLICATION_LAYOUTTYPE and tablet layout must be specified in T_APPLICATION_LAYOUTTYPE. In the example, let's look at the steps to create a custom application layout called, 'UTKARSH'.

# This property will define the application layout. 
# Possible values for this property are as follows:
# "TAB" or "CARD" or "EXCARD" or "APP" or "TABLE_TOP" or "MENU"

APPLICATION_LAYOUTTYPE=CARD #application layout for desktop
M_APPLICATION_LAYOUTTYPE=UTKARSH #application layout for mobile
T_APPLICATION_LAYOUTTYPE=EXCARD #application layout for tablet

In the following subsequent sections, let's look at the details of each configuration and its attributes for creating a customised application layout: