From 27946480cd06ae83f93a6f30b438bcfb2cec261c Mon Sep 17 00:00:00 2001 From: Felix Hammer Date: Mon, 17 Aug 2015 14:51:30 +0200 Subject: [PATCH] New Blinds Raise Interval Selector Component for ListViews Outsourced Styles for RadioButton and TextField --- .../MyBlindsRaiseIntervalSelector.qml | 223 ++++++++++++++++++ src/gui/qml/components/MyTextFieldStyle.qml | 46 ++++ .../components/styles/MyRadioButtonStyle.qml | 32 +++ .../components/styles/MyTextFieldStyle.qml | 7 + src/gui/qml/cpp/createlocalgameviewimpl.cpp | 7 + src/gui/qml/cpp/createlocalgameviewimpl.h | 16 ++ src/gui/qml/cpp/startviewimpl.cpp | 7 + src/gui/qml/cpp/startviewimpl.h | 16 ++ .../qml/views/gametableview/GameTableView.qml | 7 + 9 files changed, 361 insertions(+) create mode 100644 src/gui/qml/components/MyBlindsRaiseIntervalSelector.qml create mode 100644 src/gui/qml/components/MyTextFieldStyle.qml create mode 100644 src/gui/qml/components/styles/MyRadioButtonStyle.qml create mode 100644 src/gui/qml/components/styles/MyTextFieldStyle.qml create mode 100644 src/gui/qml/cpp/createlocalgameviewimpl.cpp create mode 100644 src/gui/qml/cpp/createlocalgameviewimpl.h create mode 100644 src/gui/qml/cpp/startviewimpl.cpp create mode 100644 src/gui/qml/cpp/startviewimpl.h create mode 100644 src/gui/qml/views/gametableview/GameTableView.qml diff --git a/src/gui/qml/components/MyBlindsRaiseIntervalSelector.qml b/src/gui/qml/components/MyBlindsRaiseIntervalSelector.qml new file mode 100644 index 00000000..efb3fd55 --- /dev/null +++ b/src/gui/qml/components/MyBlindsRaiseIntervalSelector.qml @@ -0,0 +1,223 @@ +import QtQuick 2.0 +import QtQuick.Layouts 1.1 +import QtQuick.Controls 1.2 +import QtQuick.Controls.Styles 1.2 +import "../js/colors.js" as GlobalColors + +Rectangle { + id: selector + z:1000 + visible: false + anchors.fill: parent + color: "#88000000" //dark transparent background + + property string titleString + property string prefix + property int minValue + property int maxValue + property string returnValue + property int initialTextFieldValue + property int initialSliderValue + + function show(title, min, max, value, pref) { + titleString = title; + initialTextFieldValue = parseInt(value); + initialSliderValue = parseInt(value) + minValue = min; + maxValue = max; + prefix = pref; + returnValue = value; // <-- initial the returnValue with the preselection to prevent a NULL return when pressing Cancel + visible = true; + } + + function reject() { + visible = false; + } + + function selected(newSelection) { + returnValue = newSelection; + visible = false; + } + + MouseArea { + //set empty MouseArea to prevent the background to be clicked + anchors.fill: parent + } + + Rectangle { + id: selectionBox + visible: true + color: "white" + height: Math.round(parent.height*0.9) + width: Math.round(parent.width*0.6) + x: Math.round(parent.width*0.5 - width*0.5) + y: Math.round(parent.height*0.5 - height*0.5) + radius: Math.round(parent.height*0.01) + + ColumnLayout { + id: content + anchors.fill: parent + spacing: Math.round(selectionBox.height*0.06) + Text { + id: titleText + font.pixelSize: Math.round(selectionBox.height*0.10) + font.bold: true + text: titleString + anchors.left: parent.left + anchors.top: parent.top + anchors.leftMargin: 30 + anchors.topMargin: 10 + Layout.preferredHeight: contentHeight + } + TextField{ + id: textField + anchors.left: parent.left + anchors.right: parent.right + anchors.rightMargin: 50 + //make space for the prefix + property int prefixIndent: Math.round(selectionBox.height*0.03) + anchors.leftMargin: 50 + prefixIndent +// validator: IntValidator{bottom: minValue; top: maxValue;} TODO: test validator in later QtVersions > 5.5.0 + focus: true + text: initialTextFieldValue + function correctValue() { + if(text > maxValue) text = maxValue + else if(text < minValue) text = minValue + else { + //remove leading "0000" + var temp = parseInt(text) + text = temp + } + } + onFocusChanged: correctValue() + onEditingFinished: correctValue() + + style: TextFieldStyle { + textColor: "black" + font.pixelSize: Math.round(selectionBox.height*0.10) + background: Item { //bottom line with colored focus indicator + implicitHeight: Math.round(selectionBox.height*0.12) + implicitWidth: parent.width + Text { //prefix + color: "black" + font.pixelSize: Math.round(selectionBox.height*0.10) + text: prefix + anchors.left: parent.left + anchors.leftMargin: -textField.prefixIndent + anchors.bottom: parent.bottom + anchors.bottomMargin: Math.round(selectionBox.height*0.008) + + } + Rectangle { + color: GlobalColors.accentColor + opacity: textField.activeFocus ? 0.8 : 0 + anchors.bottom: parent.bottom + anchors.left: parent.left + anchors.leftMargin: -textField.prefixIndent + width: parent.width + textField.prefixIndent + height: Math.round(selectionBox.height*0.005) + } + Rectangle { + color: "black" + opacity: textField.activeFocus ? 0.6 : 0.4 + anchors.bottom: parent.bottom + anchors.bottomMargin: Math.round(selectionBox.height*0.005) + anchors.left: parent.left + anchors.leftMargin: - textField.prefixIndent + width: parent.width + textField.prefixIndent + height: Math.round(selectionBox.height*0.005) + } + } + } + } + Slider { + id: slider + width: parent.width + anchors.left: parent.left + anchors.right: parent.right + anchors.rightMargin: 50 + anchors.leftMargin: 50 + maximumValue: maxValue + minimumValue: minValue + //don't initialize the slider value to avoid the stepSize kills the preselection Value + //because of the binding to the TextField value + stepSize: minimumValue * 10 + on__HandlePosChanged: { + if (slider.value > minimumValue && slider.value < maximumValue) + textField.text = slider.value - minimumValue + else + textField.text = slider.value + } + style: SliderStyle { + handle: Rectangle { + width: Math.round(selectionBox.height*0.12) + height: width + radius: width + antialiasing: true + color: Qt.lighter(GlobalColors.accentColor, 1.2) + } + groove: Item { + implicitHeight: Math.round(selectionBox.height*0.04) + implicitWidth: slider.width + Rectangle { + height: Math.round(selectionBox.height*0.03) + width: slider.width + anchors.verticalCenter: parent.verticalCenter + color: "#666" + Rectangle { + antialiasing: true + radius: 1 + color: GlobalColors.accentColor + height: parent.height + width: parent.width * control.value / control.maximumValue + } + } + } + } + + } + + RowLayout { //bottom button line + width: parent.width + anchors.right: parent.right + anchors.bottom: parent.bottom + anchors.rightMargin: 30 + anchors.bottomMargin: 20 + spacing: okButton.contentWidth + Layout.preferredHeight: cancelButton.contentHeight + + Text { + id: cancelButton + font.pixelSize: Math.round(selectionBox.height*0.07) + font.bold: true + text: qsTr("CANCEL") + Layout.preferredHeight: contentHeight + MouseArea { + id: cancelMouse + anchors.fill: parent + onClicked: { + reject() + } + } + } + Text { + id: okButton + font.pixelSize: Math.round(selectionBox.height*0.07) + font.bold: true + color: GlobalColors.accentColor + text: qsTr("OK") + Layout.preferredHeight: contentHeight + MouseArea { + id: okMouse + anchors.fill: parent + onClicked: { + textField.correctValue(); + selected(textField.text); + } + } + } + } + } + } +} + diff --git a/src/gui/qml/components/MyTextFieldStyle.qml b/src/gui/qml/components/MyTextFieldStyle.qml new file mode 100644 index 00000000..3a5cf819 --- /dev/null +++ b/src/gui/qml/components/MyTextFieldStyle.qml @@ -0,0 +1,46 @@ +import QtQuick 2.4 +import QtQuick.Controls.Styles 1.2 +Component { + id: myTextFieldStyle + property string prefix: "" + property int prefixIndent: Math.round(appWindow.height*0.03) + + TextFieldStyle { + textColor: "black" + font.pixelSize: Math.round(appWindow.height*0.10) + background: Item { //bottom line with colored focus indicator + implicitHeight: Math.round(appWindow.height*0.12) + implicitWidth: parent.width + Text { //prefix + visible: prefix != "" ? true : false + color: "black" + font.pixelSize: Math.round(appWindow.height*0.10) + text: prefix + anchors.left: parent.left + anchors.leftMargin: -prefixIndent + anchors.bottom: parent.bottom + anchors.bottomMargin: Math.round(appWindow.height*0.008) + + } + Rectangle { + color: GlobalColors.accentColor + opacity: parent.activeFocus ? 0.8 : 0 + anchors.bottom: parent.bottom + anchors.left: parent.left + anchors.leftMargin: prefixIndent + width: parent.width + prefixIndent + height: Math.round(appWindow.height*0.005) + } + Rectangle { + color: "black" + opacity: parent.activeFocus ? 0.6 : 0.4 + anchors.bottom: parent.bottom + anchors.bottomMargin: Math.round(appWindow.height*0.005) + anchors.left: parent.left + anchors.leftMargin: - prefixIndent + width: parent.width + prefixIndent + height: Math.round(appWindow.height*0.005) + } + } + } +} diff --git a/src/gui/qml/components/styles/MyRadioButtonStyle.qml b/src/gui/qml/components/styles/MyRadioButtonStyle.qml new file mode 100644 index 00000000..40870cfc --- /dev/null +++ b/src/gui/qml/components/styles/MyRadioButtonStyle.qml @@ -0,0 +1,32 @@ +import QtQuick 2.4 +import QtQuick.Controls.Styles 1.2 +import "../../js/colors.js" as GlobalColors + +RadioButtonStyle { + property var myRadioBtn + indicator: Rectangle { + implicitWidth: Math.round(appWindow.height*0.05) + implicitHeight: Math.round(appWindow.height*0.05) + radius: Math.round(selectionBox.height*0.03) + border.color: myRadioBtn.checked ? GlobalColors.accentColor : "grey" + border.width: Math.round(appWindow.height*0.005) + Rectangle { + anchors.fill: parent + visible: control.checked + color: myRadioBtn.checked ? GlobalColors.accentColor : "grey" + radius: Math.round(appWindow.height*0.03) + anchors.margins: Math.round(appWindow.height*0.01) + } + } + label: Text { + anchors.left: parent.left + anchors.leftMargin: 10 + font.pixelSize: Math.round(appWindow.height*0.05) + text: valueString + + MouseArea { + anchors.fill: parent + onClicked: radioBtn.clicked() + } + } +} diff --git a/src/gui/qml/components/styles/MyTextFieldStyle.qml b/src/gui/qml/components/styles/MyTextFieldStyle.qml new file mode 100644 index 00000000..02cf5cb5 --- /dev/null +++ b/src/gui/qml/components/styles/MyTextFieldStyle.qml @@ -0,0 +1,7 @@ +import QtQuick 2.0 + +Rectangle { + width: 100 + height: 62 +} + diff --git a/src/gui/qml/cpp/createlocalgameviewimpl.cpp b/src/gui/qml/cpp/createlocalgameviewimpl.cpp new file mode 100644 index 00000000..db1c5b40 --- /dev/null +++ b/src/gui/qml/cpp/createlocalgameviewimpl.cpp @@ -0,0 +1,7 @@ +#include "createlocalgameimpl.h" + +CreateLocalGameImpl::CreateLocalGameImpl(QObject *parent) : QObject(parent) +{ + +} + diff --git a/src/gui/qml/cpp/createlocalgameviewimpl.h b/src/gui/qml/cpp/createlocalgameviewimpl.h new file mode 100644 index 00000000..3402aee7 --- /dev/null +++ b/src/gui/qml/cpp/createlocalgameviewimpl.h @@ -0,0 +1,16 @@ +#ifndef CREATELOCALGAMEIMPL_H +#define CREATELOCALGAMEIMPL_H + + +class CreateLocalGameImpl : public QObject +{ + Q_OBJECT +public: + explicit CreateLocalGameImpl(QObject *parent = 0); + +signals: + +public slots: +}; + +#endif // CREATELOCALGAMEIMPL_H diff --git a/src/gui/qml/cpp/startviewimpl.cpp b/src/gui/qml/cpp/startviewimpl.cpp new file mode 100644 index 00000000..bc9dff0a --- /dev/null +++ b/src/gui/qml/cpp/startviewimpl.cpp @@ -0,0 +1,7 @@ +#include "startimpl.h" + +StartImpl::StartImpl(QObject *parent) : QObject(parent) +{ + +} + diff --git a/src/gui/qml/cpp/startviewimpl.h b/src/gui/qml/cpp/startviewimpl.h new file mode 100644 index 00000000..4dd59a1b --- /dev/null +++ b/src/gui/qml/cpp/startviewimpl.h @@ -0,0 +1,16 @@ +#ifndef STARTIMPL_H +#define STARTIMPL_H + + +class StartImpl : public QObject +{ + Q_OBJECT +public: + explicit StartImpl(QObject *parent = 0); + +signals: + +public slots: +}; + +#endif // STARTIMPL_H diff --git a/src/gui/qml/views/gametableview/GameTableView.qml b/src/gui/qml/views/gametableview/GameTableView.qml new file mode 100644 index 00000000..02cf5cb5 --- /dev/null +++ b/src/gui/qml/views/gametableview/GameTableView.qml @@ -0,0 +1,7 @@ +import QtQuick 2.0 + +Rectangle { + width: 100 + height: 62 +} +