# Creating Tooltips for Scene

## **Edit Collection**

{% columns %}
{% column width="58.333333333333336%" %}

* To create a new tooltip for the scene, add an item to the[ DHT > Tooltip Collection](https://octanta-studio.gitbook.io/dynamic-hover-tooltips/data/core-components#dynamic-hover-tooltips) list (using the \[+] button at the bottom right).
* Enter a unique Tooltip Name - it may be needed for external calls.
* Configure the tooltip’s launch conditions (see [Tooltip Launch](https://octanta-studio.gitbook.io/dynamic-hover-tooltips/data/supported-interactions#for-tooltip-collection)). Set how often the tooltip should appear, e.g., repeat multiple times or show only once. Set the trigger - for example, the tooltip can appear every time you hover over an object with the tag "Target" or with "Enemy" in its name.
* Set up the visuals (see [Tooltip Visuals](https://octanta-studio.gitbook.io/dynamic-hover-tooltips/data/supported-visuals)) - for example, assign the UI Pointer Prefab = UIPointerHighlightedText.prefab and enter the text to display in the UI Pointer Text field. Alternatively, enable Use CSV Table Keys and enter a key from the localization table instead of direct text.
  {% endcolumn %}

{% column width="41.666666666666664%" %}

<figure><img src="https://3177874520-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2FEJ8JFKcPpASAN5cAhCbl%2Fuploads%2FlcML8squunouejz54gvc%2Fimage_2026-02-08_12-01-35.png?alt=media&#x26;token=a3175dcc-b8c6-4fe1-af2b-5f7053cc024a" alt=""><figcaption></figcaption></figure>
{% endcolumn %}
{% endcolumns %}

{% columns %}
{% column width="58.333333333333336%" %}

* Add any **additional behavior** if needed. This can be done even if no visuals are attached.

Play a sound or change the in-game cursor (for example, to a hand grab icon when the player hovers over a pickable object). The system includes a built-in example: when you hover over an interactive object with the center of the screen, it shows the interaction icon using the ShowScreenCenterIcon method and the screenCenterIcon prefab (spawns in the center of the screen by default). By analogy, activate your own objects or replace the built-in icon. You can use this logic to enable or disable player input for interacting with objects too.
{% endcolumn %}

{% column width="41.666666666666664%" %}

<figure><img src="https://3177874520-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2FEJ8JFKcPpASAN5cAhCbl%2Fuploads%2FbJaSvgmDpxvHlgg6cBJR%2Fimage_2026-02-09_20-00-56.png?alt=media&#x26;token=a69316bf-8940-4e9e-a94f-f612795e1d09" alt=""><figcaption></figcaption></figure>
{% endcolumn %}
{% endcolumns %}

## **Add External Triggers**

If the centralized collection isn’t enough, add a [TooltipTrigger](https://octanta-studio.gitbook.io/dynamic-hover-tooltips/data/core-components#tooltip-trigger) component to individual scene objects or prefabs. This lets them control visuals from the collection externally.

For example, if you have a skill icon in the UI and want it to show its tooltip on click: first, add an item to the Tooltip Collection and give it a name, e.g., "universal\_icon\_tooltip". Set Trigger = External Trigger Only and configure the visuals to be used, e.g., UI Pointer Prefab = UIPointerTextSimple.

{% columns %}
{% column width="58.333333333333336%" %}

* Then, add a TooltipTrigger component to the icon object and enter the name of the collection item (e.g., "universal\_icon\_tooltip").
* Choose the trigger (what action on the object will show the tooltip), e.g., OnHover. The selected trigger automatically controls the start and end of the tooltip, for example, hovering over the object and moving the mouse away.
* If the object should provide its own text to the tooltip, enter it here or use its localization key, just like in the collection.
* This same component works well for showing outlines and other effects on an object. See [how to add Outline OnHover via script](https://octanta-studio.gitbook.io/dynamic-hover-tooltips/data/methods-for-editing#simple-method-for-editing-1).
  {% endcolumn %}

{% column width="41.666666666666664%" %}

<figure><img src="https://3177874520-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2FEJ8JFKcPpASAN5cAhCbl%2Fuploads%2Frbb24dLyfV3WIcstCBRx%2Fimage_2026-02-08_12-17-00.png?alt=media&#x26;token=f2163436-5e92-4329-8f08-166a131c0183" alt=""><figcaption></figcaption></figure>

{% endcolumn %}
{% endcolumns %}

## **Test & Edit Settings**

Run the scene ▶

Check that the tooltip show and hide logic works correctly. If not, review the steps above and adjust it. Also, verify that the visuals are correct (scale, positions of child objects, Cutout size for FormedMask and Offset for UI frame). If needed, choose other prefabs or edit the existing ones:

{% columns %}
{% column %}

* Modify the prefab content itself - for example, if you use a 2D geotag, replace it\`s sprite inside the prefab, adjust its position or scale, change its color, or add more objects and animations inside the prefab. If it’s a generated frame, edit the corner prefab; if it’s a mask, adjust settings in the internal IrisCutoutMask component, depending on the visual you are using.
  {% endcolumn %}

{% column %}

<figure><img src="https://3177874520-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2FEJ8JFKcPpASAN5cAhCbl%2Fuploads%2F6RN7UpIgAI8N3a7XoIBZ%2Fimage_2026-02-08_12-36-27.png?alt=media&#x26;token=fda281a4-3ac3-4d46-aba2-216c5a896f3c" alt=""><figcaption></figcaption></figure>
{% endcolumn %}
{% endcolumns %}

* Change animation settings for each prefab. Go to the Settings ScriptableObject and try modifying the appearance, dissapearance, idle animations, increase the follow speed, add offsets, or other behaviors.
* Try creating a completely custom prefab for the UI or World Pointer field. This is described in more detail in the [Supported Visuals](https://octanta-studio.gitbook.io/dynamic-hover-tooltips/data/supported-visuals) section.

## **Reset Progress**

If you’re using tooltips set to Once, you may need to reset their progress for testing. In play mode, go to TooltipPlayer and click Reset Progress.

## **Use Scripts (Advanced)**

See [Methods For Editing](https://octanta-studio.gitbook.io/dynamic-hover-tooltips/data/methods-for-editing).

### **Trigger the pointer manually**

If the base collection works with built-in trigger recognition and external triggers via objects, you can also call tooltips manually from different parts of your project. Public methods for this are available in **Scene References**. For example:

1. Create a tooltip with UI Pointer Prefab = UIPointerIrisMask.prefab, Set Trigger = Click (or another interaction), Tooltip Replay = Once, and give it a unique name, e.g., "iris\_raycast\_blocker".
2. In your script, assign:

```csharp
public SceneReferences sceneReferences;
```

3. Then call sequentially:

```csharp
sceneReferences.SetTooltipTarget("iris_raycast_blocker", targetObject);
sceneReferences.ShowTooltip("iris_raycast_blocker");
```

This will create a tooltip that darkens everything except the target and will disappear only when the player clicks that object.

### **Configure the visual depending on the target**

In the scripts that control pointer prefabs, **WorldPointerAnimation** and **UIPointerAnimation**, there is a method called **RedesignConsideringTarget** that is automatically invoked during pointer initialization. You can customize it to suit your needs:

```
 [SerializeField] private Image extraImage; // Example for extra visual
 public void RedesignConsideringTarget()
 {
     GameObject targetObject = GetCurrentTarget();                
     if (targetObject) // Add extra conditions here
     {
        if (extraImage) { extraImage.color = Color.white; } // Color depends on target
     }
 }
```

For example, if this is a pointer triggered by the collection when hovering over any UI element, you can add your own checks here and can display additional text, an icon with a special symbol, an extra colored frame, and so on.

### **Add Outlines**

{% columns %}
{% column %}
Add outlines, custom shaders, and effects to highlight targets via **TooltipTrigger**. To do this, uncomment the component logic (MethodForEditing), implement your own, and assign the references.

Since the component is shared by all possible targets, you can differentiate their behavior using different fields in the outline component.

This doesn’t have to be just an outline - it can also be, for example, color lerp on the object’s image, an animation, particle system activation, or other effects.
{% endcolumn %}

{% column %}

<figure><img src="https://3177874520-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2FEJ8JFKcPpASAN5cAhCbl%2Fuploads%2FCyNrv9HzAF0WHTGp4fyN%2Fimage_2026-02-09_20-51-38.png?alt=media&#x26;token=b6ea18f4-31ca-499f-b77e-a9f19d1ff658" alt=""><figcaption></figcaption></figure>

<sub>*For example, in a Valiant Hearts: The Great War, approaching an interactive object changes its color.*</sub>
{% endcolumn %}
{% endcolumns %}

```
[SerializeField] private Outline outlineComponent;
[SerializeField] private Outline outlineComponentTrigger;
public void Update()
{
    bool activeState = isRaycasted;
    if (outlineComponent) { outlineComponent.enabled = activeState; }
     bool activeStateTrigger = isWithinDistance || isTriggered;
    if (outlineComponentTrigger) { outlineComponentTrigger.enabled = activeStateTrigger; }
}
```