Web Rule UI Settings and Appearance

Many visual features of the Rule Editor can be customized as shown below.

Themes

Web Rule comes preloaded with seven CSS themes:

• Black, Blue, Gray, Green, Navy, Red, White

Each theme is implemented in a separate CSS file. The default setting is the Gray theme. Each theme uses the same class names, and each class is prefixed with ce. You can either set the theme programmatically by setting the value of the RuleEditor.Theme property to any member of the ThemeType enumerator...

ruleControl.Theme = CodeEffects.Rule.Common.ThemeType.Green;

... or declaratively, in ASP.NET...

<%@ Register assembly="CodeEffects.Rule"
	namespace="CodeEffects.Rule.Asp" tagprefix="rule" %>

<div>
	<rule:RuleEditor
		ID="ruleControl" runat="server"
		SourceAssembly="TestProject"
		SourceType="TestProject.MySourceObject"
		Theme="Black" />
</div>

... and in MVC:

@{
	Html.CodeEffects().Styles()
		.SetTheme(ThemeType.Blue)
		.Render();	
}

You can also use your own styles if none of the default CSS files meet your requirements. To do so, first set the RuleEditor.Theme property to ThemeType.None. Then, either modify any of Web Rule's theme files or create your own, making sure that all class names used in your file are the same as those used in Web Rule's themes. And finally, include your new file in HTML as you would include any other CSS file.

Settings

The Rule Editor also allows you to change the default values of some UI settings. Click the Settings link on the demo page to see most of these settings in action. The following list refers to both ASP.NET and MVC RuleEditor classes.

• RuleEditor.ShowLineDots. If set to True, displays mid dots at the beginning of each new line inside the rule (you can insert new lines in rules by hitting the Enter key; see the Rule Editor topic for keyboard support details). The default value is False.
• RuleEditor.ShowMenuOnRightArrowKey. If set to True, displays an appropriate context menu every time the rule author moves the selection from one element to another by pressing the Right Arrow key as (s)he walks through the current rule using the Arrow keys. The default value is True.
• RuleEditor.ShowMenuOnElementClicked. If set to True, displays a context menu with replacement items every time the rule author clicks the selected rule element. This setting is very useful if you'd like to allow rule authors to edit rules on-the-fly. The default value is True.
• RuleEditor.ShowDescriptionsOnMouseHover. If set to True, the rule author can hover the cursor over any rule element to view its description (if the value of the Description property of the Field, Action, Method, or Parameter attribute is set for that element). The default value is True.
• RuleEditor.ShowToolBar. If set to True, displays the Toolbar at the top of the Rule Editor. Toolbar is an important feature of Web Rule, so make sure to read its topic. The default value is True.
• RuleEditor.ShowHelpString. If set to True, displays the Help String. The default value is True.