Adjust UI

5 years ago · 8072695b5d
parent 87b61dadaa
commit 8072695b5d
7 changed files with 151 additions and 14 deletions
--- a/images/dark/backspace.svg
+++ b/images/dark/backspace.svg
@ -0,0 +1,64 @@
+<?xml version="1.0" encoding="UTF-8" standalone="no"?>
+<svg
+   xmlns:dc="http://purl.org/dc/elements/1.1/"
+   xmlns:cc="http://creativecommons.org/ns#"
+   xmlns:rdf="http://www.w3.org/1999/02/22-rdf-syntax-ns#"
+   xmlns:svg="http://www.w3.org/2000/svg"
+   xmlns="http://www.w3.org/2000/svg"
+   xmlns:sodipodi="http://sodipodi.sourceforge.net/DTD/sodipodi-0.dtd"
+   xmlns:inkscape="http://www.inkscape.org/namespaces/inkscape"
+   id="Capa_1"
+   enable-background="new 0 0 64 64"
+   height="512"
+   viewBox="0 0 64 64"
+   width="512"
+   version="1.1"
+   sodipodi:docname="backspace.svg"
+   inkscape:version="1.0.1 (3bc2e813f5, 2020-09-07)">
+  <metadata
+     id="metadata13">
+    <rdf:RDF>
+      <cc:Work
+         rdf:about="">
+        <dc:format>image/svg+xml</dc:format>
+        <dc:type
+           rdf:resource="http://purl.org/dc/dcmitype/StillImage" />
+      </cc:Work>
+    </rdf:RDF>
+  </metadata>
+  <defs
+     id="defs11" />
+  <sodipodi:namedview
+     pagecolor="#ffffff"
+     bordercolor="#666666"
+     borderopacity="1"
+     objecttolerance="10"
+     gridtolerance="10"
+     guidetolerance="10"
+     inkscape:pageopacity="0"
+     inkscape:pageshadow="2"
+     inkscape:window-width="2160"
+     inkscape:window-height="1272"
+     id="namedview9"
+     showgrid="false"
+     inkscape:zoom="1.4355469"
+     inkscape:cx="256"
+     inkscape:cy="256"
+     inkscape:window-x="0"
+     inkscape:window-y="30"
+     inkscape:window-maximized="1"
+     inkscape:current-layer="Capa_1"
+     inkscape:document-rotation="0" />
+  <path
+     d="m62.933 53.333h-44.8c-.315 0-.613-.139-.816-.38l-17.066-20.266c-.334-.397-.334-.977 0-1.374l17.067-20.267c.203-.241.501-.38.816-.38h44.8c.589 0 1.067.478 1.067 1.067v40.533c-.001.589-.479 1.067-1.068 1.067zm-44.304-2.133h43.237v-38.4h-43.237l-16.168 19.2z"
+     id="path2"
+     style="fill:#ffffff;fill-opacity:1" />
+  <path
+     d="m46.933 41.6c-.273 0-.546-.105-.754-.313l-17.066-17.066c-.417-.417-.417-1.091 0-1.508.416-.417 1.092-.417 1.508 0l17.067 17.067c.417.417.417 1.091 0 1.508-.209.207-.482.312-.755.312z"
+     id="path4"
+     style="fill-opacity:1;fill:#ffffff" />
+  <path
+     d="m29.867 41.6c-.273 0-.546-.105-.754-.313-.417-.417-.417-1.091 0-1.508l17.067-17.067c.416-.417 1.092-.417 1.508 0 .417.417.417 1.091 0 1.508l-17.067 17.067c-.208.208-.481.313-.754.313z"
+     id="path6"
+     style="fill:#ffffff;fill-opacity:1" />
+</svg>
--- a/images/light/backspace.svg
+++ b/images/light/backspace.svg
@ -0,0 +1,62 @@
+<?xml version="1.0" encoding="UTF-8" standalone="no"?>
+<svg
+   xmlns:dc="http://purl.org/dc/elements/1.1/"
+   xmlns:cc="http://creativecommons.org/ns#"
+   xmlns:rdf="http://www.w3.org/1999/02/22-rdf-syntax-ns#"
+   xmlns:svg="http://www.w3.org/2000/svg"
+   xmlns="http://www.w3.org/2000/svg"
+   xmlns:sodipodi="http://sodipodi.sourceforge.net/DTD/sodipodi-0.dtd"
+   xmlns:inkscape="http://www.inkscape.org/namespaces/inkscape"
+   id="Capa_1"
+   enable-background="new 0 0 64 64"
+   height="512"
+   viewBox="0 0 64 64"
+   width="512"
+   version="1.1"
+   sodipodi:docname="2001040.svg"
+   inkscape:version="1.0.1 (3bc2e813f5, 2020-09-07)">
+  <metadata
+     id="metadata13">
+    <rdf:RDF>
+      <cc:Work
+         rdf:about="">
+        <dc:format>image/svg+xml</dc:format>
+        <dc:type
+           rdf:resource="http://purl.org/dc/dcmitype/StillImage" />
+      </cc:Work>
+    </rdf:RDF>
+  </metadata>
+  <defs
+     id="defs11" />
+  <sodipodi:namedview
+     pagecolor="#ffffff"
+     bordercolor="#666666"
+     borderopacity="1"
+     objecttolerance="10"
+     gridtolerance="10"
+     guidetolerance="10"
+     inkscape:pageopacity="0"
+     inkscape:pageshadow="2"
+     inkscape:window-width="2160"
+     inkscape:window-height="1272"
+     id="namedview9"
+     showgrid="false"
+     inkscape:zoom="1.4355469"
+     inkscape:cx="256"
+     inkscape:cy="256"
+     inkscape:window-x="0"
+     inkscape:window-y="30"
+     inkscape:window-maximized="1"
+     inkscape:current-layer="Capa_1" />
+  <path
+     d="m62.933 53.333h-44.8c-.315 0-.613-.139-.816-.38l-17.066-20.266c-.334-.397-.334-.977 0-1.374l17.067-20.267c.203-.241.501-.38.816-.38h44.8c.589 0 1.067.478 1.067 1.067v40.533c-.001.589-.479 1.067-1.068 1.067zm-44.304-2.133h43.237v-38.4h-43.237l-16.168 19.2z"
+     id="path2"
+     style="fill:#000000;fill-opacity:1" />
+  <path
+     d="m46.933 41.6c-.273 0-.546-.105-.754-.313l-17.066-17.066c-.417-.417-.417-1.091 0-1.508.416-.417 1.092-.417 1.508 0l17.067 17.067c.417.417.417 1.091 0 1.508-.209.207-.482.312-.755.312z"
+     id="path4" />
+  <path
+     d="m29.867 41.6c-.273 0-.546-.105-.754-.313-.417-.417-.417-1.091 0-1.508l17.067-17.067c.416-.417 1.092-.417 1.508 0 .417.417.417 1.091 0 1.508l-17.067 17.067c-.208.208-.481.313-.754.313z"
+     id="path6"
+     style="fill:#000000;fill-opacity:1" />
+</svg>
--- a/qml.qrc
+++ b/qml.qrc
@ -4,5 +4,7 @@
        <file>qml/Zone.qml</file>
        <file>qml/StandardButton.qml</file>
        <file>qml/StandardPad.qml</file>
+        <file>images/light/backspace.svg</file>
+        <file>images/dark/backspace.svg</file>
    </qresource>
 </RCC>
--- a/qml/StandardButton.qml
+++ b/qml/StandardButton.qml
@ -9,13 +9,14 @@ Item {
    signal clicked(string text)

    property string text
+    property var icon
    property alias textColor: _label.color
    property bool flat: false

    Layout.fillWidth: true
    Layout.fillHeight: true

-    property color backgroundColor: Meui.Theme.secondBackgroundColor
+    property color backgroundColor: Meui.Theme.backgroundColor
    property color hoveredColor: Meui.Theme.darkMode ? Qt.lighter(Meui.Theme.backgroundColor, 1.1)
                                                     : Qt.darker(Meui.Theme.backgroundColor, 1.1)
    property color pressedColor: Meui.Theme.darkMode ? Qt.darker(Meui.Theme.backgroundColor, 1.05)
@ -44,6 +45,17 @@ Item {
        onClicked: control.clicked(control.text)
    }

+    Image {
+        id: _icon
+        anchors.horizontalCenter: parent.horizontalCenter
+        anchors.verticalCenter: parent.verticalCenter
+        width: control.height * 0.4
+        height: width
+        sourceSize: Qt.size(width, height)
+        source: control.icon ? control.icon : ""
+        visible: _icon.status === Image.Ready
+    }
+
    Label {
        id: _label
        anchors.horizontalCenter: parent.horizontalCenter
@ -52,6 +64,7 @@ Item {
        horizontalAlignment: Text.AlignHCenter
        color: !flat ? Meui.Theme.textColor : Meui.Theme.highlightedTextColor
        text: control.text
+        visible: !_icon.visible
        minimumPointSize: Math.round(control.height / 5)
        font.pointSize: Math.round(control.height / 5)
    }
--- a/qml/StandardPad.qml
+++ b/qml/StandardPad.qml
@ -11,13 +11,16 @@ Item {
    GridLayout {
        id: _mainLayout
        anchors.fill: parent
-        columnSpacing: 1
-        rowSpacing: 1
+        columnSpacing: 2
+        rowSpacing: 2
        columns: 4

        StandardButton { text: "C"; onClicked: control.pressed(text) }
+        StandardButton {
+            icon: Meui.Theme.darkMode ? "qrc:/images/dark/backspace.svg" : "qrc:/images/light/backspace.svg"
+            onClicked: control.pressed("BACKSPACE")
+        }
        StandardButton { text: "%"; onClicked: control.pressed(text) }
-        StandardButton { text: "←"; onClicked: control.pressed(text) }
        StandardButton { text: "÷"; textColor: Meui.Theme.highlightColor; onClicked: control.pressed(text) }
        StandardButton { text: "7"; onClicked: control.pressed(text) }
        StandardButton { text: "8"; onClicked: control.pressed(text) }
--- a/qml/Zone.qml
+++ b/qml/Zone.qml
@ -92,7 +92,7 @@ Item {
                textField.clear()
            else 
                historyModel.clear()
-        } else if (text === 'BACK') {
+        } else if (text === 'BACKSPACE') {
            // backspace
            textField.remove(textField.cursorPosition, textField.cursorPosition - 1)
        } else {
--- a/qml/main.qml
+++ b/qml/main.qml
@ -13,15 +13,8 @@ Meui.Window {
    title: qsTr("Calculator")
    id: rootWindow

-    backgroundColor: Meui.Theme.secondBackgroundColor
-    backgroundOpacity: Meui.Theme.darkMode ? 0.9 : 0.7
-
-    Meui.WindowBlur {
-        view: rootWindow
-        enabled: true
-        geometry: Qt.rect(rootWindow.x, rootWindow.y, rootWindow.width, rootWindow.height)
-        windowRadius: rootWindow.windowRadius
-    }
+    backgroundColor: Meui.Theme.darkMode ? Qt.rgba(46 / 255, 46 / 255, 46 / 255, 1.0)
+                                         : Qt.rgba(240 / 255, 238 / 255, 241 / 255, 1.0)

    CalcEngine {
        id: calcEngine