From e162fd4cd8bccc67a530410118cffed47a3d7b5a Mon Sep 17 00:00:00 2001 From: yann300 Date: Thu, 9 Apr 2015 17:51:07 +0200 Subject: [PATCH] UI improvement --- mix/qml/Debugger.qml | 6 +- mix/qml/StateDialog.qml | 168 ++++++++++++++++++---------------- mix/qml/StateListModel.qml | 4 +- mix/qml/StatusPane.qml | 31 +++++++ mix/qml/TransactionDialog.qml | 1 - mix/qml/TransactionLog.qml | 10 +- 6 files changed, 135 insertions(+), 85 deletions(-) diff --git a/mix/qml/Debugger.qml b/mix/qml/Debugger.qml index e5c7e576d..df9f221a8 100644 --- a/mix/qml/Debugger.qml +++ b/mix/qml/Debugger.qml @@ -215,14 +215,16 @@ Rectangle { id: buttonRow height: 30 Layout.fillWidth: true + width: parent.width color: "transparent" Rectangle { anchors.top: parent.top anchors.bottom: parent.bottom anchors.left: parent.left + anchors.leftMargin: machineStates.sideMargin color: "transparent" - width: parent.width * 0.4 + width: 240 RowLayout { anchors.horizontalCenter: parent.horizontalCenter id: jumpButtons @@ -358,7 +360,7 @@ Rectangle { anchors.top: parent.top anchors.bottom: parent.bottom anchors.right: parent.right - width: parent.width * 0.6 + width: parent.width - 265 color: "transparent" Slider { id: statesSlider diff --git a/mix/qml/StateDialog.qml b/mix/qml/StateDialog.qml index 0af27f055..82e817eb1 100644 --- a/mix/qml/StateDialog.qml +++ b/mix/qml/StateDialog.qml @@ -13,7 +13,7 @@ Dialog { id: modalStateDialog modality: Qt.ApplicationModal - width: 590 + width: 630 height: 480 title: qsTr("Edit State") visible: false @@ -79,7 +79,10 @@ Dialog { } contentItem: Rectangle { color: stateDialogStyle.generic.backgroundColor - ColumnLayout { + Rectangle { + color: stateDialogStyle.generic.backgroundColor + anchors.top: parent.top + anchors.margins: 10 anchors.fill: parent ColumnLayout { anchors.fill: parent @@ -91,7 +94,7 @@ Dialog { { Layout.fillWidth: true DefaultLabel { - Layout.preferredWidth: 75 + Layout.preferredWidth: 85 text: qsTr("Title") } DefaultTextField @@ -112,10 +115,10 @@ Dialog { Rectangle { - Layout.preferredWidth: 75 + Layout.preferredWidth: 85 DefaultLabel { id: accountsLabel - Layout.preferredWidth: 75 + Layout.preferredWidth: 85 text: qsTr("Accounts") } @@ -227,7 +230,7 @@ Dialog { { Layout.fillWidth: true DefaultLabel { - Layout.preferredWidth: 75 + Layout.preferredWidth: 85 text: qsTr("Default") } CheckBox { @@ -240,52 +243,91 @@ Dialog { { Layout.fillWidth: true } - } - ColumnLayout { - anchors.top: dialogContent.bottom - anchors.topMargin: 5 - spacing: 0 RowLayout { - Layout.preferredWidth: 150 - DefaultLabel { - text: qsTr("Transactions: ") - } + Layout.fillWidth: true - Button + Rectangle { - iconSource: "qrc:/qml/img/plus.png" - action: newTrAction - width: 10 - height: 10 - anchors.right: parent.right - } + Layout.preferredWidth: 85 + DefaultLabel { + id: transactionsLabel + Layout.preferredWidth: 85 + text: qsTr("Transactions") + } - Action { - id: newTrAction - tooltip: qsTr("Create a new transaction") - onTriggered: transactionsModel.addTransaction() + Button + { + anchors.top: transactionsLabel.bottom + anchors.topMargin: 10 + iconSource: "qrc:/qml/img/plus.png" + action: newTrAction + } + + Action { + id: newTrAction + tooltip: qsTr("Create a new transaction") + onTriggered: transactionsModel.addTransaction() + } } - } - ScrollView - { - Layout.fillHeight: true - Layout.preferredWidth: 300 - Column + TableView { - Layout.fillHeight: true - Repeater - { - id: trRepeater - model: transactionsModel - delegate: transactionRenderDelegate - visible: transactionsModel.count > 0 - height: 20 * transactionsModel.count + id: transactionsView + Layout.fillWidth: true + model: transactionsModel + headerVisible: false + TableViewColumn { + role: "name" + title: qsTr("Name") + width: 150 + delegate: Item { + RowLayout + { + height: 30 + width: parent.width + Button + { + iconSource: "qrc:/qml/img/delete_sign.png" + action: deleteTransactionAction + } + + Action { + id: deleteTransactionAction + tooltip: qsTr("Delete") + onTriggered: transactionsModel.deleteTransaction(styleData.row) + } + + Button + { + iconSource: "qrc:/qml/img/edit.png" + action: editAction + visible: styleData.row >= 0 ? !transactionsModel.get(styleData.row).stdContract : false + width: 10 + height: 10 + Action { + id: editAction + tooltip: qsTr("Edit") + onTriggered: transactionsModel.editTransaction(styleData.row) + } + } + + DefaultLabel { + Layout.preferredWidth: 150 + text: styleData.row >= 0 ? transactionsModel.get(styleData.row).functionId : "" + } + } + } + } + rowDelegate: + Rectangle { + color: styleData.alternate ? "transparent" : "#f0f0f0" + height: 30; } } } + } RowLayout @@ -304,6 +346,13 @@ Dialog { text: qsTr("Cancel"); onClicked: close(); } + Button { + text: qsTr("Delete"); + onClicked: { + projectModel.stateListModel.deleteState(stateIndex); + close(); + } + } } ListModel { @@ -325,7 +374,6 @@ Dialog { } function addTransaction() { - // Set next id here to work around Qt bug // https://bugreports.qt-project.org/browse/QTBUG-41327 // Second call to signal handler would just edit the item that was just created, no harm done @@ -350,44 +398,6 @@ Dialog { } } - Component { - id: transactionRenderDelegate - RowLayout { - DefaultLabel { - Layout.preferredWidth: 150 - text: functionId - } - - Button - { - id: deleteBtn - iconSource: "qrc:/qml/img/delete_sign.png" - action: deleteAction - width: 10 - height: 10 - Action { - id: deleteAction - tooltip: qsTr("Delete") - onTriggered: transactionsModel.deleteTransaction(index) - } - } - - Button - { - iconSource: "qrc:/qml/img/edit.png" - action: editAction - visible: stdContract === false - width: 10 - height: 10 - Action { - id: editAction - tooltip: qsTr("Edit") - onTriggered: transactionsModel.editTransaction(index) - } - } - } - } - TransactionDialog { id: transactionDialog diff --git a/mix/qml/StateListModel.qml b/mix/qml/StateListModel.qml index 7b7f33361..a0cb25eb3 100644 --- a/mix/qml/StateListModel.qml +++ b/mix/qml/StateListModel.qml @@ -167,6 +167,7 @@ Item { signal defaultStateChanged; signal stateListModelReady; signal stateRun(int index) + signal stateDeleted(int index) function defaultTransactionItem() { return TransactionHelper.defaultTransaction(); @@ -293,9 +294,8 @@ Item { } else if (defaultStateIndex > index) defaultStateIndex--; - save(); - + stateDeleted(index); } function save() { diff --git a/mix/qml/StatusPane.qml b/mix/qml/StatusPane.qml index 9e10edbe9..f3bde4a04 100644 --- a/mix/qml/StatusPane.qml +++ b/mix/qml/StatusPane.qml @@ -3,6 +3,7 @@ import QtQuick.Controls 1.1 import QtQuick.Layouts 1.1 import QtQuick.Controls.Styles 1.3 import org.ethereum.qml.InverseMouseArea 1.0 +import QtGraphicalEffects 1.0 import "js/ErrorLocationFormater.js" as ErrorLocationFormater import "." @@ -246,6 +247,27 @@ Rectangle { tooltip: "" } + Rectangle + { + id: logsShadow + width: logsContainer.width + 5 + height: 0 + opacity: 0.3 + clip: true + anchors.top: logsContainer.top + anchors.margins: 4 + Rectangle { + color: "gray" + anchors.top: parent.top + radius: 10 + id: roundRect + height: 400 + width: parent.width + } + } + + + Rectangle { InverseMouseArea @@ -287,9 +309,16 @@ Rectangle { top = top.parent var coordinates = logsContainer.mapToItem(top, 0, 0); logsContainer.parent = top; + logsShadow.parent = top; logsContainer.x = status.x + statusContainer.x - logStyle.generic.layout.dateWidth - logStyle.generic.layout.typeWidth + 70 + logsShadow.x = status.x + statusContainer.x - logStyle.generic.layout.dateWidth - logStyle.generic.layout.typeWidth + 70; + logsShadow.z = 1 + logsContainer.z = 2 if (Qt.platform.os === "osx") + { logsContainer.y = statusContainer.y; + logsShadow.y = statusContainer.y; + } } LogsPaneStyle { @@ -305,6 +334,7 @@ Rectangle { State { name: "opened"; PropertyChanges { target: logsContainer; height: 500; visible: true } + PropertyChanges { target: logsShadow; height: 500; visible: true } PropertyChanges { target: outsideClick; active: true } }, @@ -313,6 +343,7 @@ Rectangle { PropertyChanges { target: logsContainer; height: 0; visible: false } PropertyChanges { target: statusContainer; width: 600; height: 30 } PropertyChanges { target: outsideClick; active: false } + PropertyChanges { target: logsShadow; height: 0; visible: false } } ] transitions: Transition { diff --git a/mix/qml/TransactionDialog.qml b/mix/qml/TransactionDialog.qml index 2c36bf2ea..ed76d48eb 100644 --- a/mix/qml/TransactionDialog.qml +++ b/mix/qml/TransactionDialog.qml @@ -400,7 +400,6 @@ Dialog { Button { text: qsTr("Cancel"); onClicked: close(); - Layout.fillWidth: true } } } diff --git a/mix/qml/TransactionLog.qml b/mix/qml/TransactionLog.qml index ca8b37098..86f8b2a74 100644 --- a/mix/qml/TransactionLog.qml +++ b/mix/qml/TransactionLog.qml @@ -52,7 +52,7 @@ Item { { id: statesCombo items: projectModel.stateListModel - onSelectCreate: projectModel.stateListModel.addState(); + onSelectCreate: projectModel.stateListModel.addState() onEditItem: projectModel.stateListModel.editState(item) colorItem: "#808080" colorSelect: "#4a90e2" @@ -63,8 +63,16 @@ Item { if (statesCombo.selectedIndex !== index) statesCombo.setSelectedIndex(index) } + onStateListModelReady: { + statesCombo.setSelectedIndex(projectModel.stateListModel.defaultStateIndex) + } + onStateDeleted: { + if (index === statesCombo.selectedIndex) + statesCombo.setSelectedIndex(0); + } } } + Button { anchors.rightMargin: 9