AX1522

Formatting overrides for Axiom form components

The formatting applied to each Axiom form component is primarily determined by its assigned style or styles. Styles can define formatting properties such as text color, font size, border color, background color, and so on. Some formatting properties may be defined in the style itself, and other formatting properties may be inherited from the skin. For more information, see Controlling the Axiom form appearance with skins and styles.

If a component does not have an assigned style, or if you want to override a specific formatting property of the assigned style, then you can use the advanced component settings to define certain formatting properties. If a formatting property is defined for a component using these advanced settings, it will take precedence over any equivalent properties defined in the style or skin.

To access the advanced component properties:

In the Form Designer or Form Assistant, click the Show Advanced Settings link under the Style box.

This exposes the individual formatting properties that are available for the current component. You can now edit any of these properties as desired. When you are finished, click Hide Advanced Settings to restore the default view and hide these properties.

NOTE: The advanced settings also include showing the position and size properties for the component. For more information on these properties, see Controlling component position and size.

Component formatting properties

The following table details the formatting properties that may be available for each component in the advanced settings. Some properties do not apply to certain components or may not be configurable at the component level. If a formatting property does not display for a particular component type, then it is not available for that type.

Each formatting property can be defined individually and only affects that particular property. Any formatting properties left blank in the advanced settings will continue to use the formatting defined in the style or skin. If you have previously defined a formatting property and now you want to clear it to return to using the inherited property, you can click the Clear selection button to the right of the property.

Item	Description
Text Color	The text color. If left blank, the color is determined by the style or skin (in that order). Click the [...] button to open the Choose Color dialog. You can select from the colors displayed at the top of the dialog, or you can enter a valid RGB or hexadecimal color code (such as #00FFFF for Aqua). Click OK to use the specified color. If you are modifying the Form Control Sheet directly, then you must use a hexadecimal code. For an example list of colors and hexadecimal codes, see: http://www.w3.org/TR/css3-color/#svg-color (external link). NOTE: For the Text Box component, the text color does not apply to any text defined in the Placeholder field (except in Internet Explorer). It will apply when text is defined for the Text field.
Font Size	The font size of the text, in pixels. If left blank, the size is determined by the style or skin (in that order).
Font Family	The font type to use for the text. If left blank, the font family is determined by the style or skin (in that order). If you specify a font family, it is strongly recommended to use a common font such as Arial, which all client machines and devices are likely to support. If the specified font is not found on the user machine, then it will be ignored and the next font in the formatting order of precedence will be used.
Font Weight	The weight of the font. You can specify any of the following: <Blank>: The font weight is determined by the style or skin (in that order). Normal: The font weight is normal. Bold: The font weight is bold. Any valid CSS entry for font weight, such as `500`. The drop-down list contains entries for 100-900.
Font Style	The style of the font. You can specify any of the following: <Blank>: The font style is determined by the style or skin (in that order). Normal: The font style is normal. Italic: The font style is italic.
Background Color	The background color for the component. If left blank, the background color is determined by the style or skin (in that order). If the component is inheriting a background color from the style or skin and you want the component to use no background color, then you can specify `transparent` as the color. You must manually edit the Form Control Sheet to do this, because the Background Color selector in the Form Designer / Form Assistant does not allow this entry. The background color can be specified as described previously for Text Color. NOTES: For Panel components, if you want to set the background color you must disable the title bar. For Wizard Panel components, the background color fills the area underneath the header area and the status bar.
Border Color	The border color for the component. If left blank, the color is determined by the style or skin (in that order). If the component is inheriting a border from the style or skin, and you want to hide the border at the component level, use the Border Thickness setting to turn off the border. The border color can be specified as described previously for Text Color.
Border Thickness	The thickness of the border, in pixels. If left blank, the thickness is determined by the style or skin (in that order). If the component is inheriting a border from the style or skin, and you want to hide the border at the component level, you can specify 0. Zero thickness results in no border. NOTE: If you are using the border settings for the component, then Show Title Bar should be disabled (for components that support this option). If both settings are used, then two borders will display on the component.
Transparency	The transparency of the component, as a percent. If left blank, the transparency behavior is determined by the style or skin (in that order). Currently, Label components are the only components that support setting the transparency at the component level. By default this is set to 0, which means the component is opaque. At the other end of the spectrum, if transparency is set to 100, then the component will be completely transparent (but still present in the form; it is not the same effect as setting Visible to Off). You can set the transparency to a percentage between 0 and 100 to allow the contents underneath the label to show through the label. When any value is specified for the transparency, it is applied to the entire label component (both the text and the background color, if defined). NOTE: For legacy skins with white backgrounds (such as Uniform), if the transparency is blank and no background color is specified, then the background is transparent. But if any value is specified for the transparency and no background color is specified, then the background is white. This is to support backward-compatibility with previous versions.
Horizontal Alignment	The horizontal alignment of the text. If left blank, the alignment is determined by the style or skin (in that order). Specify Left, Center, or Right.
Vertical Alignment	The vertical alignment of the text. If left blank, the alignment is determined by the style or skin (in that order). Specify Top, Center, or Bottom.

NOTE: For the Date Picker component, all font-related properties apply to both the date input box and the calendar control. For example, if you use bold font, then the selected date will display in bold, and all of the text in the calendar control (month / day labels, dates, etc.) will also display in bold.