Themes Page
In this page you can choose from Advanced Installer's predefined themes, set the global properties of your package's User Interface, change visual styles and customize it by setting custom images and text styles that will be displayed on the install dialogs or controls.
The current theme is displayed in the list using bold text.
To access the Themes Page, from the left pane go to User Interface and click
on Themes.
Themes and Layouts
Currently Advanced Installer comes packed with more than 80 themes grouped in several layouts:
- Air
- Windows 7 Wizard style layout. These themes have Glass effects and themed buttons
- App Installer
- Windows Installer theme with MSIX installation design. Windows current theme (dark/light) is automatically detected and applied to your installation. Eula can be placed only as link on AboutDlg by setting AiLicenseAgreementLink property.
- Azure
- Windows Installer themes with this layout use large dialogs, themed background, Enhanced UI and a large and customizable application logo
- Graphite
- Windows Installer themes with graphite mineral look using large dialogs and Enhanced UI. In the left side of each dialog, an overall progress of the installation is displayed
- Light
- Windows installer theme with light look and fresh design.
- Modern
- Windows Installer themes with modern look, large dialogs with themed background and Enhanced UI. Each dialog includes the application logo, name and also the company name
- Serene
- Minimalist Windows Installer theme with clean design.
- Spring
- Segoe UI font, contiguous installation progress, themed buttons and a clean layout are used to create the Spring layout. Installation steps are reduced and most of the dialogs are displayed only when performing a customized installation. These themes use Enhanced UI and are HTML based
- Surface
- Windows 8 Wizard style layout. A lightweight setup design with optimized user interaction, all in accordance with the Windows User Experience setup interaction Guidelines
- Vivid
- Colorful Windows Intaller theme with attention-grabber design.
- Classic
- Windows Installer themes with classic look using a watermark and a banner that can be easily customized
To change the current theme, select the desired one and use the command “Set as current” option from the context menu or by pressing the button. To customize the current theme use the “Customize Theme” from the context menu. This option will transfer you to Dialog Editor Page.
Some themes, by default, make use of controls available only on specific versions of
Windows (e.g. Azure uses Command Link Controls which are available starting with Windows Vista). Please test
accordingly.
The Spring theme is not compatible with systems having custom DPI
scalling. The UI controls may not be resized correctly.
Frame
From this combobox you can select how the dialogs frame will be presented. It contains the "System" option along with predefined frames specific for the currently selected theme. The System frame is specific to the Windows Operating System the package will run on. Some themes might not support frame change.
Custom Frame
Some themes also support a Custom Frame that can help you customize specific details such as the Base Color, Close Button Base Color, Min Button Base ColorCaption or Border Colors, etc.
For detailed information regarding custom frames, see this article: Custom Frame colors configuration
Frame Style
- Flat Caption
When checked Frame, Close and Minimize are generated using only base colors (no gradients) - Flat Border
When checked Border is generated using only base color - No Inactive
When checked Inactive state color is the same as Active state color
Frame Colors
You can pick a color using the color picker by clicking on the color button or you can use the color that is automatically generated from the corresponding Base Color.
The default color (that is automatically generated from the Base Color) is displayed with an overlay on the button.
To revert to the default color use Revert to default color context menu option or the button from the color picker.
Theme Specific Options
More Options are available in the right part of the window.
The listboxes contain the images that can be changed and are being used by the current theme.
You can use regular images (e.g. .jpg, .png), but you can also pick a .SVG image resource and Advanced Installer will automatically convert it to a regular image (e.g. .jpg).
There are some Windows limitaions in the .SVG image support. You can find out more
information in this article : Why my SVG image isn't
rendered properly?
The following operations are possible:
- Change the resource
- In order to use your own resource file click on the [...] button and then choose [Browse] menu option.
- Revert to default
- If you want to discard any changes and return to the default resources, click on the [...] button and select the "Reset" context menu option.
The images that can be changed differ from one theme to another.
Image Sizes
The default image sizes used by Advanced Installer specific for each theme are:
Surface
| Resource name | Size in pixels |
|---|---|
| Background | 460 x 533 |
| Icon | 78 x 84 |
Air
| Resource name | Size in pixels |
|---|---|
| Background | 494 x 405 |
Azure
| Resource name | Size in pixels |
|---|---|
| Icon | 128 x 128 |
Modern
| Resource name | Size in pixels |
|---|---|
| Icon | 48 x 48 |
| Dialog image | 355 x 304 |
Spring
| Resource name | Size in pixels |
|---|---|
| Dialog image | 533 x 350 |
| Icon | 128 x 128 |
Classic
| Resource name | Size in pixels |
|---|---|
| Banner image | 500 x 59 |
| Dialog image | 500 x 316 |
Options
This combobox is available only for themes that can be extra customized:
- Change between radio buttons or checkboxes for overall installation progress
- Choose if the theme uses a header image or not
Testing the installation User Interface
Use the toolbar button in the
"Themes" page. This will create a temporary package in the Temp folder and run it without
performing an actual installation. Since the package is not installed on your machine, only
the installation UI sequence can be tested.
Testing the maintenance User Interface
Use the
toolbar button in the "Themes" page. This will create a temporary package in the Temp folder
and run it without performing an actual installation. Your product is temporarily registered
with Windows Installer so the maintenance UI sequence can be tested..
These options require at least an Enterprise or Architect project.
Topics
- Theme Settings Tab
Customize theme global settings - Images Tab
Set custom images or edit image settings - Text Style Tab
Add or edit text styles.