Specifying presentation options for a Button control
Three predefined formats are available for buttons: Strong, Standard, and Simple. Using these formats consistently in your application makes the user interface more predictable and makes it easier for users to complete forms.
Before you begin:
Add a Button
control to a layout.
-
On the
Presentation
tab of the
Properties
panel, set the
Control format
option to one of the following
settings to indicate the button's relative importance:
- Strong – Use this format for the primary action on a form. Use it only once per view.
- Standard – Use this format as a secondary style for navigation and actions.
- Simple – Use this format to indicate an action.
- Other – Use a custom format created in the Skin rule. Press the Down Arrow key in the adjacent field to select the custom format.
- To convert existing customized Button controls to a predefined format, use the pzUpdateButtonLinkFormats activity. For more information, see Update-Button-Link-Formats.
- To add a label to the Button control, select the Include a label check box and in the adjacent field enter the text for the label or press the Down Arrow key and select a predefined label.
- To specify a format for the label, press the Down Arrow key in the Label format field and select one.
-
Set advanced presentation options.
Instead of creating a new custom format in the skin, you can adjust elements in a cell by applying Cascading Style Sheet (CSS) helper classes. For example, you can use a CSS helper class to center an element in a cell or to double the standard right margin for the element.
- Cell read-write classes – Click the Open helper class picker icon to specify one or more CSS helper classes to apply to this cell when the form is displayed in read-write mode. You can enter several helper classes, separated by a space. Alternatively, you can enter the name of a custom style to apply to this cell.
- Cell read-only classes – Click the Open helper class picker icon to specify one or more CSS helper classes to apply to this cell when the form is displayed in read-only mode. You can enter several helper classes, separated by a space. Alternatively, you can enter the name of a custom style to apply to this cell.
- Inline style (not for production use) – You can use this field to define an inline style by entering CSS code. However, entering an inline style results in a guardrail warning. For maintainability and reuse, the recommended approach is to use read-write or read-only classes.