QmlProfiler: Provide UI for hiding and showing categories

Change-Id: Ia1e2cd87523d53d4a2d0de9f74980e05c565f8e0
Reviewed-by: Kai Koehne <kai.koehne@digia.com>

src/plugins/qmlprofiler/qml/ButtonsBar.qml

@@ -35,10 +35,12 @@ import QtQuick.Controls.Styles 1.2
 
 ToolBar {
     id: buttons
+    readonly property int buttonWidth: 25
 
     signal jumpToPrev()
     signal jumpToNext()
     signal zoomControlChanged()
+    signal filterMenuChanged()
     signal rangeSelectChanged()
     signal lockChanged()
 
@@ -79,7 +81,7 @@ ToolBar {
             id: jumpToPrevButton
             anchors.top: parent.top
             anchors.bottom: parent.bottom
-            implicitWidth: 30
+            implicitWidth: buttonWidth
 
             iconSource: "qrc:/qmlprofiler/ico_prev.png"
             tooltip: qsTr("Jump to previous event.")
@@ -90,7 +92,7 @@ ToolBar {
             id: jumpToNextButton
             anchors.top: parent.top
             anchors.bottom: parent.bottom
-            implicitWidth: 30
+            implicitWidth: buttonWidth
 
             iconSource: "qrc:/qmlprofiler/ico_next.png"
             tooltip: qsTr("Jump to next event.")
@@ -101,7 +103,7 @@ ToolBar {
             id: zoomControlButton
             anchors.top: parent.top
             anchors.bottom: parent.bottom
-            implicitWidth: 30
+            implicitWidth: buttonWidth
 
             iconSource: "qrc:/qmlprofiler/ico_zoom.png"
             tooltip: qsTr("Show zoom slider.")
@@ -110,11 +112,23 @@ ToolBar {
             onCheckedChanged: buttons.zoomControlChanged()
         }
 
+        ToolButton {
+            id: filterButton
+            anchors.top: parent.top
+            anchors.bottom: parent.bottom
+            implicitWidth: buttonWidth
+
+            iconSource: "qrc:/qmlprofiler/ico_filter.png"
+            tooltip: qsTr("Filter Categories")
+            checkable: true
+            onCheckedChanged: buttons.filterMenuChanged()
+        }
+
         ToolButton {
             id: rangeButton
             anchors.top: parent.top
             anchors.bottom: parent.bottom
-            implicitWidth: 30
+            implicitWidth: buttonWidth
 
             iconSource: checked ? "qrc:/qmlprofiler/ico_rangeselected.png" :
                                   "qrc:/qmlprofiler/ico_rangeselection.png"
@@ -128,7 +142,7 @@ ToolBar {
             id: lockButton
             anchors.top: parent.top
             anchors.bottom: parent.bottom
-            implicitWidth: 30
+            implicitWidth: buttonWidth
 
             iconSource: "qrc:/qmlprofiler/ico_selectionmode.png"
             tooltip: qsTr("View event information on mouseover.")

src/plugins/qmlprofiler/qml/CategoryLabel.qml

@@ -83,6 +83,7 @@ Item {
         target: qmlProfilerModelProxy.models[modelIndex]
         onExpandedChanged: updateDescriptions()
         onRowHeightChanged: updateDescriptions()
+        onHiddenChanged: updateDescriptions()
     }
 
     Connections {

src/plugins/qmlprofiler/qml/MainView.qml

@@ -250,6 +250,7 @@ Rectangle {
         width: 150
         height: 24
         onZoomControlChanged: zoomSliderToolBar.visible = !zoomSliderToolBar.visible
+        onFilterMenuChanged: filterMenu.visible = !filterMenu.visible
         onJumpToNext: view.selectNext();
         onJumpToPrev: view.selectPrev();
         onRangeSelectChanged: selectionRangeMode = rangeButtonChecked();
@@ -437,6 +438,33 @@ Rectangle {
         id: rangeDetails
     }
 
+    Rectangle {
+        id: filterMenu
+        color: "#9b9b9b"
+        enabled: buttonsBar.enabled
+        visible: false
+        width: labels.width
+        anchors.left: parent.left
+        anchors.top: buttonsBar.bottom
+        height: qmlProfilerModelProxy.modelCount() * buttonsBar.height
+
+        Repeater {
+            id: filterMenuInner
+            model: qmlProfilerModelProxy.models
+            CheckBox {
+                anchors.left: filterMenu.left
+                anchors.right: filterMenu.right
+                height: buttonsBar.height
+                y: index * height
+                text: qmlProfilerModelProxy.models[index].displayName
+                enabled: !qmlProfilerModelProxy.models[index].empty
+                checked: enabled && !qmlProfilerModelProxy.models[index].hidden
+                onCheckedChanged: qmlProfilerModelProxy.models[index].hidden = !checked
+            }
+        }
+
+    }
+
     Rectangle {
         id: zoomSliderToolBar
         objectName: "zoomSliderToolBar"
@@ -444,7 +472,7 @@ Rectangle {
         enabled: buttonsBar.enabled
         visible: false
         width: labels.width
-        height: 24
+        height: buttonsBar.height
         anchors.left: parent.left
         anchors.top: buttonsBar.bottom
 

src/plugins/qmlprofiler/qml/qmlprofiler.qrc

@@ -27,5 +27,6 @@
         <file>ico_rangeselection.png</file>
         <file>ico_rangeselected.png</file>
         <file>ButtonsBar.qml</file>
+        <file>ico_filter.png</file>
     </qresource>
 </RCC>