Fix tooltips in undocked settings window

Author: fieldOfView

resources/qml/SidebarStageMenu.qml

@@ -178,18 +178,11 @@ Item
         }
         onTextChanged: function()
         {
-            /* The div automatically adapts to 100% of the parent width and
-            wraps properly, so this causes the tooltips to be wrapped to the width
-            of the tooltip as set by the operating system. */
-
-            sidebarToolWindow.tooltipText =  "<div>" + tooltip.text + "</div>"
+            sidebarToolWindow.toolTipText =  tooltip.text
         }
-        onYChanged: function()
+        onTargetChanged: function()
         {
-            sidebarToolWindow.tooltipPosition = Qt.point(
-                UM.Theme.getSize("default_margin").width,
-                tooltip.y + 3 * UM.Theme.getSize("default_margin").height
-            )
+            sidebarToolWindow.toolTipY = tooltip.target.y
         }
     }
 
@@ -322,6 +315,8 @@ Item
             // tool window is closed by window manager (not via our collapse button)
             UM.Preferences.setValue("view/settings_visible", false)
             stageMenu.settingsVisible = false
+
+            printSetupTooltip.visible = true
         }
     }
 }

resources/qml/SidebarToolWindow.qml

@@ -2,7 +2,7 @@ import QtQuick 2.7
 import QtQuick.Controls 2.3
 import QtQuick.Window 2.2
 
-import UM 1.5 as UM
+import UM 1.3 as UM
 import Cura 1.1 as Cura
 
 Window
@@ -50,17 +50,28 @@ Window
     onXChanged: UM.Preferences.setValue("sidebargui/settings_window_left", x)
     onYChanged: UM.Preferences.setValue("sidebargui/settings_window_top", y)
 
-    property string tooltipText
-    property var tooltipPosition
+    property string toolTipText
+    property int toolTipY
     function showTooltip()
     {
-        toolTip.tooltipText = tooltipText
-        toolTip.show()
+        toolTip.text = toolTipText
+        toolTip.target = Qt.point(4 * UM.Theme.getSize("default_margin").width, toolTipY)
+        if (toolTipY < (sidebarToolWindow.height / 2))
+        {
+            toolTip.y = toolTipY + 2 * UM.Theme.getSize("default_margin").height
+            toolTip.anchors.bottom = undefined
+        }
+        else
+        {
+            toolTip.y = toolTipY - toolTip.height - 1 * UM.Theme.getSize("default_margin").height
+            toolTip.anchors.top = undefined
+        }
+        toolTip.opacity = 1
     }
 
     function hideTooltip()
     {
-        toolTip.hide()
+        toolTip.opacity = 0
     }
 
     visible: !settingsDocked && settingsVisible &&  (prepareStageActive || !preSlicedData)
@@ -73,7 +84,7 @@ Window
                 sidebarToolWindow.x = base.x + base.width - sidebarToolWindow.width + UM.Theme.getSize("wide_margin").width
                 sidebarToolWindow.y = base.y + UM.Theme.getSize("wide_margin").width
             }
-            printSetupWindow.children = [sidebarContents]
+            printSetupWindow.children = [sidebarContents, toolTip]
             printSetupTooltip.visible = false  // hide vestigial tooltip in main window
         }
         else
@@ -88,12 +99,47 @@ Window
         id: printSetupWindow
 
         anchors.fill: parent
+    }
+
+    Item
+    {
+        visible: false
 
-        UM.ToolTip
+        UM.PointingRectangle
         {
             id: toolTip
 
-            width: printSetupWindow.width - 2 * UM.Theme.getSize("default_margin").width
+            width: printSetupWindow.width - 2 * UM.Theme.getSize("default_margin").width - UM.Theme.getSize("thick_margin").width
+            x: UM.Theme.getSize("thick_margin").width
+            height: Math.min(label.height + 2 * UM.Theme.getSize("default_margin").height, 400)
+
+            property alias text: label.text
+            color: UM.Theme.getColor("tooltip")
+            arrowSize: UM.Theme.getSize("default_arrow").width
+
+            opacity: 0
+            // This should be disabled when invisible, otherwise it will catch mouse events.
+            visible: opacity > 0
+            enabled: visible
+
+            Behavior on opacity
+            {
+                NumberAnimation { duration: 200; }
+            }
+
+            Label
+            {
+                id: label
+                anchors.left: parent.left
+                anchors.right: parent.right
+                anchors.top: parent.top
+                anchors.margins: UM.Theme.getSize("tooltip_margins").width
+                textFormat: Text.RichText
+                color: UM.Theme.getColor("tooltip_text")
+                font: UM.Theme.getFont("default")
+                wrapMode: Text.Wrap
+                renderType: Qt.platform.os == "osx" ? Text.QtRendering : Text.NativeRendering
+            }
         }
     }
 }