asp.net.ph

Skip Navigation Links

Customizing the Wizard Control Interface

Controls You Can Use on Web Forms   ASP.NET Standard Controls   Wizard Control


The Wizard control exposes several properties to specify the visual rendering of the wizard items in the control. The following table lists the available wizard item styles you can specify for the Wizard.

Wizard item style property Description
DynamicHoverStyle The style settings for a dynamic wizard item when the mouse pointer is positioned over it.
DynamicWizardItemStyle The style settings for an individual dynamic wizard item.
DynamicWizardStyle The style settings for a dynamic wizard.
DynamicSelectedStyle The style settings for the currently selected dynamic wizard item.
StaticHoverStyle The style settings for a static wizard item when the mouse pointer is positioned over it.
StaticWizardItemStyle The style settings for an individual static wizard item.
StaticWizardStyle The style settings for a static wizard.
StaticSelectedStyle The style settings for the currently selected static wizard item.

Instead of setting the individual style properties, you can specify styles that are applied to wizard items based on their level by using the following style collections.

Level style collections Description
LevelWizardItemStyles A collection of WizardItemStyle objects that control the style of the wizard items on a level basis.
LevelSelectedStyles A collection of WizardItemStyle objects that control the style of selected wizard items on a level basis.
LevelSubWizardStyles A collection of WizardItemStyle objects that control the style of the subwizard items on a level basis.

The first style in the collection corresponds to the style of the wizard items at the first depth level in the wizard tree. The second style in the collection corresponds to the style of the wizard items at the second depth level in the wizard tree, and so on. This is most often used to generate table of contents-style navigation wizards where wizard items at a certain depth should have the same appearance, regardless of whether they have subwizards.

NOTE: If you use any of the level style collections listed in the previous table to define the style for the Wizard control, these style settings override the individual wizard item style properties.

Another way to alter the appearance of the control is to customize the images displayed in the Wizard control. You can specify your own custom image for the different parts of the control by setting the properties shown in the following table.

Image property Description
DynamicBottomSeparatorImageUrl An optional image displayed at the bottom of a dynamic wizard item to separate it from other wizard items.
DynamicPopOutImageUrl An optional image displayed in a dynamic wizard item to indicate that it has a subwizard.
DynamicTopSeparatorImageUrl An optional image displayed at the top of a dynamic wizard item to separate it from other wizard items.
ScrollDownImageUrl The image displayed at the bottom of a wizard item to indicate that the user can scroll down to view additional wizard items.
ScrollUpImageUrl The image displayed at the top of a wizard item to indicate that the user can scroll up to view additional wizard items.
StaticBottomSeparatorImageUrl An optional image displayed at the bottom of a static wizard item to separate it from other wizard items.
StaticPopOutImageUrl An optional image displayed in a static wizard item to indicate that it has a subwizard.
StaticTopSeparatorImageUrl An optional image displayed at the top of a static wizard item to separate it from other wizard items.

Templates for Control Layout

The Wizard control supports additional customization through templates, which offer more control over the rendering of certain elements. The following table lists the template types you can specify for the Wizard.

Template property Description
DynamicItemTemplate The template that contains the custom content to render for a dynamic wizard item.
StaticItemTemplate The template that contains the custom content to render for a static wizard item.

You can control the vertical and horizontal position of a dynamic wizard relative to its parent wizard item by setting the DynamicVerticalOffset and DynamicHorizontalOffset properties, respectively. To control the indentation of the static subwizard items within a static wizard, use the StaticSubWizardIndent property.

See Also

Responding to Wizard Events   Web Forms Server Controls and CSS Styles



© 2025 Reynald Nuñez and asp.net.ph. All rights reserved.

If you have any question, comment or suggestion
about this site, please send us a note