Style Manager

Allows you to view, add and edit styles, and to apply a set of resource values quickly and consistently across a number of widgets.

Select Styles from the Browser Managers menu to display the Style Manager:

Style Manager

Style mouse operations

The style hierarchy is displayed within the window. Clicking MB1 on a style selects that style. The currently selected style is highlighted on the hierarchy. Double-click MB1 on a style to display the Style Editor. Double-click MB3 on a style to select that style and pop up an Edit menu identical to the Style Manager Edit menu.

Lock icon

System styles are designated on the Style Manager with a "lock" icon. Although you can use the Style Editor to review the contents of these styles, you cannot edit their resource values.

L icon

Styles referenced in Palette collections are designated with an "L" icon. You can edit these styles, but you cannot delete them.

Note: Styles designated with an "L" icon remain in the Style Manager between sessions.

Style Hierarchy

The style hierarchy is displayed on the Style Manager as either an outline or a tree. Styles, like widgets, are related to one another as parents and children. Substyles inherit the resource values of their ancestors. A style includes not only the resource values defined in that style, but also any resource values defined for the style's ancestors. A value specified in the widget itself takes precedence over a value for the same resource specified in an ancestor.

Inheritance of resource values

For example, assume that you have a style hierarchy containing the BaseStyle and substyles BaseStyle1, BaseStyle2, BaseStyle3, and BaseStyle4.

Sample Style Hierarchy

BaseStyle, a system style that serves as the root of the style hierarchy, is always locked. You cannot define resources for BaseStyle. In the sample style hierarchy, BaseStyle1 and BaseStyle2 are the children of BaseStyle, while BaseStyle3 is the child of BaseStyle1, and BaseStyle4 is the child of BaseStyle3.

Assume that the resource background is set as red in BaseStyle1, blue in BaseStyle2, and is undefined in BaseStyle3 and BaseStyle4. Applying BaseStyle1 to a widget applies the value red to that widget's resource background. Applying BaseStyle2 applies the value blue because the resource is defined specifically for BaseStyle2. Applying BaseStyle3 or BaseStyle4 applies the value red because, although the resource is not set specifically in either style, it is set in their ancestor, BaseStyle1.

Conflicting values in ancestors

Assume that BaseStyle4 has been applied to a widget, and you change BaseStyle3 to specify a new value, green, for background. The background of the widget changes to green because BaseStyle4 is automatically updated to reflect the resource values that are part of its ancestor style, BaseStyle3.

Note: BaseStyle4 applies the value green, rather than the value red, to the widget because BaseStyle3 is closer than BaseStyle1 to the applied style, BaseStyle4.

The following sections describe the Style Manager menu bar options.

Style Manager File Menu

Select File from the Style Manager menu bar, with the mouse or with a mnemonic, to display the following menu:

Style Manager File Menu

Dismiss

Allows you to dismiss the Style Manager.

Style Manager Edit Menu

Select Edit from the Style Manager menu bar, either with the mouse or with a mnemonic, to display the Style Manager Edit menu

Style Manager Edit Menu

Note: When you hold down MB3 over a style on the Style Manager, the style is selected and a pop-up dialog identical to the Edit menu is displayed. If you click MB3 over a style on the Style Manager, the pop-up menu is displayed with the last selected menu item as the default.

The following sections describe the options available from the Edit menu.

Cut

Removes the currently selected style and its descendants from the style hierarchy and places them in the style paste buffer, overwriting any existing contents of the buffer. Use Cut in conjunction with Paste to move a style and its descendants to a new location within the style hierarchy. If you do not select Paste before another Cut or Copy operation, the Cut styles will be permanently removed.

Using drag and drop to cut and paste

You may also use drag and drop to Cut and Paste objects in the Style Manager. Dropping style A on top of style B will Cut style A and all of its descendants from the Style Manager and Paste them as descendants of style B.

Copy

Places a copy of the currently selected style and its descendants in the style paste buffer, overwriting any existing contents of the buffer. Use Copy in conjunction with Paste to copy a style and its descendants to a new location within the style hierarchy.

Using drag and drop to copy and paste

You can use drag and drop to Copy and Paste styles in the style hierarchy. Dropping style A on top of style B while depressing the Ctrl key will Copy style A and all of its descendants and Paste a copy of them as descendants of style B.

Paste

Reparents the contents of the style paste buffer as descendants of the currently selected style. Use Paste in conjunction with Copy to copy a set of styles, or with Cut to move a set of styles within the style hierarchy. Paste does not clear the style paste buffer, so you may perform multiple Paste operations.

Create Substyle

Creates a child of the currently selected style. Initially, no resource values are specified for the substyle, so it is functionally identical to its parent.

Edit Style

Displays the Style Editor for the currently selected style.Refer to Style Editor for more detailed information about the Style Editor.

Note: You can also display the Style Editor by double-clicking on a style.

Style Manager View Menu

Allows you to display the style hierarchy as a tree or outline. Select View from the Style Manager menu bar, either with the mouse or with a mnemonic, to display the Style Manager View menu:

Style Manager View Menu

The following sections describe the View menu options.

Show Tree

Displays the style hierarchy in tree form. The display window has horizontal and vertical scrollbars. Within the window, children appear to the right of their parents, connected by lines. A toggle to the left of each parent displays either an open or closed folder. If no folder appears to the left of a style, then that style has no children. When a parent's folder is closed, its descendants are not displayed. Clicking on a parent's closed folder expands the display to include all of the parent's children, while subsequent generations remain hidden. Clicking on a parent's open folder hides all of the parent's descendants. By default, the style hierarchy is displayed as a tree.

Show Outline

Displays the style hierarchy in outline form. The display window has horizontal and vertical scrollbars. Within the window, successive generations appear under their parent, indented from the left margin. Siblings are indented to the same level. A toggle to the left of each parent displays as either an open or closed folder. If no folder appears to the left of a style, then that style has no children. When a parent's folder is closed, its descendants are not displayed. Clicking on a parent's closed folder expands the display to include all of the parent's children, while subsequent generations remain hidden. Clicking on a parent's open folder hides all of the parent's descendants.

Style Manager Apply Menu

Allows you to apply the currently selected style to various combinations of objects within your interface. Select Apply from the Style Manager menu bar, either with the mouse or with a mnemonic, to display the Style Manager Apply menu:

Style Manager Apply Menu

Note: All of the following items (with the exception of Make Default) can be applied either to an individual widget instance or to a group of widget instances. (Make Default can be applied to a single widget instance only.)

The following sections describe the Apply menu options.

To Selected

Apply style to currently selected object instance or selected group of instances.

To Selected Tree(s)

Apply style to currently selected instance and each of its descendants. If multiple instances are selected, this applies the style to each instance and its descendants.

Force To Selected

Apply style to currently selected instance, overriding any resource values previously defined for the object. You can also apply a style to a selected group of instances and override any previously-defined resource values for each instance.

You can also apply a style to an object and override its resource values using drag and drop. Depress MB2 over the style, drag over the object, and release the mouse button.

Force to Selected Tree(s)

Apply style to currently selected instance and each of its descendants, overriding any conflicting resource values defined in each object. If multiple instances are selected, the style is applied to each instance and its descendants, and any conflicting resource values are overridden in each selected instance and its descendants.

You can also apply a style to an instance tree and override the resource values of each object in the tree using drag and drop. Depress MB2 over the style, drag over the object and, while pressing the Ctrl key, release the mouse button.

Make Default

Make the currently selected style the default. All subsequently created objects take this style until another style is explicitly applied to them. BaseStyle is the default value. In each case, the style currently selected on the Style Manager is applied.

Style Editor

The Style Editor allows you to assign a set of resource values to a style name. Use one of the following methods to display the Style Editor:

Displaying the Style Editor

· Double-click MB1 on a style in the Style Manager.

· Select Edit Style from the Style Manager Edit menu.

Style Editor Example

Select Styles from the Browser Managers menu to display the Style Manager (if it is not already displayed). With BaseStyle as the currently selected style, select Create Substyle from the Style Manager Edit menu to create a new style. The new style, BaseStyle1, is created as the child of BaseStyle. Double-click MB1 on BaseStyle1 to display the Style Editor:

Style Editor

The following sections describe the Style Editor options.

Style Name

Displays the name of the style that is being edited.

Parent Style

Displays the name of the parent of the edited style. Clicking on the arrow button to the right of the text field displays a list of all valid styles to which this style may be parented. Selecting a different style in this field reparents the edited style. This is identical to performing a drag and drop operation on the Style Manager.

Resources

Lists the resources selected for the edited style. Click the arrow button to the right of this text field to display a combination box containing a list of all resources recognized by the Builder Xcessory.

File placement option menu

The file placement option menu (default value uil.uil) specifies the UIL file to which style information is written when UIL is generated. Refer to File Placement for more detailed information.

Style Editor Drop Target

The Edit drop target is represented by a pencil and paper icon. Use the Edit drop target as follows:

· Drop a style onto the Edit drop target to update the Style Editor for that style.

· Drop a widget or its Browser widget instance name onto the Edit drop target to update the Resource Editor for that widget.

Editing styles

Add a resource to a style by entering the resource name directly into the Resources text field, or by clicking the arrow button and then selecting the resource name from the combination box.

Resources combination box

Make multiple selections from the combination box by clicking MB1 on each resource name in turn. Each selected resource is highlighted in the combination box. Deselect a resource by clicking on its highlighted name in the combination box.

Press the arrow button again to remove the combination box and display the names of all selected resources in the Resources text field.

Note: The style remains unchanged until you click on Apply at the bottom of the Style Editor.

Resource list

The resources you selected are displayed in a list in the Style Editor main display area, directly under the Resources text field. Assign values to these resources by entering the value directly into the resource text field, or by calling up any of the extended editors by clicking the (...) button to the right of the resource text field. The Builder Xcessory editors are described in Extended Editors .

Note: The style remains unchanged until you click on Apply at the bottom of the Style Editor.

Resource placement

The resource placement of each resource is displayed to the right of the resource (refer to Resource Settings for a Widget Instance for more detailed information).Below the resource window, the Style Editor displays the three pushbuttons, Apply, Reset, and Dismiss.

Apply

Clicking Apply on the Style Editor assigns the resource values displayed in the Resources window to the edited style.

Applying a style to a widget

To apply a style to a widget, use one of the following methods:

· Select the widget and choose the appropriate item from the Style Manager's Apply menu.

· Drag the style name from the Style Manager and drop it on the widget or the widget name on the Browser.

Applying a change to the style by clicking the Apply button on the Style Editor will immediately change the resource values of any widgets to which the style, or one of its descendants, has previously been applied.

Reset

Click Reset to read the resource values last applied to the edited style into the Style Editor.

Dismiss

Click Dismiss to remove the Style Editor window. The values in the resources window are lost unless they have been previously applied.

Saving styles

When you write out UIL, style information is included in the uil.uil file, or one of its include files.

Loading styles

When the Builder Xcessory attempts to Open or Read the selected file, it may display a warning dialog with the message "Name conflict between loaded style and new style" The warning indicates that a style currently in the Builder Xcessory Style Manager has the same name as a different style defined for the file you are attempting to open. The warning dialog has these push buttons:

· Use Loaded

Overwrites the style in the file being opened with the information in the style that already exists in the Builder Xcessory Style Manager.

· Rename New

Allows you to rename the style in the new file. The Rename Style dialog is displayed. Enter the new style name in the text field. Click OK to rename the style and remove the Rename Style dialog. If the new style name also conflicts with an existing style name, the Rename Style dialog is displayed again.

Enforced system styles

Builder Xcessory desensitizes all Resource Editor resources to which a system style is currently applied. System styles are created in the same manner as normal styles, but are written to the system file. These styles are denoted by a lock icon on the Style Hierarchy display, indicating that you cannot edit these styles. System styles allow the user to force consistent styles across a range of resources.

Adding system styles

Styles specified in {BX}/xcessory/styles/styles.uilare included on the Style Manager when you start the Builder Xcessory. You can add styles to this file with the following procedure:

Adding styles to styles.uil

1. Select New from the Browser File menu, and clear everything including existing styles.

2. Create the styles you want to add to the Builder Xcessory.

3. Generate the file uil.uil.

4. Load the new uil.uil file into a text editor. For each style, two structures are specified in the uil.uil file:

list stylename : arguments
{
arguments parentstyle;
/* resource information goes here */
};
list stylenameReasons : callbacks
{
callbacks parentstyleReasons;
/* callback information goes here */
};

5. Append this to {BX}/xcessory/styles/styles.uil. Ignore the remainder of the uil.uil file.

To edit the hierarchy of styles specified in the styles.uil file, change the parent styles in both the resource and callbacks structure.

 

Documentation: