New Blinds Raise Interval Selector Component for ListViews

Outsourced Styles for RadioButton and TextField
This commit is contained in:
Felix Hammer
2015-08-17 14:52:46 +02:00
parent 27946480cd
commit bb441b565c
20 changed files with 479 additions and 382 deletions
@@ -3,6 +3,7 @@ import QtQuick.Layouts 1.1
import QtQuick.Controls 1.2
import QtQuick.Controls.Styles 1.2
import "../js/colors.js" as GlobalColors
import "styles/"
Rectangle {
id: selector
@@ -11,22 +12,19 @@ Rectangle {
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
property string titleString: ""
property string raiseOnHandsType: ""
property string raiseOnHandsInterval: ""
property string raiseOnMinutesInterval: ""
property int raiseOnHandsMinimum: 1
property int raiseOnHandsMaximum: 99
property int raiseOnMinutesMinimum: 1
property int raiseOnMinutesMaximum: 99
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
function show(type, hands, minutes) {
raiseOnHandsType = type;
raiseOnHandsInterval = hands;
raiseOnMinutesInterval = minutes;
visible = true;
}
@@ -34,8 +32,10 @@ Rectangle {
visible = false;
}
function selected(newSelection) {
returnValue = newSelection;
function selected(handsType, handsInterval, minutesInterval) {
raiseOnHandsType = handsType;
raiseOnHandsInterval = handsInterval;
raiseOnMinutesInterval = minutesInterval;
visible = false;
}
@@ -54,165 +54,159 @@ Rectangle {
y: Math.round(parent.height*0.5 - height*0.5)
radius: Math.round(parent.height*0.01)
ColumnLayout {
id: content
Rectangle {
id: selectionBoxcontent
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()
anchors.margins: Math.round(appWindow.height*0.05)
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)
ColumnLayout {
id: content
anchors.fill: parent
spacing: appWindow.columnLayoutSpacing
Text {
id: titleText
font.pixelSize: appWindow.selectorTitleFontSize
font.bold: true
text: qsTr("Raise blinds")
anchors.left: parent.left
anchors.top: parent.top
anchors.topMargin: -Math.round(appWindow.height*0.035)
Layout.preferredHeight: contentHeight
}
ExclusiveGroup { id: raiseTypeGroup }
RowLayout { //Hands interval section
spacing: appWindow.rowLayoutSpacing
RadioButton {
id: radioBtnRaiseOnHands
checked: raiseOnHandsType ? true : false
exclusiveGroup: raiseTypeGroup
style: MyRadioButtonStyle {
myRadioBtn: radioBtnRaiseOnHands;
labelString: "Every"
}
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)
onCheckedChanged: checked ? textFieldHandsInterval.focus = true : textFieldHandsInterval.focus = false
}
TextField {
id: textFieldHandsInterval
width: appWindow.textFieldFontSize*2
// validator: IntValidator{bottom: minValue; top: maxValue;} TODO: test validator in later QtVersions > 5.5.0
text: raiseOnHandsInterval
focus: raiseOnHandsType ? true : false
function correctValue() {
if(text != "") {
if(parseInt(text) > raiseOnHandsMaximum) text = raiseOnHandsMaximum
else if(parseInt(text) < raiseOnHandsMinimum) text = raiseOnHandsMinimum
else {
//remove leading "0000"
var temp = parseInt(text)
text = temp
}
}
}
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)
onFocusChanged: {
correctValue()
focus ? radioBtnRaiseOnHands.checked = true : radioBtnRaiseOnHands.checked = false
}
onEditingFinished: correctValue()
style: MyTextFieldStyle {
myTextField: textFieldHandsInterval
}
}
}
}
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)
Text {
id: onHandsString
font.pixelSize: appWindow.selectorValueFontSize
text: qsTr("hands")
}
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 { //Minutes interval section
spacing: appWindow.rowLayoutSpacing
RadioButton {
id: radioBtnRaiseOnMinutes
checked: raiseOnHandsType ? false : true
exclusiveGroup: raiseTypeGroup
style: MyRadioButtonStyle {
myRadioBtn: radioBtnRaiseOnMinutes;
labelString: "Every"
}
onCheckedChanged: checked ? textFieldMinutesInterval.focus = true : textFieldMinutesInterval.focus = false
}
TextField {
id: textFieldMinutesInterval
// validator: IntValidator{bottom: minValue; top: maxValue;} TODO: test validator in later QtVersions > 5.5.0
text: raiseOnMinutesInterval
width: appWindow.textFieldFontSize*2
focus: raiseOnHandsType ? false : true
function correctValue() {
if(text != "") {
if(parseInt(text) > raiseOnMinutesMaximum) text = raiseOnMinutesMaximum
else if(parseInt(text) < raiseOnMinutesMinimum) text = raiseOnMinutesMinimum
else {
//remove leading "0000"
var temp = parseInt(text)
text = temp
}
}
}
onFocusChanged: {
correctValue();
focus ? radioBtnRaiseOnMinutes.checked = true : radioBtnRaiseOnMinutes.checked = false
}
onEditingFinished: correctValue()
style: MyTextFieldStyle {
myTextField: textFieldMinutesInterval
}
}
Text {
id: onMinutesString
font.pixelSize: appWindow.selectorValueFontSize
text: qsTr("minutes")
}
}
RowLayout { //bottom button line
width: parent.width
anchors.right: parent.right
anchors.bottom: parent.bottom
anchors.bottomMargin: -Math.round(appWindow.height*0.017)
spacing: okButton.contentWidth
Layout.preferredHeight: cancelButton.contentHeight
Text {
id: cancelButton
font.pixelSize: appWindow.selectorButtonFontSize
font.bold: true
text: qsTr("CANCEL")
Layout.preferredHeight: contentHeight
MouseArea {
id: cancelMouse
anchors.fill: parent
onClicked: {
reject()
}
}
}
}
}
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);
Text {
id: okButton
font.pixelSize: appWindow.selectorButtonFontSize
font.bold: true
color: GlobalColors.accentColor
text: qsTr("OK")
Layout.preferredHeight: contentHeight
MouseArea {
id: okMouse
anchors.fill: parent
onClicked: {
textFieldHandsInterval.correctValue();
textFieldMinutesInterval.correctValue();
//return values
selected(radioBtnRaiseOnHands.checked ? "1": "0", textFieldHandsInterval.text, textFieldMinutesInterval.text);
}
}
}
}
@@ -220,4 +214,3 @@ Rectangle {
}
}
}
+8 -28
View File
@@ -3,6 +3,7 @@ import QtQuick.Layouts 1.1
import QtQuick.Controls 1.2
import QtQuick.Controls.Styles 1.2
import "../js/colors.js" as GlobalColors
import "styles"
Rectangle {
id: selector
@@ -20,6 +21,7 @@ Rectangle {
function show(title, list, vl, valueIndex) {
titleString = title;
valueFromParent = vl;
returnValue = vl; // <-- initial the returnValue with the preselection to prevent a NULL return when pressing Cancel
valueIsIndex = valueIndex;
//fill the model
selectionModel.clear();
@@ -64,7 +66,7 @@ Rectangle {
spacing: Math.round(selectionBox.height*0.06)
Text {
id: titleText
font.pixelSize: Math.round(selectionBox.height*0.10)
font.pixelSize: appWindow.selectorTitleFontSize
font.bold: true
text: titleString
anchors.left: parent.left
@@ -81,7 +83,7 @@ Rectangle {
Layout.fillHeight: true
ListView {
anchors.fill: parent
spacing: Math.round(selectionBox.height*0.05)
spacing: Math.round(appWindow.height*0.05)
model: selectionModel
delegate: RadioButton {
id: radioBtn
@@ -90,38 +92,16 @@ Rectangle {
onClicked: {
selector.selected(valueString, index)
}
style: RadioButtonStyle {
indicator: Rectangle {
implicitWidth: Math.round(selectionBox.height*0.05)
implicitHeight: Math.round(selectionBox.height*0.05)
radius: Math.round(selectionBox.height*0.03)
border.color: radioBtn.checked ? GlobalColors.accentColor : "grey"
border.width: Math.round(selectionBox.height*0.005)
Rectangle {
anchors.fill: parent
visible: control.checked
color: radioBtn.checked ? GlobalColors.accentColor : "grey"
radius: Math.round(selectionBox.height*0.03)
anchors.margins: Math.round(selectionBox.height*0.01)
}
}
label: Text {
anchors.left: parent.left
anchors.leftMargin: 10
font.pixelSize: Math.round(selectionBox.height*0.05)
text: valueString
MouseArea {
anchors.fill: parent
onClicked: radioBtn.clicked()
}
}
style: MyRadioButtonStyle {
myRadioBtn: radioBtn
labelString: valueString
}
}
}
}
Text {
id: cancelButton
font.pixelSize: Math.round(selectionBox.height*0.07)
font.pixelSize: appWindow.selectorButtonFontSize
font.bold: true
text: qsTr("CANCEL")
anchors.right: parent.right
@@ -11,9 +11,11 @@ Item {
property int myListViewsWidth: 0
property var myListViewRoot
property var myListViewModel
property var componentMap: {
"ComboBox": myComboBox,
"SpinBox": mySpinBox
"SpinBox": mySpinBox,
"BlindsRaiseInterval": myBlindsRaiseInterval
}
width: myListViewsWidth
@@ -22,7 +24,6 @@ Item {
function setSourceComponent(comp) {
sourceComponent = comp;
}
}
// ComboBox
@@ -31,7 +32,7 @@ Item {
Rectangle {
MyComboBoxSelector {
id: myComboBoxSelector
parent: myListViewRoot
parent: myListViewRoot // this needs to be parent to display the selector over the whole ListView
}
id: myComboBoxContent
@@ -45,7 +46,7 @@ Item {
anchors.margins: 30
y: myValue != "" ? Math.round(parent.height*0.5 - contentHeight*0.9) : Math.round(parent.height*0.5 - contentHeight*0.5)
color: "black"
font.pixelSize: Math.round(myListViewsHeight*0.06)
font.pixelSize: appWindow.listViewTitleFontSize
text: myTitle
}
Text {
@@ -54,7 +55,7 @@ Item {
anchors.margins: 30
y: Math.round(parent.height*0.5 + contentHeight*0.15)
color: "grey"
font.pixelSize: myValue != "" ? Math.round(myListViewsHeight*0.05) : 0
font.pixelSize: myValue != "" ? appWindow.listViewValueFontSize : 0
//setup value from Index if necessary
text: myValueIsIndex ? myValuesList.get(parseInt(myValue)).value : myValue
}
@@ -96,7 +97,7 @@ Item {
Rectangle {
MySpinBoxSelector {
id: mySpinBoxSelector
parent: myListViewRoot
parent: myListViewRoot // this needs to be parent to display the selector over the whole ListView
}
id: mySpinBoxContent
@@ -110,7 +111,7 @@ Item {
anchors.margins: 30
y: myValue != "" ? Math.round(parent.height*0.5 - contentHeight*0.9) : Math.round(parent.height*0.5 - contentHeight*0.5)
color: "black"
font.pixelSize: Math.round(myListViewsHeight*0.06)
font.pixelSize: appWindow.listViewTitleFontSize
text: myTitle
}
Text {
@@ -119,8 +120,8 @@ Item {
anchors.margins: 30
y: Math.round(parent.height*0.5 + contentHeight*0.15)
color: "grey"
font.pixelSize: myValue != "" ? Math.round(myListViewsHeight*0.05) : 0
text: myValue
font.pixelSize: myValue != "" ? appWindow.listViewValueFontSize : 0
text: myPrefix+myValue
}
Rectangle {
anchors.horizontalCenter: parent.horizontalCenter
@@ -154,6 +155,84 @@ Item {
}
}
// BlindsRaiseInterval
Component {
id: myBlindsRaiseInterval
Rectangle {
MyBlindsRaiseIntervalSelector {
id: myBlindsRaiseIntervalSelector
parent: myListViewRoot // this needs to be parent to display the selector over the whole ListView
}
id: myBlindsRaiseIntervalContent
property int modelIndex: model.index
color: mouse.pressed ? "#11000000" : "white"
width: root.width
height: Math.round(blindsRaiseIntevalTitle.contentHeight*2.1 + blindsRaiseIntevalValue.contentHeight*1.0)
Text {
id: blindsRaiseIntevalTitle
anchors.left: parent.left
anchors.margins: 30
y: myValue != "" ? Math.round(parent.height*0.5 - contentHeight*0.9) : Math.round(parent.height*0.5 - contentHeight*0.5)
color: "black"
font.pixelSize: appWindow.listViewTitleFontSize
text: myTitle
}
Text {
id: blindsRaiseIntevalValue
anchors.left: parent.left
anchors.margins: 30
y: Math.round(parent.height*0.5 + contentHeight*0.15)
color: "grey"
font.pixelSize: myValue != "" ? appWindow.listViewValueFontSize : 0
text: ""
function buildTextString() {
if(myRaiseOnHandsType == "1") text = qsTr("Raise blinds every")+" "+myRaiseOnHandsInterval+" "+qsTr("hands");
else text = qsTr("Raise blinds every")+" "+myRaiseOnMinutesInterval+" "+qsTr("minutes");
}
Component.onCompleted: {
buildTextString();
}
}
Rectangle {
anchors.horizontalCenter: parent.horizontalCenter
anchors.bottom: parent.bottom
width: parent.width - 30
height: 1
color: "lightgrey"
}
MouseArea {
id: mouse
anchors.fill: parent
onClicked: {
//call selector overlay and set inital values
myBlindsRaiseIntervalSelector.show(myRaiseOnHandsType, myRaiseOnHandsInterval, myRaiseOnMinutesInterval)
}
Connections {
target: myBlindsRaiseIntervalSelector
onVisibleChanged: {
if(!myBlindsRaiseIntervalSelector.visible) {
//call update the currentItem with selection from the comboBox selector
myListViewModel.setProperty(myBlindsRaiseIntervalContent.modelIndex, "myRaiseOnHandsType", myBlindsRaiseIntervalSelector.raiseOnHandsType);
myListViewModel.setProperty(myBlindsRaiseIntervalContent.modelIndex, "myRaiseOnHandsInterval", myBlindsRaiseIntervalSelector.raiseOnHandsInterval);
myListViewModel.setProperty(myBlindsRaiseIntervalContent.modelIndex, "myRaiseOnMinutesInterval", myBlindsRaiseIntervalSelector.raiseOnMinutesInterval);
//here we also need to trigger the textStringBuild from the model again
blindsRaiseIntevalValue.buildTextString();
}
}
}
}
Component.onCompleted: {
//after building the delegate content set the final height to the root item
root.height = Qt.binding(function() { return height })
}
}
}
Component.onCompleted: {
listViewFactoryLoader.setSourceComponent(componentMap[myType])
}
+30 -59
View File
@@ -3,6 +3,7 @@ import QtQuick.Layouts 1.1
import QtQuick.Controls 1.2
import QtQuick.Controls.Styles 1.2
import "../js/colors.js" as GlobalColors
import "styles/"
Rectangle {
id: selector
@@ -11,21 +12,22 @@ Rectangle {
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
property string titleString: ""
property string prefix: ""
property int minValue: 0
property int maxValue: 0
property string returnValue: ""
property int initialTextFieldValue: 0
property int initialSliderValue: 0
function show(title, min, max, value, pref) {
titleString = title;
initialTextFieldValue = parseInt(value);
initialSliderValue = parseInt(value)
initialSliderValue = parseInt(value);
minValue = min;
maxValue = max;
prefix = pref
prefix = pref;
returnValue = value; // <-- initial the returnValue with the preselection to prevent a NULL return when pressing Cancel
visible = true;
}
@@ -59,7 +61,7 @@ Rectangle {
spacing: Math.round(selectionBox.height*0.06)
Text {
id: titleText
font.pixelSize: Math.round(selectionBox.height*0.10)
font.pixelSize: appWindow.fontSizeH1
font.bold: true
text: titleString
anchors.left: parent.left
@@ -68,65 +70,33 @@ Rectangle {
anchors.topMargin: 10
Layout.preferredHeight: contentHeight
}
TextField{
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.04)
anchors.leftMargin: 50 + prefixIndent
anchors.leftMargin: 50 + Math.round(appWindow.height*0.03)
// validator: IntValidator{bottom: minValue; top: maxValue;} TODO: test validator in later QtVersions > 5.5.0
focus: true
text: initialTextFieldValue
focus: true
function correctValue() {
if(text > maxValue) text = maxValue
else if(text < minValue) text = minValue
else {
//remove leading "0000"
var temp = parseInt(text)
text = temp
if(text != "") {
if(parseInt(text) > maxValue) text = maxValue
else if(parseInt(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.005)
}
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)
}
}
style: MyTextFieldStyle {
prefix: selector.prefix
myTextField: textField
}
}
Slider {
@@ -138,7 +108,8 @@ Rectangle {
anchors.leftMargin: 50
maximumValue: maxValue
minimumValue: minValue
value: initialSliderValue
//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)
@@ -186,7 +157,7 @@ Rectangle {
Text {
id: cancelButton
font.pixelSize: Math.round(selectionBox.height*0.07)
font.pixelSize: appWindow.selectorButtonFontSize
font.bold: true
text: qsTr("CANCEL")
Layout.preferredHeight: contentHeight
@@ -200,7 +171,7 @@ Rectangle {
}
Text {
id: okButton
font.pixelSize: Math.round(selectionBox.height*0.07)
font.pixelSize: appWindow.selectorButtonFontSize
font.bold: true
color: GlobalColors.accentColor
text: qsTr("OK")
@@ -1,46 +0,0 @@
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)
}
}
}
}
@@ -4,6 +4,7 @@ import "../../js/colors.js" as GlobalColors
RadioButtonStyle {
property var myRadioBtn
property string labelString: ""
indicator: Rectangle {
implicitWidth: Math.round(appWindow.height*0.05)
implicitHeight: Math.round(appWindow.height*0.05)
@@ -21,12 +22,12 @@ RadioButtonStyle {
label: Text {
anchors.left: parent.left
anchors.leftMargin: 10
font.pixelSize: Math.round(appWindow.height*0.05)
text: valueString
font.pixelSize: appWindow.radioButtonLabelFontSize
text: labelString
MouseArea {
anchors.fill: parent
onClicked: radioBtn.clicked()
onClicked: myRadioBtn.clicked()
}
}
}
@@ -1,7 +1,46 @@
import QtQuick 2.0
import QtQuick 2.4
import QtQuick.Controls.Styles 1.2
import "../../js/colors.js" as GlobalColors
Rectangle {
width: 100
height: 62
TextFieldStyle {
property string prefix: ""
property int prefixIndent: prefix != "" ? appWindow.textFieldFontSize*0.33 : 0
property var myTextField
textColor: "black"
font.pixelSize: appWindow.textFieldFontSize
background: Item { //bottom line with colored focus indicator
implicitHeight: appWindow.textFieldFontSize + appWindow.textFieldFontSize*0.25
implicitWidth: myTextField.width
Text { //prefix
visible: prefix != "" ? true : false
color: "black"
font.pixelSize: appWindow.textFieldFontSize
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: myTextField.activeFocus ? 0.8 : 0
anchors.bottom: parent.bottom
anchors.left: parent.left
anchors.leftMargin: - prefixIndent
width: myTextField.width + prefixIndent
height: Math.round(appWindow.height*0.005)
}
Rectangle {
color: "black"
opacity: myTextField.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: myTextField.width + prefixIndent
height: Math.round(appWindow.height*0.005)
}
}
}
+2 -2
View File
@@ -1,6 +1,6 @@
#include "createlocalgameimpl.h"
#include "createlocalgameviewimpl.h"
CreateLocalGameImpl::CreateLocalGameImpl(QObject *parent) : QObject(parent)
CreateLocalGameViewImpl::CreateLocalGameViewImpl(QObject *parent) : QObject(parent)
{
}
+6 -6
View File
@@ -1,16 +1,16 @@
#ifndef CREATELOCALGAMEIMPL_H
#define CREATELOCALGAMEIMPL_H
#ifndef CREATELOCALGAMEVIEWIMPL_H
#define CREATELOCALGAMEVIEWIMPL_H
#include <QtCore>
class CreateLocalGameImpl : public QObject
class CreateLocalGameViewImpl : public QObject
{
Q_OBJECT
public:
explicit CreateLocalGameImpl(QObject *parent = 0);
explicit CreateLocalGameViewImpl(QObject *parent = 0);
signals:
public slots:
};
#endif // CREATELOCALGAMEIMPL_H
#endif // CREATELOCALGAMEVIEWIMPL_H
+11 -1
View File
@@ -6,6 +6,8 @@
#include "qmlconfig.h"
#include "qmlwrapper.h"
#include "startviewimpl.h"
#include "createlocalgameviewimpl.h"
QmlWrapper::QmlWrapper(boost::shared_ptr<ConfigFile> c)
:QObject(), myConfig(c)
@@ -13,8 +15,14 @@ QmlWrapper::QmlWrapper(boost::shared_ptr<ConfigFile> c)
myEngine.reset(new QQmlApplicationEngine);
myQmlConfig = new QmlConfig(myConfig); //need to be a default pointer because QML doesnt support shared_ptr()
// Add c++ content here
//TODO create Session and Log here
myStartViewImpl = new StartViewImpl(this);
myCreateLocalGameViewImpl = new CreateLocalGameViewImpl(this);
//Add c++ content to QML here
myEngine->rootContext()->setContextProperty("Config", myQmlConfig);
myEngine->rootContext()->setContextProperty("StartViewImpl", myStartViewImpl);
myEngine->load(QUrl(QStringLiteral("qrc:/main.qml")));
}
@@ -29,3 +37,5 @@ QmlWrapper::QmlWrapper(const QmlWrapper&)
{
}
+5 -1
View File
@@ -3,9 +3,11 @@
#include <QtCore>
#include <boost/shared_ptr.hpp>
class QQmlApplicationEngine;
class ConfigFile;
class QmlConfig;
class QQmlApplicationEngine;
class CreateLocalGameViewImpl;
class StartViewImpl;
class QmlWrapper: public QObject
{
@@ -21,6 +23,8 @@ private:
boost::shared_ptr<QQmlApplicationEngine> myEngine;
boost::shared_ptr<ConfigFile> myConfig;
QmlConfig *myQmlConfig;
CreateLocalGameViewImpl *myCreateLocalGameViewImpl;
StartViewImpl *myStartViewImpl;
};
#endif // QMLWRAPPER_H
+7 -2
View File
@@ -1,7 +1,12 @@
#include "startimpl.h"
#include "startviewimpl.h"
StartImpl::StartImpl(QObject *parent) : QObject(parent)
StartViewImpl::StartViewImpl(QObject *parent) : QObject(parent)
{
}
void StartViewImpl::startLocalGame()
{
qDebug("startLocalGame im c++");
}
+8 -6
View File
@@ -1,16 +1,18 @@
#ifndef STARTIMPL_H
#define STARTIMPL_H
#ifndef STARTVIEWIMPL_H
#define STARTVIEWIMPL_H
#include <QtCore>
class StartImpl : public QObject
class StartViewImpl : public QObject
{
Q_OBJECT
public:
explicit StartImpl(QObject *parent = 0);
explicit StartViewImpl(QObject *parent = 0);
signals:
public slots:
Q_INVOKABLE void startLocalGame();
};
#endif // STARTIMPL_H
#endif // STARTVIEWIMPL_H
+30 -8
View File
@@ -15,6 +15,25 @@ ApplicationWindow {
minimumHeight: 240
visible: true
property int fontSizeH1: Math.round(height*0.10)
property int fontSizeH2: Math.round(height*0.09)
property int fontSizeH3: Math.round(height*0.08)
property int fontSizeH4: Math.round(height*0.07)
property int fontSizeH5: Math.round(height*0.06)
property int fontSizeH6: Math.round(height*0.05)
property int listViewTitleFontSize: fontSizeH5
property int listViewValueFontSize: fontSizeH6
property int selectorTitleFontSize: fontSizeH2
property int selectorValueFontSize: fontSizeH5
property int selectorButtonFontSize: fontSizeH6
property int radioButtonLabelFontSize: fontSizeH5
property int textFieldFontSize: fontSizeH2
property int rowLayoutSpacing: Math.round(appWindow.height*0.06)
property int columnLayoutSpacing: Math.round(appWindow.height*0.06)
toolBar: Rectangle {
id: toolbar
opacity: 1
@@ -40,9 +59,11 @@ ApplicationWindow {
height: parent.height
width: parent.height
radius: 4
color: leftMouse.pressed ? Qt.rgba(0,0,0,0.3) : "transparent"
color: toolBarLeftButtonMouse.pressed ? Qt.rgba(0,0,0,0.3) : "transparent"
property string myIconName: ""
property string myIconPath: ""
signal clicked();
function setIconPath(name) {
switch(name) {
case "PokerTH": myIconPath = "images/pokerth-logo.svg"
@@ -53,7 +74,7 @@ ApplicationWindow {
}
}
onMyIconNameChanged: setIconPath(myIconName)
onClicked: stackView.pop()
Image {
sourceSize.height: parent.height*0.8
@@ -62,10 +83,10 @@ ApplicationWindow {
source: parent.myIconPath
}
MouseArea {
id: leftMouse
id: toolBarLeftButtonMouse
anchors.fill: parent
anchors.margins: -10
onClicked: stackView.pop()
onClicked: parent.clicked()
}
}
@@ -87,10 +108,11 @@ ApplicationWindow {
height: parent.height
width: parent.height
radius: 4
color: rightMouse.pressed ? Qt.rgba(0,0,0,0.3) : "transparent"
color: toolBarRightButtonMouse.pressed ? Qt.rgba(0,0,0,0.3) : "transparent"
property string myIconName: ""
property string myIconPath: ""
signal clicked();
function setIconPath(name) {
switch(name) {
case "accept": myIconPath = "images/check.svg"
@@ -109,10 +131,10 @@ ApplicationWindow {
source: parent.myIconPath
}
MouseArea {
id: rightMouse
id: toolBarRightButtonMouse
anchors.fill: parent
anchors.margins: -10
onClicked: stackView.pop()
onClicked: parent.clicked();
}
}
}
+4
View File
@@ -15,5 +15,9 @@
<file>components/MyComboBoxSelector.qml</file>
<file>js/colors.js</file>
<file>components/MySpinBoxSelector.qml</file>
<file>views/gametableview/GameTableView.qml</file>
<file>components/MyBlindsRaiseIntervalSelector.qml</file>
<file>components/styles/MyTextFieldStyle.qml</file>
<file>components/styles/MyRadioButtonStyle.qml</file>
</qresource>
</RCC>
@@ -47,35 +47,21 @@ Rectangle {
myValue: ""
}
ListElement {
myId: "comboBox_Blinds"
myTitle: qsTr("Blinds")
myType: "ComboBox"
myValuesList: [
ListElement { value: qsTr("Use saved blinds settings") },
ListElement { value: qsTr("Change blinds settings ...") }
]
myId: "spinBox_StartBlind"
myTitle: qsTr("Start blind")
myType: "SpinBox"
myMaxValue: 20000
myMinValue: 5
myPrefix: "$"
myValue: ""
myValueIsIndex: true
}
}
ListElement {
myId: "comboBox_GameSpeed"
myTitle: qsTr("Game speed")
myType: "ComboBox"
myValuesList: [
ListElement { value: "11" },
ListElement { value: "10" },
ListElement { value: "9" },
ListElement { value: "8" },
ListElement { value: "7" },
ListElement { value: "6" },
ListElement { value: "5" },
ListElement { value: "4" },
ListElement { value: "3" },
ListElement { value: "2" },
ListElement { value: "1" }
]
myValue: ""
myValueIsIndex: false
myId: "comboBox_BlindsRaiseInterval"
myTitle: qsTr("Blinds raise interval")
myType: "BlindsRaiseInterval"
myRaiseOnHandsType: "" //if false it is raise on minutes type
myRaiseOnHandsInterval: ""
myRaiseOnMinutesInterval: ""
}
ListElement {
myId: "comboBox_GameSpeed"
@@ -99,10 +85,13 @@ Rectangle {
}
Component.onCompleted: {
//set Config Values from config file
createLocalGameViewModel.setProperty(0, "myValue", Config.readConfigInt("NumberOfPlayers"));
createLocalGameViewModel.setProperty(1, "myValue", Config.readConfigInt("StartCash"));
createLocalGameViewModel.setProperty(2, "myValue", "0");
createLocalGameViewModel.setProperty(3, "myValue", Config.readConfigInt("GameSpeed"));
createLocalGameViewModel.setProperty(2, "myValue", Config.readConfigInt("FirstSmallBlind"));
createLocalGameViewModel.setProperty(3, "myRaiseOnHandsType", Config.readConfigInt("RaiseBlindsAtHands"));
createLocalGameViewModel.setProperty(3, "myRaiseOnHandsInterval", Config.readConfigInt("RaiseSmallBlindEveryHands"));
createLocalGameViewModel.setProperty(3, "myRaiseOnMinutesInterval", Config.readConfigInt("RaiseSmallBlindEveryMinutes"));
createLocalGameViewModel.setProperty(4, "myValue", Config.readConfigInt("GameSpeed"));
}
}
@@ -111,20 +100,41 @@ Rectangle {
myListViewsWidth: createLocalGameViewList.width
myListViewRoot: createLocalGameViewRoot
myListViewModel: createLocalGameViewModel
// TODO --> Blindsfelder immer mit anzeigen spezialfeld manual blinds settings direkt hier inline implementieren
}
}
}
function getListElementValueString(elementName) {
//read model and check for the elementName
for (var i = 0; i < createLocalGameViewModel.count; i++ ) {
if(createLocalGameViewModel.get(i).myId == elementName) {
return createLocalGameViewModel.get(i).myValue;
}
}
}
function setupToolBar() {
toolbar.visible = true;
toolBarRightButton.myIconName = "accept";
toolBarLeftButton.myIconName = "back";
//send start signal to the session
toolBarRightButton.clicked.connect(StartViewImpl.startLocalGame);
}
function clearToolBar() {
toolBarRightButton.clicked.disconnect(StartViewImpl.startLocalGame);
}
Component.onCompleted: {
setupToolBar();
}
onVisibleChanged: {
if(visible) setupToolBar()
if(visible) setupToolBar();
else clearToolBar();
}
}
@@ -1,7 +1,22 @@
import QtQuick 2.0
import QtQuick 2.4
import QtQuick.Controls 1.2
import QtQuick.Controls.Styles 1.2
import QtQuick.Layouts 1.1
import "../../components"
Rectangle {
width: 100
height: 62
}
id: gameTableViewRoot
width: parent.width
height: parent.height
function setupToolBar() {
toolbar.visible = false;
}
Component.onCompleted: {
setupToolBar();
}
onVisibleChanged: {
if(visible) setupToolBar()
}
}
@@ -7,7 +7,6 @@ Button {
width: parent.width*0.50
height: parent.height/7
onClicked: stackView.push(Qt.resolvedUrl(page))
anchors.horizontalCenter: parent.horizontalCenter
Component {
@@ -3,6 +3,7 @@ import QtQuick.Controls 1.2
import QtQuick.Layouts 1.1
Item {
id: startView
Image {
id: background
source: "../../images/startViewBackground.png"
@@ -14,6 +15,8 @@ Item {
StartButton {
text: qsTr("Local game")
page: "../createlocalgameview/CreateLocalGameView.qml"
onClicked: stackView.push(Qt.resolvedUrl(page))
//TODO ^^ --> gleich GameTable anzeigen wenn "ShowGameSettingsDialogOnNewGame" == true
}
StartButton {
@@ -28,6 +31,7 @@ Item {
}
function setupToolBar() {
toolbar.visible = true;
toolBarRightButton.myIconName = "more";
toolBarLeftButton.myIconName = "PokerTH";
}