Added big button support in Toolbar.

Toolbar will be rewritten by Tomas's call
MerginMaps · Oct 24, 2023 · 8bf7f5a · 8bf7f5a
1 parent 5959fb9
commit 8bf7f5a
Show file tree

Hide file tree

Showing 3 changed files with 113 additions and 54 deletions.
diff --git a/app/qmlV2/component/MMBottomBar.qml b/app/qmlV2/component/MMBottomBar.qml
@@ -27,11 +27,11 @@ Rectangle {
   color: Style.forest
 
   enum Buttons {
-    Delete, EditGeometry, Advanced, Save
+    Delete, EditGeometry, Advanced, Save, BigEdit
   }
 
   enum States {
-    First, Second, Third
+    First, Second, Third, Forth
   }
 
   required property var state
@@ -60,6 +60,12 @@ Rectangle {
     ListElement { button: MMBottomBar.Buttons.Save; priority: 0 }
   }
 
+  ListModel {
+    id: modelForth
+
+    ListElement { button: MMBottomBar.Buttons.BigEdit; priority: 0 }
+  }
+
   // buttons shown inside bottom bar
   ListModel {
     id: visibleButtonModel
@@ -103,6 +109,7 @@ Rectangle {
     case MMBottomBar.States.First: currentFullModel = modelFirst; break
     case MMBottomBar.States.Second: currentFullModel = modelSecond; break
     case MMBottomBar.States.Third: currentFullModel = modelThird; break
+    case MMBottomBar.States.Forth: currentFullModel = modelForth; break
     }
     visibleButtonModel.clear()
     visibleButtonModel.modelReset()

diff --git a/app/qmlV2/component/MMBottomBarButton.qml b/app/qmlV2/component/MMBottomBarButton.qml
@@ -1,68 +1,113 @@
 import QtQuick
+import QtQuick.Controls
+import QtQuick.Controls.Basic
 import "../Style.js" as Style
 
-Column {
+Item {
   id: control
 
   signal clicked(var button)
 
-  Item {
-    height: parent.height
-    width: (buttonView.width - 2*Style.commonSpacing) / buttonView.model.count
+  height: parent.height
+  width: (buttonView.width - 2*Style.commonSpacing) / buttonView.model.count
 
-    Rectangle {
-      width: parent.width - Style.commonSpacing/2
-      height: parent.height - Style.commonSpacing/2
-      anchors.centerIn: parent
-      clip: button !== MMBottomBar.Buttons.Save
-      color: Style.transparent
+  Button {
+    id: bigButton
 
-      Image {
-        source: {
-          switch (button) {
-          case MMBottomBar.Buttons.Delete: return Style.deleteIcon
-          case MMBottomBar.Buttons.EditGeometry: return Style.editIcon
-          case MMBottomBar.Buttons.Advanced: return Style.moreIcon
-          case MMBottomBar.Buttons.Save: return Style.doneIcon
-          }
-        }
-        anchors.horizontalCenter: parent.horizontalCenter
-        anchors.bottom: parent.bottom
-        anchors.bottomMargin: 2 * Style.commonSpacing + (button === MMBottomBar.Buttons.Save ? 14 * __dp : 0)
+    anchors.centerIn: parent
+    width: parent.width
+    visible: button === MMBottomBar.Buttons.BigEdit
 
-        Rectangle {
-          visible: button === MMBottomBar.Buttons.Save
-          anchors.centerIn: parent
-          width: 56 * __dp
-          height: width
-          radius: width / 2
-          color: Style.transparent
-          border.color: Style.grass
-          border.width: 14 * __dp
-        }
-      }
+    contentItem: Row {
+//      Image {
+//        source: {
+//          switch (button) {
+//          case MMBottomBar.Buttons.BigEdit: return Style.editIcon
+//          }
+//        }
+//        anchors.horizontalCenter: parent.horizontalCenter
+//        anchors.bottom: parent.bottom
+//        anchors.bottomMargin: 2 * Style.commonSpacing + (button === MMBottomBar.Buttons.Save ? 14 * __dp : 0)
+//      }
       Text {
-        text: {
-          switch (button) {
-          case MMBottomBar.Buttons.Delete: return qsTr("Delete")
-          case MMBottomBar.Buttons.EditGeometry: return qsTr("Edit Geometry")
-          case MMBottomBar.Buttons.Advanced: return qsTr("Advanced")
-          case MMBottomBar.Buttons.Save: return qsTr("Save")
-          }
-        }
-        width: parent.width
-        color: Style.white
-        font: Qt.font(Style.t4)
-        anchors.horizontalCenter: parent.horizontalCenter
-        anchors.bottom: parent.bottom
-        anchors.bottomMargin: Style.commonSpacing
+        font: Qt.font(Style.t3)
+        text: qsTr("Edit")
+        leftPadding: 32 * __dp
+        rightPadding: 32 * __dp
+        topPadding: 10 * __dp
+        bottomPadding: 10 * __dp
+        color: Style.forest
         horizontalAlignment: Text.AlignHCenter
+        verticalAlignment: Text.AlignVCenter
+        elide: Text.ElideRight
+      }
+    }
+
+    background: Rectangle {
+      color: Style.grass
+      radius: height / 2
+    }
+  }
+
+  Rectangle {
+    id: smallButton
+
+    width: parent.width - Style.commonSpacing/2
+    height: parent.height - Style.commonSpacing/2
+    anchors.centerIn: parent
+    clip: button !== MMBottomBar.Buttons.Save
+    color: Style.transparent
+
+    visible: button !== MMBottomBar.Buttons.BigEdit
+
+    Image {
+      source: {
+        switch (button) {
+        case MMBottomBar.Buttons.Delete: return Style.deleteIcon
+        case MMBottomBar.Buttons.EditGeometry: return Style.editIcon
+        case MMBottomBar.Buttons.Advanced: return Style.moreIcon
+        case MMBottomBar.Buttons.Save: return Style.doneIcon
+        case MMBottomBar.Buttons.BigEdit: return Style.doneIcon
+        }
       }
+      anchors.horizontalCenter: parent.horizontalCenter
+      anchors.bottom: parent.bottom
+      anchors.bottomMargin: 2 * Style.commonSpacing + (button === MMBottomBar.Buttons.Save ? 14 * __dp : 0)
 
-      MouseArea {
-        anchors.fill: parent
-        onClicked: control.clicked(button)
+      Rectangle {
+        visible: button === MMBottomBar.Buttons.Save
+        anchors.centerIn: parent
+        width: 56 * __dp
+        height: width
+        radius: width / 2
+        color: Style.transparent
+        border.color: Style.grass
+        border.width: 14 * __dp
+      }
+    }
+    Text {
+      text: {
+        switch (button) {
+        case MMBottomBar.Buttons.Delete: return qsTr("Delete")
+        case MMBottomBar.Buttons.EditGeometry: return qsTr("Edit Geometry")
+        case MMBottomBar.Buttons.Advanced: return qsTr("Advanced")
+        case MMBottomBar.Buttons.Save: return qsTr("Save")
+        case MMBottomBar.Buttons.BigEdit: return qsTr("Edit")
+        }
       }
+      width: parent.width
+      color: Style.white
+      font: Qt.font(Style.t4)
+      anchors.horizontalCenter: parent.horizontalCenter
+      anchors.bottom: parent.bottom
+      anchors.bottomMargin: Style.commonSpacing
+      horizontalAlignment: Text.AlignHCenter
+    }
+
+    MouseArea {
+      anchors.fill: parent
+      onClicked: control.clicked(button)
     }
   }
 }
+
diff --git a/gallery/qml/pages/BottomBarPage.qml b/gallery/qml/pages/BottomBarPage.qml
@@ -37,13 +37,13 @@ in menu of Advenced '-1' button"
     }
   }
   MMBottomBar {
-    state: MMBottomBar.States.Second; anchors.bottomMargin: 100
+    state: MMBottomBar.States.Second; anchors.bottomMargin: 100 * __dp
     Text {
       color: "white"; leftPadding: 20; anchors.bottom: parent.bottom
       text: "Delete:0 - EditGeometry:0"
     }
   }
-  MMBottomBar { state: MMBottomBar.States.Third; anchors.bottomMargin: 200
+  MMBottomBar { state: MMBottomBar.States.Third; anchors.bottomMargin: 200 * __dp
     Text {
       color: "white"; leftPadding: 20; anchors.bottom: parent.bottom
       text: "Delete:2 - EditGeometry:3 - Advanced:-1 - Save:0"
@@ -53,4 +53,11 @@ in menu of Advenced '-1' button"
     onEditGeometryClicked: console.log("Edit geometry clicked")
     onSaveClicked: console.log("Save clicked")
   }
+  MMBottomBar {
+    state: MMBottomBar.States.Forth; anchors.bottomMargin: 320 * __dp
+    Text {
+      color: "white"; leftPadding: 20; anchors.bottom: parent.bottom
+      text: "BigEdit:0"
+    }
+  }
 }