diff options
author | Gatis Paeglis <gatis.paeglis@digia.com> | 2014-02-14 14:16:56 +0100 |
---|---|---|
committer | Gatis Paeglis <gatis.paeglis@digia.com> | 2014-02-19 16:39:18 +0200 |
commit | 7c9a7efac837e5f34d9bdb46b10422920bf99103 (patch) | |
tree | 47199a2df9cfabdfe78a6d068804565ad23ea925 /basicsuite/launchersettings/main.qml | |
parent | 9c7b85a73bfea7b92729ad9317b8f7a708412f4f (diff) |
[launcher settings] improve visual appearance
and fix the UI shrinking issue when vkb is visible.
Change-Id: I8609dbc4a852b04e3ed9f3fbd3eb1175f3576f5e
Reviewed-by: Andy Nichols <andy.nichols@digia.com>
Diffstat (limited to 'basicsuite/launchersettings/main.qml')
-rw-r--r-- | basicsuite/launchersettings/main.qml | 145 |
1 files changed, 103 insertions, 42 deletions
diff --git a/basicsuite/launchersettings/main.qml b/basicsuite/launchersettings/main.qml index 41054fd..0002076 100644 --- a/basicsuite/launchersettings/main.qml +++ b/basicsuite/launchersettings/main.qml @@ -1,4 +1,4 @@ -/**************************************************************************** +/**************************************************************************** ** ** Copyright (C) 2014 Digia Plc and/or its subsidiary(-ies). ** Contact: For any questions to Digia, please use the contact form at @@ -42,65 +42,114 @@ import QtQuick 2.0 import QtQuick.Controls 1.0 import QtQuick.Layouts 1.0 +import QtQuick.Controls.Styles 1.0 +import QtQuick.Controls.Private 1.0 Rectangle { id: root - - gradient: Gradient { - GradientStop { position: 0; color: "white" } - GradientStop { position: 1; color: "lightgray" } - } - width: 1280 height: 800 - + color: "#212126" property int margin: 10 - - Loader { - id: rebootActionLoader - source: "RebootAction.qml" - } - - Loader { - id: poweroffActionLoader - source: "PoweroffAction.qml" - } - - Loader { - id: brightnessControllerLoader - source: "BrightnessController.qml" + property alias buttonStyle: buttonStyle + + // ******************************* STYLES ********************************** + Component { + id: buttonStyle + ButtonStyle { + panel: Item { + implicitHeight: 50 + implicitWidth: 320 + BorderImage { + anchors.fill: parent + antialiasing: true + border.bottom: 8 + border.top: 8 + border.left: 8 + border.right: 8 + anchors.margins: control.pressed ? -4 : 0 + source: control.pressed ? "images/button_pressed.png" : "images/button_default.png" + Text { + text: control.text + anchors.centerIn: parent + color: "white" + font.pixelSize: 23 + renderType: Text.NativeRendering + } + } + } + } } - Loader { - id: networkControllerLoader - source: "NetworkController.qml" - } + // GroupBoxStyle currently is not available as a public API, so we write our own... + Component { + id: groupBoxStyle + Style { + // The margin from the content item to the groupbox + padding { + top: (control.title.length > 0 ? TextSingleton.implicitHeight : 0) + 30 + left: 8 + right: 8 + bottom: 8 + } + // The groupbox frame + property Component panel: Item { + anchors.fill: parent + + Text { + id: label + anchors.bottom: borderImage.top + anchors.margins: 2 + text: control.title + font.pixelSize: 22 + color: "white" + renderType: Text.NativeRendering + } - Loader { - id: wifiControllerLoader - source: "WifiController.qml" + BorderImage { + id: borderImage + anchors.fill: parent + anchors.topMargin: padding.top - 7 + source: "images/groupbox.png" + border.left: 4 + border.right: 4 + border.top: 4 + border.bottom: 4 + } + } + } } - ScrollView { + // ******************************** UI **************************************** + Loader { id: rebootActionLoader; source: "RebootAction.qml" } + Loader { id: poweroffActionLoader; source: "PoweroffAction.qml" } + Loader { id: brightnessControllerLoader; source: "BrightnessController.qml" } + Loader { id: networkControllerLoader; source: "NetworkController.qml" } + Loader { id: wifiControllerLoader; source: "WifiController.qml" } + Flickable { anchors.top: parent.top anchors.horizontalCenter: parent.horizontalCenter anchors.margins: margin anchors.topMargin: 50 height: parent.height - width: mainLayout.width + 40 + width: mainLayout.width + contentHeight: mainLayout.height + 100 + contentWidth: mainLayout.width + flickableDirection: Flickable.VerticalFlick ColumnLayout { id: mainLayout - - height: implicitHeight; - width: Math.min(root.width, root.height); + width: 800 + height: implicitHeight + anchors.left: parent.left + anchors.right: parent.right GroupBox { id: powerOptions title: "Power" - Layout.fillWidth: true + style: groupBoxStyle RowLayout { id: powerButtonRow @@ -108,13 +157,16 @@ Rectangle { anchors.fill: parent Button { + style: buttonStyle text: "Shut Down" Layout.fillWidth: true action: poweroffActionLoader.item; enabled: action != undefined + } Button { + style: buttonStyle text: "Reboot" Layout.fillWidth: true action: rebootActionLoader.item; @@ -127,7 +179,7 @@ Rectangle { GroupBox { id: displayOptions title: "Display" - + style: groupBoxStyle Layout.fillWidth: true GridLayout { @@ -137,8 +189,8 @@ Rectangle { flow: GridLayout.TopToBottom anchors.fill: parent - Label { text: "Brightness: "; } - Label { text: "Display FPS: "; } + Label { text: "Brightness: "; font.pixelSize: 18; color: "white" } + Label { text: "Display FPS: "; font.pixelSize: 18; color: "white" } Slider { maximumValue: 255 @@ -160,7 +212,7 @@ Rectangle { GroupBox { id: networkOptions title: "Network" - + style: groupBoxStyle Layout.fillWidth: true GridLayout { @@ -171,18 +223,26 @@ Rectangle { flow: GridLayout.TopToBottom anchors.fill: parent - Label { text: "Hostname: "; } - Label { text: "IP address: "; } + Label { text: "Hostname: "; font.pixelSize: 18; color: "white" } + Label { text: "IP address: "; font.pixelSize: 18; color: "white"} TextField { id: hostname + implicitHeight: hostnameButton.height - 8 text: if (networkControllerLoader.item != undefined) { networkControllerLoader.item.getHostname(); } + font.pixelSize: 18 Layout.fillWidth: true } - Label { text: if (networkControllerLoader.item != undefined) { networkControllerLoader.item.getIPAddress(); } } + Label { + text: if (networkControllerLoader.item != undefined) { networkControllerLoader.item.getIPAddress(); } + font.pixelSize: 18 + color: "white" + } Button { + id: hostnameButton + style: buttonStyle text: "Change hostname" onClicked: networkControllerLoader.item.setHostname(hostname.text); enabled: networkControllerLoader.item != undefined @@ -194,6 +254,7 @@ Rectangle { GroupBox { id: wifiOptions title: "Wifi" + style: groupBoxStyle Layout.fillWidth: true } |