Improved Tooltip (Color, image, ...)

:information_source: Attention Topic was automatically imported from the old Question2Answer platform.
:bust_in_silhouette: Asked By Degreeno
:warning: Old Version Published before Godot 3 was released.

Hi,

is it possible to set the font, color, image, background image, …
to a tooltip or is it only plain text?
If it is not possible, is there maybe some useful workaround?

:bust_in_silhouette: Reply From: Zylann

The default tooltip is the same within a given GUI theme. You can change its style by creating a theme (if not done already), go to Theme → Add Class Items, select either TooltipPanel or TooltipLabel in the selector and click Add all. This will add a style for tooltips in your themes that you can edit. Then, I guess applying the theme on your UI nodes will do the trick.

If you want a completely custom tooltip for different GUI elements (if the theme system isn’t flexible enough), you could create a scene for the tooltip, then write a script that you put on GUI elements, detect mouse-over, and shows your tooltip scene.

The custom tooltip as a new scene is a good idea. My approach:

  1. Create a new scene with a panel and some labels or other nodes.
  2. I created a Node on the CanvasLayer (ToolTipNode) and added this script to every GUI element that needs a tooltip:
### GUI ELEMENT###
extends Node

func _ready():
   self.connect("mouse_enter", self, "_mouse_enter")
   self.connect("mouse_exit", self, "_mouse_exit")


func _mouse_enter():
   get_tree().get_root().get_node("/root/Node/CanvasLayer/ToolTipNode/").showToolTip(true)


func _mouse_exit():
   get_tree().get_root().get_node("/root/Node/CanvasLayer/ToolTipNode/").showToolTip(false)


3. And a little script for the ToolTipNode:

extends Node

var scene

func _ready():
   scene = load('res://resources/scenes/ToolTip.scn').instance()
   scene.set_hidden(true)
   self.add_child(scene)


func showToolTip(isVisisble, tooltipValues):
   if(isVisisble):
	   scene.set_pos(Vector2(0, 0)) #position
       # Do stuff like...
       # ...changing the labels on the tooltip scene 
	   scene.set_hidden(false)
   else:
	   scene.set_hidden(true)

Degreeno | 2017-05-13 16:53