Category / Section
How to create ScreenTip for the ribbon items in WPF Ribbon control?
2 mins read
The ScreenTip is an enhanced ToolTip, and it is used to show a popup window when the mouse cursor is hovered over RibbonItem of WPF Ribbon control. The popup is used to provide details of the RibbonItem’s function. The difference between ToolTip and ScreenTip is that ToolTip hosts controls to show a small popup window, whereas ScreenTip includes predefined properties. You can create ScreenTip easily with these predefined properties.
The ScreenTip has four properties.
- Description - Specifies the description of the ScreenTip.
- Image - Specifies the image of the ScreenTip.
- Content - Specifies the content of the ScreenTip.
- HelpText - Specifies the HelpText of the ScreenTip.
XAML
<Syncfusion:Ribbon Name="ribbon" VerticalAlignment="Top"> <Syncfusion:RibbonTab Name="tab" Caption="Home" IsChecked="False" > <Syncfusion:RibbonBar Header="Clipboard"> <Syncfusion:RibbonBar.ToolTip> <Syncfusion:ScreenTip MinWidth="150" Description="ScreenTip Example" VerticalOffset="10" Content="Represent a ribbon simple buttons"/> </Syncfusion:RibbonBar.ToolTip> <Syncfusion:SplitButton Name="paste" Label="Paste" SizeForm="Large" LargeIcon="/Resources/Paste32.png"> <Syncfusion:SplitButton.ToolTip> <Syncfusion:ScreenTip Description="Paste (Ctrl+V)" Content="Paste the contents of clipboard."/> </Syncfusion:SplitButton.ToolTip> </Syncfusion:SplitButton> <Syncfusion:RibbonButton Label="Cut" SizeForm="Small" SmallIcon="/Resources/Cut16.png" > <Syncfusion:RibbonButton.ToolTip> <Syncfusion:ScreenTip Description="Cut (Ctrl+X)" Content="Cut the selection and put it on the clipboard."/> </Syncfusion:RibbonButton.ToolTip> </Syncfusion:RibbonButton> <Syncfusion:RibbonButton Name="copy" Label="Copy" SizeForm="Small" SmallIcon="/Resources/Copy16.png" > <Syncfusion:RibbonButton.ToolTip> <Syncfusion:ScreenTip Content="Copy the selection and put it on the clipboard" Description="Copy (Ctrl+C)" HelpText="Press F1 for more help."/> </Syncfusion:RibbonButton.ToolTip> </Syncfusion:RibbonButton> <Syncfusion:RibbonButton IsMultiLine="True" Label="Format Painter" SizeForm="Small" SmallIcon="/Resources/FormatPainter16.png" > <Syncfusion:RibbonButton.ToolTip> <Syncfusion:ScreenTip Content="Copy formatting from one place and apply it to another" Description="Format painter (Ctrl+Shift+C)" ImageSource="/Resources/FormatPainter16.png" HelpText="Press F1 for more help."/> </Syncfusion:RibbonButton.ToolTip> </Syncfusion:RibbonButton> </Syncfusion:RibbonBar> <Syncfusion:RibbonBar Header="BackStage Operations" > <Syncfusion:RibbonCheckBox Content="Cancel BackStage Opening" x:Name="BackStageOpeningCheckBox"> <Syncfusion:RibbonCheckBox.ToolTip> <Syncfusion:ScreenTip Description="Cancel BackStage" Content="Restrict backstage opening"/> </Syncfusion:RibbonCheckBox.ToolTip> </Syncfusion:RibbonCheckBox> <Syncfusion:RibbonComboBox SelectedIndex="0" FlowDirection="LeftToRight" Width="110"> <Syncfusion:RibbonComboBox.ToolTip> <Syncfusion:ScreenTip Description="New Items" Content="Create a new item such as Meeting or contact."/> </Syncfusion:RibbonComboBox.ToolTip> <Syncfusion:RibbonComboBoxItem>Email_Message</Syncfusion:RibbonComboBoxItem> <Syncfusion:RibbonComboBoxItem>Meeting</Syncfusion:RibbonComboBoxItem> <Syncfusion:RibbonComboBoxItem>Appointment</Syncfusion:RibbonComboBoxItem> </Syncfusion:RibbonComboBox> </Syncfusion:RibbonBar> </Syncfusion:RibbonTab> </Syncfusion:Ribbon>
The following output displays the ScreenTip.