Screen Tips

Bars fully implements screen tips for controls, which are advanced variations of standard tooltips. They not only display a normal tooltip header but also can contain shortcut keys, longer descriptions, complex content, and footers.

Since the ScreenTip class derives from a standard ToolTip control, it can be used anywhere a normal ToolTip is used.

Several varieties of screen tips

Screen Tip Infrastructure

For Bars controls that do not explicitly assign the ToolTip.Tip property to an instance of a ToolTip control (or a control that derives from ToolTip, like ScreenTip), a ScreenTip will be coerced based on the available data.

A ScreenTip is composed of three areas: Header, Content, and Footer.

Screen Tip Header

The base Header content is defined by the control's ScreenTipHeader property (e.g., BarButton.ScreenTipHeader). Most controls are configured with a default theme that binds the ScreenTipHeader property to a Title property (e.g., BarButton.Title) on the same control.

The screen tip Header can be set to any object supported by ContentPresenter.

If the ScreenTipHeader property is undefined, the control's Label property (e.g., BarButton.Label) will be converted to the base Header content. Any Label value that ends with ellipses (e.g., "Print...") will trim the trailing ellipsis from the base Header content.

Finally, if the base Header content is a string and the control defines an InputGesture property (e.g., BarButton.InputGesture) , that gesture text will optionally be appended within parenthesis to the end of the Header content (e.g., "Copy (Ctrl+C)"). Appending the gesture text can be disabled by setting the IsInputGestureTextVisible property (e.g., BarButton.IsInputGestureTextVisible) to false.

Screen Tip Content

The body of a control's ToolTip.Tip property defines the Content of a screen tip unless the property is set to a ToolTip control (or a control that derives from ToolTip, like ScreenTip).

The screen tip Content can be set to any object supported by ContentPresenter and enables the display of complex layouts within a screen tip.

Screen Tip Footer

The Footer content is defined by the control's ScreenTipFooter property (e.g., BarButton.ScreenTipFooter). By default, no other properties are bound to this property or used to coerce the Footer content.

The screen tip Footer can be set to any object supported by ContentPresenter.

Common Examples

Most Bars controls that do not explicitly assign the ToolTip.Tip property a value will display a basic screen tip with text automatically generated from the control's Title or Label with optional InputGesture . The following are examples with the resulting screen tip defined by the comment above each sample:

xmlns:actipro="http://schemas.actiprosoftware.com/avaloniaui"
...

<!-- Copy to Clipboard (Ctrl+C) -->
<actipro:BarButton Title="Copy to Clipboard" Label="Copy" Command="{Binding CopyCommand}" InputGesture="Ctrl+C" />

<!-- Copy (Ctrl+C) -->
<actipro:BarButton Label="Copy" Command="{Binding CopyCommand}" InputGesture="Ctrl+C" />

<!-- Copy to Clipboard -->
<actipro:BarButton Title="Copy to Clipboard" IsInputGestureTextVisible="False" Command="{Binding CopyCommand}" InputGesture="Ctrl+C" />

By setting the ToolTip.Tip property to a string value, the basic screen tip like that from the previous example will display an additional description for the content. The following example would display a screen tip with the header "Copy to Clipboard (Ctrl+C)" and text content of "Copies the selection to the clipboard".

xmlns:actipro="http://schemas.actiprosoftware.com/avaloniaui"
...
<actipro:BarButton Title="Copy to Clipboard" Command="{Binding CopyCommand}" InputGesture="Ctrl+C" ToolTip.Tip="Copies the selection to the clipboard" />

Explicitly Defining a Screen Tip

Since a ScreenTip derives from a standard ToolTip, you can define it like a standard ToolTip as well. The following example shows explicitly defining a ScreenTip:

xmlns:actipro="http://schemas.actiprosoftware.com/avaloniaui"
...
<actipro:BarButton Command="{Binding CopyCommand}">
	<ToolTip.Tip>
		<actipro:ScreenTip>
			<actipro:ScreenTip.Header>
				<!-- Insert any header here -->
			</actipro:ScreenTip.Header>
			<actipro:ScreenTip.Content>
				<!-- Insert any content here -->
			</actipro:ScreenTip.Content>
			<actipro:ScreenTip.Footer>
				<!-- Insert any footer here -->
			</actipro:ScreenTip.Footer>
		</actipro:ScreenTip>
	</ToolTip.Tip>
</bars:BarButton>

Use Screen Tip Anywhere

Yes, ScreenTip can really be used on any control! The following example shows a standard TextBox control configured with a ScreenTip:

xmlns:actipro="http://schemas.actiprosoftware.com/avaloniaui"
...
<TextBox x:Name="username">
	<ToolTip.Tip>
		<actipro:ScreenTip Header="Username">
			Screen tips can be used with any control to enhance the user experience.
		</actipro:ScreenTip>
	</ToolTip.Tip>
</TextBox>

ScreenTipService

The ScreenTipService provides numerous attached properties and events for working with screen tips and manages screen tip display and behavior.

It has these important properties:

Most of the screen tip content properties are of type object, allowing you to pass a string of text or any control supported by ContentPresenter. This allows for great flexibility in what you can display on the screen tip.

Dynamically Generating Screen Tip Content

Screen tip content can be dynamically generated. This allows you to modify the screen tip data on demand to best reflect the current state of the control.

To do this, listen to the ScreenTipService.ScreenTipOpening event available as ScreenTipService.Current.ScreenTipOpening. That event is raised before a screen tip is about to display for a control. In the event handler, you may change the screen tip before it is rendered to the end user.

Complex Content Width

By default, screen tips are relatively narrow and work well for text-based content. When more complex content is used (such as images), the default width may be too narrow. To allow wider screen tips, set the ScreenTip.ComplexContentWidth property to a more appropriate value.

When a ScreenTip is explicitly defined, this property can be set directly on the control. In other scenarios, listen to the ScreenTipService.ScreenTipOpening event and alter the ComplexContentWidth property before a screen tip is displayed.