From 7fded5040f56b8def7a93fcce03f93f06bcc6bc4 Mon Sep 17 00:00:00 2001 From: Shawn Rutledge Date: Mon, 11 Mar 2013 11:42:00 +0100 Subject: Cosmetic changes in DefaultFileDialog and dialog shared controls Implementation of the button for QML-based dialogs matches the one for QML examples. The button and the text field use system palette colors, as does the file dialog. Change-Id: Ibf45d57bdab8799ae6aa69ba543c0e05c55b01d3 Reviewed-by: Jens Bache-Wiig --- src/imports/dialogs/DefaultFileDialog.qml | 19 ++++----- src/imports/dialogs/dialogs.pro | 2 - src/imports/dialogs/images/titlebar.png | Bin 1436 -> 0 bytes src/imports/dialogs/images/titlebar.sci | 5 --- src/imports/dialogs/qml/Button.qml | 64 +++++++++++++++--------------- src/imports/dialogs/qml/TextField.qml | 11 +---- 6 files changed, 40 insertions(+), 61 deletions(-) delete mode 100644 src/imports/dialogs/images/titlebar.png delete mode 100644 src/imports/dialogs/images/titlebar.sci diff --git a/src/imports/dialogs/DefaultFileDialog.qml b/src/imports/dialogs/DefaultFileDialog.qml index 9e05ace7b5..5542e59cb5 100644 --- a/src/imports/dialogs/DefaultFileDialog.qml +++ b/src/imports/dialogs/DefaultFileDialog.qml @@ -213,7 +213,7 @@ AbstractFileDialog { delegate: folderDelegate highlight: Rectangle { color: "transparent" - border.color: palette.midlight + border.color: Qt.darker(palette.window, 1.3) } highlightMoveDuration: 0 highlightMoveVelocity: -1 @@ -257,11 +257,10 @@ AbstractFileDialog { id: titleBar width: parent.width height: currentPathField.height * 1.5 - BorderImage { - source: "images/titlebar.sci" + Rectangle { anchors.fill: parent - anchors.topMargin: -7 - anchors.bottomMargin: -7 + color: Qt.darker(palette.window, 1.1) + border.color: Qt.darker(palette.window, 1.3) } Rectangle { id: upButton @@ -291,7 +290,7 @@ AbstractFileDialog { anchors.left: parent.left; anchors.right: parent.right; anchors.verticalCenter: parent.verticalCenter anchors.leftMargin: textX; anchors.rightMargin: 4 text: root.urlToPath(view.model.folder) - color: "white" + color: palette.text elide: Text.ElideLeft; horizontalAlignment: Text.AlignRight; verticalAlignment: Text.AlignVCenter MouseArea { anchors.fill: parent @@ -320,12 +319,8 @@ AbstractFileDialog { width: parent.width height: buttonRow.height + buttonRow.spacing * 2 anchors.bottom: parent.bottom - gradient: Gradient { - GradientStop { position: 0.0; color: palette.dark } - GradientStop { position: 0.3; color: palette.mid } - GradientStop { position: 0.85; color: palette.mid } - GradientStop { position: 1.0; color: palette.light } - } + color: Qt.darker(palette.window, 1.1) + border.color: Qt.darker(palette.window, 1.3) Row { id: buttonRow diff --git a/src/imports/dialogs/dialogs.pro b/src/imports/dialogs/dialogs.pro index 784517f73e..ec425c1b4f 100644 --- a/src/imports/dialogs/dialogs.pro +++ b/src/imports/dialogs/dialogs.pro @@ -23,8 +23,6 @@ QML_FILES += \ qml/TextField.qml \ qml/qmldir \ images/folder.png \ - images/titlebar.png \ - images/titlebar.sci \ images/up.png QT += quick-private gui-private core-private diff --git a/src/imports/dialogs/images/titlebar.png b/src/imports/dialogs/images/titlebar.png deleted file mode 100644 index 51c90082d0..0000000000 Binary files a/src/imports/dialogs/images/titlebar.png and /dev/null differ diff --git a/src/imports/dialogs/images/titlebar.sci b/src/imports/dialogs/images/titlebar.sci deleted file mode 100644 index 0418d94cd6..0000000000 --- a/src/imports/dialogs/images/titlebar.sci +++ /dev/null @@ -1,5 +0,0 @@ -border.left: 10 -border.top: 12 -border.bottom: 12 -border.right: 10 -source: titlebar.png diff --git a/src/imports/dialogs/qml/Button.qml b/src/imports/dialogs/qml/Button.qml index 936c72c876..491dc2e251 100644 --- a/src/imports/dialogs/qml/Button.qml +++ b/src/imports/dialogs/qml/Button.qml @@ -41,49 +41,47 @@ import QtQuick 2.1 Item { - height: label.implicitHeight * 2 - width: Math.max(label.implicitWidth * 1.2, height * 2.5); - anchors.verticalCenter: parent.verticalCenter - property alias text: label.text - property string tooltip + id: container + + property alias text: buttonLabel.text + property alias label: buttonLabel signal clicked + property alias containsMouse: mouseArea.containsMouse + property alias pressed: mouseArea.pressed + implicitHeight: buttonLabel.implicitHeight + implicitWidth: buttonLabel.implicitWidth + height: buttonLabel.implicitHeight + 12 + width: Math.max(80, implicitWidth + 8) + SystemPalette { id: palette } + Rectangle { - antialiasing: true - border.color: mouseArea.pressed ? palette.highlight : palette.light - color: "transparent" - anchors.fill: parent - anchors.rightMargin: 1 - anchors.bottomMargin: 1 - radius: 3 - } - Rectangle { - border.color: palette.dark + id: frame anchors.fill: parent - anchors.leftMargin: 1 - anchors.topMargin: 1 - radius: 3 - } - Rectangle { + color: palette.button gradient: Gradient { - GradientStop { position: 0.0; color: mouseArea.pressed ? palette.dark : palette.light } - GradientStop { position: 0.2; color: palette.button } - GradientStop { position: 0.8; color: palette.button } - GradientStop { position: 1.0; color: mouseArea.pressed ? palette.light : palette.dark } + GradientStop { position: 0.0; color: mouseArea.pressed ? Qt.darker(palette.button, 1.3) : palette.button } + GradientStop { position: 1.0; color: Qt.darker(palette.button, 1.3) } } - anchors.fill: parent - anchors.margins: 1 - radius: 3 - } - Text { - id: label - anchors.centerIn: parent - color: palette.buttonText + antialiasing: true + radius: 5 + border.color: Qt.darker(palette.button, 1.5) + border.width: 1 } MouseArea { id: mouseArea anchors.fill: parent - onClicked: parent.clicked() + onClicked: container.clicked() + hoverEnabled: true + } + + Text { + id: buttonLabel + width: parent.width + horizontalAlignment: Text.Center + text: container.text + color: palette.buttonText + anchors.verticalCenter: parent.verticalCenter } } diff --git a/src/imports/dialogs/qml/TextField.qml b/src/imports/dialogs/qml/TextField.qml index da93239fd5..89487e82ca 100644 --- a/src/imports/dialogs/qml/TextField.qml +++ b/src/imports/dialogs/qml/TextField.qml @@ -53,16 +53,9 @@ Item { Rectangle { id: rect anchors.fill: parent - anchors.leftMargin: -radius - border.color: palette.light radius: height / 4 - antialiasing: true - gradient: Gradient { - GradientStop { position: 0.0; color: palette.dark } - GradientStop { position: 0.2; color: palette.button } - GradientStop { position: 0.8; color: palette.button } - GradientStop { position: 1.0; color: palette.light } - } + color: palette.button + border.color: Qt.darker(palette.button, 1.5) } TextInput { -- cgit v1.2.3