Introduction to Smart Client themes

To override theming

For most WPF UserControls, you can override Smart Client theming by setting the Style of the control.

For example, in the Smart Client Theme sample code, the style properties applied in the XAML file for TextBlock won't be affected by Smart Client theme changes:

<Grid>
  <TextBlock Text="This WPF User Control is not auto themed." TextWrapping="Wrap" Padding="5" TextAlignment="Center">
    <TextBlock.Style>
      <Style>
        <Setter Property="TextBlock.Background" Value="#FFE5E5E5"/>
        <Setter Property="TextBlock.Foreground" Value="Black"/>
        <Setter Property="TextBlock.FontSize" Value="25"/>
      </Style>
    </TextBlock.Style>
  </TextBlock>
</Grid>

Implementation guidelines

By default, the MIP Environment automatically themes the parts of the MIP plug-in that are normally simple to handle and look well.

The following Smart Client UserControls are automatically themed by the Smart Client:

• SidePanelUserControl
• PropertiesUserControl
• OptionsDialogUserControl
• PlaybackUserControl
• UserControl returned by SettingsPanelPlugin

We recommend that the development focus for applying and supporting different themes is done on the ViewItemUserControl.

For a ViewItemUserControl, the recommended implementation consists of three areas:

1. Ensure that the header line has the correct background and foreground based on the selection and theme.
2. Have the main part of the ViewItem placed in a single panel, and use the ClientControl.Instance.RegisterUIControlForAutoTheming(myPanel) for letting the XProtect Smart Client theme all user controls within the panel.
3. Decide if the toolbar at the bottom should be enabled or not.

If you implement your own buttons or your own use of icons, you may consider to have multiple sets of icons. You may also consider replacing the buttons and icons when you receive the ThemeChangedIndication.

If you have designed your ViewItem to match your company colors or you have your own color scheme, you do not have to apply any theme properties on your ViewItem.

To disable ViewItem toolbar

If a ViewItemUserControl has user controls such as scroll or buttons at the bottom, you can disable this toolbar by overriding the ShowToolBar property:

public override bool ShowToolbar
{
    get { return false; }
}

If ShowToolbar returns true, the toolbar scrolls up from the bottom when the mouse hovers over your ViewItemUserControl.

Code Snippets

These snippets can be used to apply theme support for a ViewItemUserControl.

Create method for updating the colors of the child controls (in this case panelHeader) according to theme and selection state:

private void ApplySelectionColors()
{
    if (Selected)
    {
        panelHeader.BackColor = ClientControl.Instance.Theme.ViewItemSelectedHeaderColor;
        panelHeader.ForeColor = ClientControl.Instance.Theme.ViewItemSelectedHeaderTextColor;
    }
    else
    {
        panelHeader.BackColor = ClientControl.Instance.Theme.ViewItemHeaderColor;
        panelHeader.ForeColor = ClientControl.Instance.Theme.ViewItemHeaderTextColor;
    }
}

Define object for message reception:

private object _themeChangedReceiver;

Register a receiver for any changes in the current theme, during the Init() call :

_themeChangedReceiver = EnvironmentManager.Instance.RegisterReceiver(
    new MessageReceiver(ThemeChangedIndicationHandler),
    new MessageIdFilter(MessageId.SmartClient.ThemeChangedIndication));

Unregister during the Close() call:

EnvironmentManager.Instance.UnRegisterReceiver(_themeChangedReceiver);

Implement a handler for the theme change. Invoke the ApplySelectionColors method:

private object ThemeChangedIndicationHandler(
    VideoOS.Platform.Messaging.Message message, FQID destination, FQID source)
{
    ApplySelectionColors();
    return null;
}

In the class construction, register the panel that contains all user controls except the header and set the header colors as not selected:

ClientControl.Instance.RegisterUIControlForAutoTheming(panelMain);
panelHeader.BackColor = ClientControl.Instance.Theme.ViewItemHeaderColor;
panelHeader.ForeColor = ClientControl.Instance.Theme.ViewItemHeaderTextColor;

Override the Selected property to invoke the ApplySelectionColors method:

/// <summary>
/// Ensure we theme the header
/// </summary>
public override bool Selected
{
    get { return base.Selected; }
    set {
        base.Selected = value;
        ApplySelectionColors();
    }
}

To suppress theming

When a WinForms UserControl for some reason should not be themed, the following assignment to the UserControl's Tag property will prevent this UserControl and all inner controls from being themed:

this.Tag = "DoNotThemeMe";