Working with Themes and Templates

HTML DB utilizes various templates to implement the look and feel of an application. A theme is a collection of these templates. This arrangement allows for a single implementation point of an application’s look and feel and the segregation of visual elements from the application logic and database access. Development tasks can be divided up by skill sets; one developer can work on the look and feel of the user interface while another simultaneously works on the business logic and flow of the application. A centralized implementation of the visual elements also allows changes to the entire application to be made in a single location.

Templates are made up of HTML and substitution variables that allow the page to be dynamically generated at run time. An application is associated with a theme, which has a default set of templates that will be utilized throughout the application unless a different template is selected during development. Here are the different types of templates available:

• Button templates
  
• Calendar templates
  
• Label templates
  
• List templates
  
• Menu templates
  
• Page templates
  
• Popup LOV templates
  
• Region templates
  
• Report templates

In this chapter, we will examine the use of themes, the different types of templates available, and the use of substitution strings in template definitions. Also, we will dig into great detail on page templates.

The look and feel of an application is controlled by the theme that is associated with the application. Themes are managed on the Themes page, which is accessible from the Themes link in the User Interface section of the Shared Components drop-down menu, as shown here.

The drop-down menu is activated by clicking the down arrow on the right side of the Shared Components navigation icon. If you click on the icon, it will navigate you to the Shared Components page, where you can click on the Themes link in the User Interface section.

From this page, you can create a new theme, edit existing themes, delete a theme, or switch the current theme for the application. The current theme for an application is indicated by a check mark in the Current column on the Themes page, as shown in Figure 6-1. You can easily switch the current theme for an application. Starting in version 1.6, you are allowed to copy templates from other applications within your workspace; previously, this had not been possible. From this page, you can also access the individual templates that belong to a theme by clicking on the magnifying glass icon in the View column for the theme. Note that the Themes page has two different displays: a summary display and a detail display. You switch between displays by selecting from the display LOV and clicking on the Go button. You can also display themes by icons, although this view is the least informative.

Figure 6-1.  Themes page