From b9999c01eb792b70e1588dc42f46ba50e5e3c758 Mon Sep 17 00:00:00 2001
From: Yann Lanthony <yann.lanthony@gmail.com>
Date: Wed, 11 Sep 2019 10:22:35 +0200
Subject: [PATCH] [ui] Update MaterialToolButton style

* flatten the button
* color its icon when checked
---
 meshroom/ui/qml/Controls/TextFileViewer.qml   | 21 ++++++-------------
 meshroom/ui/qml/ImageGallery/ImageGallery.qml |  6 ++++--
 .../qml/MaterialIcons/MaterialToolButton.qml  | 17 +++++++++++++++
 3 files changed, 27 insertions(+), 17 deletions(-)

diff --git a/meshroom/ui/qml/Controls/TextFileViewer.qml b/meshroom/ui/qml/Controls/TextFileViewer.qml
index 0f32cb23..a8d5cfd2 100644
--- a/meshroom/ui/qml/Controls/TextFileViewer.qml
+++ b/meshroom/ui/qml/Controls/TextFileViewer.qml
@@ -37,35 +37,28 @@ Item {
             background: Rectangle { color: Qt.darker(Colors.sysPalette.window, 1.2) }
             Column {
                 height: parent.height
-                ToolButton {
+                spacing: 1
+                MaterialToolButton {
                     text: MaterialIcons.refresh
                     ToolTip.text: "Reload"
-                    ToolTip.visible: hovered
-                    font.family: MaterialIcons.fontFamily
                     onClicked: loadSource()
                 }
-                ToolButton {
+                MaterialToolButton {
                     text: MaterialIcons.vertical_align_top
                     ToolTip.text: "Scroll to Top"
-                    ToolTip.visible: hovered
-                    font.family: MaterialIcons.fontFamily
                     onClicked: textView.positionViewAtBeginning()
                 }
-                ToolButton {
+                MaterialToolButton {
                     id: autoscroll
                     text: MaterialIcons.vertical_align_bottom
                     ToolTip.text: "Scroll to Bottom"
-                    ToolTip.visible: hovered
-                    font.family: MaterialIcons.fontFamily
                     onClicked: textView.positionViewAtEnd()
                     checkable: false
                     checked: textView.atYEnd
                 }
-                ToolButton {
+                MaterialToolButton {
                     text: MaterialIcons.assignment
                     ToolTip.text: "Copy"
-                    ToolTip.visible: hovered
-                    font.family: MaterialIcons.fontFamily
                     onClicked: copySubMenu.open()
                     Menu {
                         id: copySubMenu
@@ -88,11 +81,9 @@ Item {
                          }
                     }
                 }
-                ToolButton {
+                MaterialToolButton {
                     text: MaterialIcons.open_in_new
                     ToolTip.text: "Open Externally"
-                    ToolTip.visible: hovered
-                    font.family: MaterialIcons.fontFamily
                     enabled: root.source !== ""
                     onClicked: Qt.openUrlExternally(root.source)
                 }
diff --git a/meshroom/ui/qml/ImageGallery/ImageGallery.qml b/meshroom/ui/qml/ImageGallery/ImageGallery.qml
index 586addea..be9d8d65 100644
--- a/meshroom/ui/qml/ImageGallery/ImageGallery.qml
+++ b/meshroom/ui/qml/ImageGallery/ImageGallery.qml
@@ -35,9 +35,11 @@ Panel {
             text: MaterialIcons.more_vert
             font.pointSize: 11
             padding: 2
-            onClicked: graphEditorMenu.open()
+            checkable: true
+            checked: galleryMenu.visible
+            onClicked: galleryMenu.open()
             Menu {
-                id: graphEditorMenu
+                id: galleryMenu
                 y: parent.height
                 x: -width + parent.width
                 MenuItem {
diff --git a/meshroom/ui/qml/MaterialIcons/MaterialToolButton.qml b/meshroom/ui/qml/MaterialIcons/MaterialToolButton.qml
index 38688465..2eea5411 100644
--- a/meshroom/ui/qml/MaterialIcons/MaterialToolButton.qml
+++ b/meshroom/ui/qml/MaterialIcons/MaterialToolButton.qml
@@ -12,4 +12,21 @@ ToolButton {
     font.pointSize: 13
     ToolTip.visible: ToolTip.text && hovered
     ToolTip.delay: 100
+    Component.onCompleted:  {
+        contentItem.color = Qt.binding(function() { return checked ? palette.highlight : palette.text })
+    }
+    background: Rectangle {
+        color: {
+            if(pressed || checked || hovered)
+            {
+                if(pressed || checked)
+                    return Qt.darker(parent.palette.base, 1.3)
+                if(hovered)
+                    return Qt.darker(parent.palette.base, 0.6)
+            }
+            return "transparent";
+        }
+
+        border.color: checked ? Qt.darker(parent.palette.base, 1.4) : "transparent"
+    }
 }