Articles in this section
Category / Section

How to Create ScreenTip for the Ribbon Items in Winui Ribbon Control

5 mins read

The ScreenTip is an enhanced ToolTip, and it is used to show a popup window when the pointer hovers over a RibbonItem of WinUI Ribbon. The pop-up provides helpful details of the RibbonItem’s function. You can create ScreenTip easily with these predefined properties.

The ScreenTip has the following two properties:

  • Title: Specifies the title of the ScreenTip.
  • Content: Specifies the content of the ScreenTip.

XAML

<ribbon:sfribbon>
   <ribbon:sfribbon.tabs>
       <ribbon:ribbontab header="Home">
           <ribbon:ribbongroup header="Clipboard">
               <ribbon:ribbonsplitbutton content="Paste" command="{Binding ButtonCommand}" commandparameter="Paste" icon="Paste" allowedsizemodes="Large">
                           <ribbon:ribbonsplitbutton.flyout>
                               <menuflyout>
                                   <menuflyoutitem command="{Binding ButtonCommand}" commandparameter="Paste ->Paste command" text="Paste">
                                   <menuflyoutitem command="{Binding ButtonCommand}" commandparameter="Paste ->Paste Special" text="Paste Special">
                                   <menuflyoutitem command="{Binding ButtonCommand}" commandparameter="Paste -> Set Default Paste" text="Set Default Paste">
                               </menuflyoutitem></menuflyoutitem></menuflyoutitem></menuflyout>
                           </ribbon:ribbonsplitbutton.flyout>
                           <ribbon:ribbonsplitbutton.screentip>
                           <ribbon:screentip title="Paste" content="Add content on the clipboard to your document.">
                           </ribbon:screentip></ribbon:ribbonsplitbutton.screentip>
               </ribbon:ribbonsplitbutton>
               <ribbon:ribbonbutton content="Cut" icon="Cut" command="{Binding ButtonCommand}" commandparameter="Cut" allowedsizemodes="Normal, Small">
               <ribbon:ribbonbutton.screentip>
                       <ribbon:screentip title="Cut" content="Cut the selection and put it on the clipboard.">
               </ribbon:screentip></ribbon:ribbonbutton.screentip>
               </ribbon:ribbonbutton>
               // Add more elements here...
           </ribbon:ribbongroup>
           // Add more groups here...
       </ribbon:ribbontab>
       // Add more Tabs here...
   </ribbon:sfribbon.tabs>
</ribbon:sfribbon> 

RibbonScreenTip.png

Did you find this information helpful?
Yes
No
Help us improve this page
Please provide feedback or comments
Comments (0)
Please  to leave a comment
Access denied
Access denied