Components/ Tooltip
The tooltip is a straightforward component.
For more complex needs, we provide an implementation called DefaultTooltip. It is designed to handle a wide range of scenarios.
Attributes
| Attribute | Description |
|---|---|
| FadeDelay | Delay before starting to fade in or out. |
| FadeUpdateFrequency | The frequency (in milliseconds) for fade updates. Lower values result in faster fading. |
| Start Hidden | Initial visibily. |
Tooltip Guide
TooltipManipulator
Add the TooltipManipulator to the VisualElements you want to display a tooltip for when they are hovered over or focused.
This will display the tooltip we created when myElement is hovered over or focused. As you can see, the Tooltip itself is very simple.
Class Controls
Position
Apply these USS classes to the VisualElements that will display a tooltip when hovered over or focused to adjust the tooltip's position. Default value is top.
| Class | Description |
|---|---|
| tooltip-left | Position tooltip to the left of the VisualElement. |
| tooltip-right | Position tooltip to the right of the VisualElement. |
| tooltip-bottom | Position tooltip to the left of the VisualElement. |
Follow Mouse
| Class | Description |
|---|---|
| tooltip-follow | The tooltip will position itself relative to the mouse instead of the VisualElement and will move along with the mouse. Position class controls still apply. |
DefaultTooltip Guide
To support more complex scenarios commonly encountered in games, we've provided a default implementation to cover most use cases.
DefaultTooltip is not an extension of Tooltip; it is an extension of TooltipManipulator. It creates and controls a Tooltip with customizable slots and the ability to display multiple columns simultaneously.
Setup
You can just copy the setup from demo Game samples. All you need is to create a document with Tooltip component named DefaultTooltip.
DefaultTooltipManipulator
Constructor
| Name | Type | Description |
|---|---|---|
| parent | GameObject | The tooltip will automatically close when this GameObject is disabled. |
| tooltip | DefaultTooltip | Referance to the tooltip to control. |
| setup | DefaultTooltipContainerSetup | Container setup for a column. See below for details. |
DefaultTooltipContainerSetup
| Name | Type | Description |
|---|---|---|
| image | VisualElement | VisualElement to place in the image slot. |
| title | VisualElement | VisualElement to place in the title slot. |
| body | VisualElement | VisualElement to place in the body slot. |
| bottom | VisualElement | VisualElement to place in the bottom slot. Use this slot if you don't want any prior layout. |
| colorBackground | UIColor | Change tooltip container's background color. |
| colorBorder | UIColor | Change tooltip container's border color. |
| maxWidth | int | Change tooltip container's max with in pixels. |