Edvin's Nested Tooltips

Unity Asset to easily add nested tooltips based on a keyword system

The game in play

Screenshot of a tooltip

Edvin's Nested Tooltips is exactly what it sounds like, it's a Unity Asset that helps easily add nested tooltips. Perfect for strategy games, rpg's or just any game with many mechanics and subsystems. So far I've sent in the asset for approval by Unity Store, so if nothing goes wrong it will be up for purchase next week.

Screenshot of nested tooltips in the example scene

Features:

  • Lightweight, easy to use, tooltip system.
  • Expandable keywords system for tooltips in tooltips
  • Icons in tooltips using TMPro Sprite sheets.
  • Scriptable Objects for keywords, set any info you want for any of them.
  • Own canvas layer, tooltips will easily appear above all other ui (canvas layer 200 by default) and won't interfere with other UI
  • Three different tooltip types by default; custom text, keyword and tooltip keywords directly in a text field.
  • Lock and Unlock your tooltips with middle mouse button (or switch to any other mouse button in the inspector).
  • Settings for everything you can think; tooltip appear time, text color, formatting, titles, keyword types.
  • Only instantiating at game start, no unnecessary instantiating and deleting of objects during runtime.
  • Example scene with all types of tooltips and examples on how to set up things.

Example of the nested tooltips in the Mariestad Climate Game

Example of many tooltips for different keywords in the tutorial for High Frontier 4 All

The tooltip manager

Tooltips

A tooltip is simply a message that appears in a text box when you hover over a UI element. They are common in video games, but also on websites and in software. I have some tooltips on the Kastorix Character Sheet page. Doing tooltips in Unity isn’t particularly hard, there are many youtube tutorials on the subject and at least one free asset on the Unity store.
You use the IPointerHandler function to detect if the player is hovering over a UI object and if so show another UI element, commonly just a text box with a preset message. There are some things to keep in mind here, enabling raycasting on the UI element, checking canvas layers so nothing obscures the UI or the tooltip and deciding how you want to show the tooltip text.

The tooltip manager

My Implementation

The core of my system is the TooltipManager on its own prefab that can be added anywhere to any scene. At awake it creates a number of tooltip window objects from a prefab. To give a UI element a tooltip you simply give it TooltipTrigger script (or put a TooltipArea prefab on top). The trigger gets a reference to the manager at Start and takes care of the Pointer Handling, then sends a message to the manager, which gets its first available tooltip, sets the correct message on it and places it at the right location. When it does this it also checks the edges of the canvas to make sure that the tooltip window doesn’t appear partially outside the screen, nudging the window so it can be seen. The Tooltip System also allows you to temporarily lock tooltips in place with the middle mouse button, allowing you to keep it open while you look around the screen.

To speed up development and UI testing, my system also features a Tooltip Window Style scriptable object, with a few different pre set examples and options to quickly test new appearances for your tooltip windows, texts, keywords and borders.

The tooltip manager

Keywords

The thing that makes the tooltips nested and my system unique however is the keyword system. There is a Keyword Scriptable Object that users can input any keywords into and a keyword handler that adds links to any keywords found in tooltips or other assigned texts. If a tooltip for example reads “Global tags are one of the six types of tags in the game”, then the phrases ’Global tags’ and ‘tags’ will be linked in the tooltip. If a player wants to know more about what a tag is they can hover over the tag keyword and another tooltip will appear explaining it. This can be done with words, how steps deep as desired and as set up there are no limits to the amount of keywords or the amount of phrases for each keyword.

This is what's called nested keywords, and is extremely useful in complex games with many mechanics, resources and systems. It can be found in all modern Paradox games, in Baldur's Gate 3 and as of the latest update in Civilization 7. It can also be found in High Frontier 4, where I implemented the updated system after my internship and on my digital adaptation of the Mariestad climate game. And as soon as it’s approved by unity, you can have it in your game.

Example of a keyword Scriptable Object

The layout of the scene objects in the example scene with a tooltip open

Development Process

As a fan of complicated strategy games, tooltips and good UI design have been important practices for me for a long time. Even in the first strategy game I made in Unity, City State, I made simple tooltips for the resource types.
But what I really wanted was tooltips like those found in modern paradox games, starting with Crusader Kings 3. These are really useful for explaining complex game mechanics and showing how they connect to each other. During the development of Wizards Legacy (still needs a page on this), I made the first version of nested tooltips, though that version instantiated tooltip prefabs every time you needed one and was far more buggy than this one. When I worked on High Frontier as part of my internship with ION Game Design I implemented a better version in the game. The tooltip system I implemented there works but it still had some limitations, with keywords not being able to be part of other keywords.
Still I really liked the system and wanted to make a standalone version that I could use in future projects. So I moved the scripts into a standalone project and fixed issues like keywords not being able to contain part of other keywords, and the tooltips going off the edge of the screen. During the development I realized it could be a useful tool for others, and spent time polishing it and making it as easy to use as possible.