diff options
author | Maurice Kalinowski <maurice.kalinowski@qt.io> | 2018-12-10 15:15:02 +0100 |
---|---|---|
committer | Maurice Kalinowski <maurice.kalinowski@qt.io> | 2018-12-12 06:11:45 +0000 |
commit | 6a7eed0a048c25134b441fb52dcfe1eff627d9b0 (patch) | |
tree | 3e101c8cf1c1b2f9d5b6a1671797237cb1399b59 | |
parent | 993437193f12f423dbb18434243796750b11db7c (diff) |
Examples: Visual clean up
The UI needed some minimal overhaul to be more consistent. Adapt the
layouts.
Change-Id: I7e3fdf38faca2264c768fd188bb381a78f6cf4d3
Fixes: QTBUG-64014
Reviewed-by: Alex Blasche <alexander.blasche@qt.io>
-rw-r--r-- | examples/mqtt/quickpublication/main.qml | 25 | ||||
-rw-r--r-- | examples/mqtt/quicksubscription/main.qml | 17 |
2 files changed, 29 insertions, 13 deletions
diff --git a/examples/mqtt/quickpublication/main.qml b/examples/mqtt/quickpublication/main.qml index b018e68..dea9613 100644 --- a/examples/mqtt/quickpublication/main.qml +++ b/examples/mqtt/quickpublication/main.qml @@ -81,6 +81,7 @@ Window { GridLayout { anchors.fill: parent + anchors.margins: 10 columns: 2 Label { @@ -113,19 +114,22 @@ Window { Button { id: connectButton Layout.columnSpan: 2 + Layout.fillWidth: true text: client.state === MqttClient.Connected ? "Disconnect" : "Connect" onClicked: { - if (client.state === MqttClient.Connected) + if (client.state === MqttClient.Connected) { client.disconnectFromHost() - else + messageModel.clear() + } else client.connectToHost() } } - RowLayout { + GridLayout { enabled: client.state === MqttClient.Connected Layout.columnSpan: 2 Layout.fillWidth: true + columns: 4 Label { text: "Topic:" @@ -133,6 +137,7 @@ Window { TextField { id: pubField + Layout.fillWidth: true placeholderText: "<Publication topic>" } @@ -142,14 +147,9 @@ Window { TextField { id: msgField + Layout.fillWidth: true placeholderText: "<Publication message>" } - } - - RowLayout { - enabled: client.state === MqttClient.Connected - Layout.columnSpan: 2 - Layout.fillWidth: true Label { text: "QoS:" @@ -157,6 +157,7 @@ Window { ComboBox { id: qosItems + Layout.fillWidth: true editable: false model: [0, 1, 2] } @@ -169,6 +170,7 @@ Window { Button { id: pubButton + Layout.fillWidth: true text: "Publish" onClicked: { if (pubField.text.length === 0) { @@ -187,8 +189,11 @@ Window { height: 300 width: 200 Layout.fillHeight: true + Layout.fillWidth: true + Layout.columnSpan: 2 + clip: true delegate: Rectangle { - width: 150 + width: messageView.width height: 30 color: index % 2 ? "#DDDDDD" : "#888888" radius: 5 diff --git a/examples/mqtt/quicksubscription/main.qml b/examples/mqtt/quicksubscription/main.qml index 7b930e2..4558c7e 100644 --- a/examples/mqtt/quicksubscription/main.qml +++ b/examples/mqtt/quicksubscription/main.qml @@ -83,6 +83,7 @@ Window { GridLayout { anchors.fill: parent + anchors.margins: 10 columns: 2 Label { @@ -115,11 +116,15 @@ Window { Button { id: connectButton Layout.columnSpan: 2 + Layout.fillWidth: true text: client.state === MqttClient.Connected ? "Disconnect" : "Connect" onClicked: { - if (client.state === MqttClient.Connected) + if (client.state === MqttClient.Connected) { client.disconnectFromHost() - else + messageModel.clear() + tempSubscription.destroy() + tempSubscription = 0 + } else client.connectToHost() } } @@ -136,11 +141,14 @@ Window { TextField { id: subField placeholderText: "<Subscription topic>" + Layout.fillWidth: true + enabled: tempSubscription === 0 } Button { id: subButton text: "Subscribe" + visible: tempSubscription === 0 onClicked: { if (subField.text.length === 0) { console.log("No topic specified to subscribe to.") @@ -157,9 +165,12 @@ Window { model: messageModel height: 300 width: 200 + Layout.columnSpan: 2 Layout.fillHeight: true + Layout.fillWidth: true + clip: true delegate: Rectangle { - width: 150 + width: messageView.width height: 30 color: index % 2 ? "#DDDDDD" : "#888888" radius: 5 |