I'm trying to add tooltips to toolbuttons but the mousearea hover is somehow interfering.

here is the qml that shows the problem:

Qt Code: 
  1. import QtQuick 2.2
  2. import QtQuick.Controls 1.1
  3. import QtQuick.Layouts 1.1
  4.  
  5. Rectangle {
  6.     id: page
  7.     width: 600
  8.     height: 540
  9.     border.color: "#494646"
  10.     visible: true
  11.  
  12.  
  13.     MouseArea {
  14.         id: mouseArea1
  15.         hoverEnabled: true
  16.  
  17.         anchors.fill: parent
  18.  
  19.         Flow {
  20.             id: vflow
  21.             flow: Flow.TopToBottom
  22.             anchors.fill: parent
  23.  
  24.             spacing: 12
  25.  
  26.  
  27.             Item {
  28.                 id: header
  29.                 width: 600
  30.                 height: 96
  31.  
  32.  
  33.                 Image {
  34.                     id: headerbkg
  35.                     anchors.right: parent.right
  36.                     anchors.rightMargin: 1
  37.                     anchors.left: parent.left
  38.                     anchors.leftMargin: 1
  39.                     anchors.top: parent.top
  40.                     anchors.topMargin: 1
  41.                     sourceSize.height: 96
  42.                     sourceSize.width: 480
  43.                     source: "g_header.png"
  44.                     fillMode: Image.PreserveAspectCrop
  45.                 }
  46.  
  47.                 Flow {
  48.                     id: flow1
  49.                     width: 600
  50.                     anchors.top: parent.top
  51.                     anchors.topMargin: 4
  52.                     anchors.right: parent.right
  53.                     anchors.rightMargin: 4
  54.                     spacing: 10
  55.                     layoutDirection: Qt.RightToLeft
  56.  
  57.                     ToolButton {
  58.                         id: tbClose
  59.                         width: 16
  60.                         height: 16
  61.                         iconSource: "ic_close_16x16.png"
  62.                         scale: maClose.containsMouse ? 1.1:1.0
  63.                         smooth: maClose.containsMouse
  64.                         MouseArea
  65.                         {
  66.                             id: maClose
  67.                             anchors.fill: parent
  68.                             anchors.margins: -10
  69.                             hoverEnabled:true
  70.                             onClicked: Qt.quit()
  71.                         }
  72.                     }
  73.  
  74.                     ToolButton {
  75.                         id: tbSettings
  76.                         iconSource: "ic_settings_16x16.png"
  77.                         width: 16
  78.                         height: 16
  79.                         scale: maSettings.containsMouse ? 1.1:1.0
  80.                         smooth: maSettings.containsMouse
  81.                         MouseArea
  82.                         {
  83.                             id: maSettings
  84.                             anchors.fill: parent
  85.                             anchors.margins: -10
  86.                             hoverEnabled:true
  87.                         }
  88.                     }
  89.  
  90.                     ToolButton {
  91.                         id: tbConnect
  92.                         iconSource:"ic_connect_16x16.png"
  93.                         width: 16
  94.                         height: 16
  95.                         scale: maConnect.containsMouse ? 1.1:1.0
  96.                         smooth: maConnect.containsMouse
  97.                         MouseArea
  98.                         {
  99.                             id: maConnect
  100.                             anchors.fill: parent
  101.                             anchors.margins: -10
  102.                             hoverEnabled:true
  103.                         }
  104.                     }
  105.  
  106.                     ToolButton {
  107.                         id: tbCalculate
  108.                         iconSource: "ic_calculate_16x16.png"
  109.                         width: 16
  110.                         height: 16
  111.                         tooltip: "calculate"
  112.                         scale: maCalculate.containsMouse ? 1.1:1.0
  113.                         smooth: maCalculate.containsMouse
  114.                         MouseArea
  115.                         {
  116.                             id: maCalculate
  117.                             anchors.fill: parent
  118.                             anchors.margins: -10
  119.                             hoverEnabled:true
  120.                         }
  121.                     }
  122.  
  123.                 }
  124.             }
  125.         }
  126.     }
  127. }
To copy to clipboard, switch view to plain text mode