From: Ruediger Gad Date: Sat, 14 Apr 2012 23:19:37 +0000 (+0200) Subject: Refine UI of MainPage. X-Git-Url: https://vcs.maemo.org/git/?p=qzeecontrol;a=commitdiff_plain;h=970ab48216813983d195863aec8270c479ede2f9 Refine UI of MainPage. --- diff --git a/QZeeControl.pro.user b/QZeeControl.pro.user index 6f471b0..2be7fa8 100644 --- a/QZeeControl.pro.user +++ b/QZeeControl.pro.user @@ -1,6 +1,6 @@ - + ProjectExplorer.Project.ActiveTarget diff --git a/qml/QZeeControl/MainPage.qml b/qml/QZeeControl/MainPage.qml index 8a7f8c9..03f55c8 100644 --- a/qml/QZeeControl/MainPage.qml +++ b/qml/QZeeControl/MainPage.qml @@ -88,8 +88,61 @@ Page { target: labelD color: "blue" } + }, + State { + name: "connecting" + PropertyChanges { + target: scanButton + enabled: false + } + PropertyChanges { + target: addressField + enabled: false + } + PropertyChanges { + target: portField + enabled: false + } + PropertyChanges { + target: connectButton + enabled: false + } + PropertyChanges { + target: disconnectButton + enabled: false + } + PropertyChanges { + target: infoText + text: "Connecting..." + } + }, + State { + name: "disconnected" + PropertyChanges { + target: scanButton + enabled: true + } + PropertyChanges { + target: addressField + enabled: true + } + PropertyChanges { + target: portField + enabled: true + } + PropertyChanges { + target: connectButton + enabled: true + } + PropertyChanges { + target: disconnectButton + enabled: false + } + PropertyChanges { + target: infoText + text: "Press \"Connect\" to connect to the device." + } } - ] Connections { @@ -105,15 +158,16 @@ Page { } Item { - anchors.fill: parent + id: headerItem + anchors{top: parent.top; left: parent.left; right: parent.right} + height: header.height + z: 1 Image { id: header height: 72 source: "image://theme/color8-meegotouch-view-header-fixed" - anchors.left: parent.left - anchors.top: parent.top - anchors.right: parent.right + anchors.fill: parent Text { text: "QZeeControl" @@ -125,134 +179,150 @@ Page { anchors.verticalCenter: parent.verticalCenter } } + } - Button{ - id: scanButton - anchors{bottom: addressRow.top; bottomMargin: 10; horizontalCenter: parent.horizontalCenter} - enabled: true + Flickable { + anchors{top: headerItem.bottom; bottom: parent.bottom; left: parent.left; right: parent.right} + contentHeight: contentColumn.height - text: "Scan" + Column{ + id: contentColumn + spacing: 10 + anchors{top: parent.top; left: parent.left; right: parent.right; topMargin: 10} - onClicked: { - btDiscovery.discovery = true - } - } + Button{ + id: scanButton + enabled: true - Row{ - id: addressRow - spacing: 5 - anchors{bottom: infoText.top; bottomMargin: 10; horizontalCenter: parent.horizontalCenter} + anchors.horizontalCenter: parent.horizontalCenter + text: "Scan" - TextField{ - id: addressField - text: "No device found yet." - - onTextChanged: { - if(text === "No device found yet.") - return - - connectButton.enabled = true - infoText.text = "Press \"Connect\" to connect to the device." - console.log("Storing address in DB: " + text) - SettingsStorage.setSetting("address", text) + onClicked: { + btDiscovery.discovery = true } } - TextField{ - id: portField - text: "na" - width: 60 - validator: IntValidator{} - onTextChanged: { - if(text === "na") - return + Row{ + id: addressRow + anchors.horizontalCenter: parent.horizontalCenter + spacing: 5 + + TextField{ + id: addressField + text: "No device found yet." - console.log("Storing port in DB: " + text) - SettingsStorage.setSetting("port", text) + onTextChanged: { + if(text === "No device found yet.") + return + + connectButton.enabled = true + infoText.text = "Press \"Connect\" to connect to the device." + console.log("Storing address in DB: " + text) + SettingsStorage.setSetting("address", text) + } + } + TextField{ + id: portField + text: "na" + width: 60 + validator: IntValidator{} + + onTextChanged: { + if(text === "na") + return + + console.log("Storing port in DB: " + text) + SettingsStorage.setSetting("port", text) + } } } - } - Label { - id: infoText - anchors{bottom: connectButton.top; bottomMargin: 10; horizontalCenter: parent.horizontalCenter} - width: parent.width + Label { + id: infoText + width: parent.width - text: "Please scan for a device first." - horizontalAlignment: Text.AlignHCenter - wrapMode: Text.WordWrap - } + text: "Please scan for a device first." + horizontalAlignment: Text.AlignHCenter + wrapMode: Text.WordWrap + } - Button{ - id: connectButton - anchors{bottom: disconnectButton.top; bottomMargin: 10; horizontalCenter: parent.horizontalCenter} - enabled: false + Button{ + id: connectButton + anchors.horizontalCenter: parent.horizontalCenter + enabled: false - text: "Connect" + text: "Connect" - onClicked: { - enabled = false - btConn.connect(addressField.text, parseInt(portField.text)) + onClicked: { + mainPage.state = "connecting" + btConn.connect(addressField.text, parseInt(portField.text)) + } } - } - Button{ - id: disconnectButton - anchors.centerIn: parent + Button{ + id: disconnectButton + anchors.horizontalCenter: parent.horizontalCenter - text: "Disconnect" + text: "Disconnect" - onClicked: { - btConn.disconnect() + onClicked: { + btConn.disconnect() + } } - } - Row{ - id: buttonRow - anchors{top: disconnectButton.bottom; bottomMargin: 10; horizontalCenter: parent.horizontalCenter} + Row{ + id: buttonRow + anchors.horizontalCenter: parent.horizontalCenter - spacing: 20 + spacing: 20 - Label{ - id: labelA - text: "A" - color: btConn.a ? "red" : "blue" - } - Label{ - id: labelB - text: "B" - color: btConn.b ? "red" : "blue" - } - Label{ - id: labelC - text: "C" - color: btConn.c ? "red" : "blue" - } - Label{ - id: labelD - text: "D" - color: btConn.d ? "red" : "blue" + Label{ + id: labelA + text: "A" + color: btConn.a ? "red" : "blue" + } + Label{ + id: labelB + text: "B" + color: btConn.b ? "red" : "blue" + } + Label{ + id: labelC + text: "C" + color: btConn.c ? "red" : "blue" + } + Label{ + id: labelD + text: "D" + color: btConn.d ? "red" : "blue" + } } - } - Rectangle{ - id: moveArea - anchors{top: buttonRow.bottom; topMargin: 10; horizontalCenter: parent.horizontalCenter} - color: "gray" + Item{ + id: testArea + anchors.horizontalCenter: parent.horizontalCenter + height: moveArea.height + width: moveArea.width - width: 256 - height: 256 - } + Rectangle{ + id: moveArea + color: "gray" + + width: 256 + height: 256 + } - Rectangle{ - id: cursorRectangle - width: 10 - height: 10 - color: "red" + Rectangle{ + id: cursorRectangle + width: 10 + height: 10 + color: "red" - x: moveArea.x + (moveArea.width * 0.5) + btConn.x - (cursorRectangle.width * 0.5) - y: moveArea.y + (moveArea.height * 0.5) + btConn.y - (cursorRectangle.height * 0.5) + x: moveArea.x + (moveArea.width * 0.5) + btConn.x - (cursorRectangle.width * 0.5) + y: moveArea.y + (moveArea.height * 0.5) + btConn.y - (cursorRectangle.height * 0.5) + } + } } } @@ -268,12 +338,18 @@ Page { scanButton.enabled = false connectButton.enabled = false disconnectButton.enabled = false + addressField.enabled = false + portField.enabled = false }else{ scanButton.enabled = true disconnectButton.enabled = false + addressField.enabled = true + portField.enabled = true - if(addressField.text !== "No device found yet." && portField.text !== "na") + if(addressField.text !== "No device found yet." && portField.text !== "na"){ + infoText.text = "Device found. You can now connect." connectButton.enabled = true + } } } @@ -299,9 +375,7 @@ Page { } onDisconnected: { - connectButton.enabled = true - disconnectButton.enabled = false - infoText.text = "Press \"Connect\" to connect to the device." + mainPage.state = "disconnected" } // onStickMoved: {