new structure for Calculator
This commit is contained in:
parent
ab95cfe54e
commit
967e05df05
7 changed files with 224 additions and 203 deletions
5
CalculateEndPage.qml
Normal file
5
CalculateEndPage.qml
Normal file
|
|
@ -0,0 +1,5 @@
|
||||||
|
import QtQuick 2.0
|
||||||
|
|
||||||
|
Item {
|
||||||
|
|
||||||
|
}
|
||||||
|
|
@ -3,215 +3,59 @@ import QtQuick.Controls 2.4
|
||||||
import "./"
|
import "./"
|
||||||
|
|
||||||
Page {
|
Page {
|
||||||
id: calculator
|
id: root
|
||||||
|
|
||||||
property var nums: [0, 0, 0, 0, 0, 0, 0, 0, 0, 0]
|
Label {
|
||||||
property int currIndex: -1
|
id: num
|
||||||
property int tickInterval: 1000
|
anchors.centerIn: parent
|
||||||
property int numCount: 10
|
font.pixelSize: calculator.height * 0.6
|
||||||
|
text: calculator.nums[calculator.currIndex]
|
||||||
signal pageOpened()
|
|
||||||
|
|
||||||
onPageOpened: {
|
|
||||||
console.log("opened calculator")
|
|
||||||
calculator.state = "starting"
|
|
||||||
}
|
|
||||||
|
|
||||||
states: [
|
|
||||||
State {
|
|
||||||
name: "starting"
|
|
||||||
PropertyChanges {
|
|
||||||
target: calculatorStack
|
|
||||||
currPage: calculatorStartPageComp
|
|
||||||
}
|
|
||||||
},
|
|
||||||
|
|
||||||
State {
|
|
||||||
name: "running"
|
|
||||||
PropertyChanges {
|
|
||||||
target: calculatorStack
|
|
||||||
currPage: calculatorGamePageComp
|
|
||||||
}
|
|
||||||
}
|
|
||||||
]
|
|
||||||
|
|
||||||
StackView {
|
|
||||||
id: calculatorStack
|
|
||||||
|
|
||||||
property var currPage;
|
|
||||||
|
|
||||||
anchors.fill: parent
|
|
||||||
|
|
||||||
onCurrPageChanged: {
|
|
||||||
calculatorStack.replace(currPage)
|
|
||||||
}
|
|
||||||
onCurrentItemChanged: {
|
|
||||||
calculatorStack.currentItem.pageOpened()
|
|
||||||
}
|
|
||||||
|
|
||||||
Component {
|
|
||||||
id: calculatorStartPageComp
|
|
||||||
Page {
|
|
||||||
id: calculatorStartPage
|
|
||||||
Label {
|
|
||||||
id: calculatorStartPageHeading
|
|
||||||
anchors {
|
|
||||||
top: parent.top
|
|
||||||
topMargin: parent.height * 0.05
|
|
||||||
horizontalCenter: parent.horizontalCenter
|
|
||||||
}
|
|
||||||
font.pixelSize: parent.height * 0.15
|
|
||||||
text: "Calculator"
|
|
||||||
}
|
|
||||||
SpinBox {
|
|
||||||
id: calculatorTickInterval
|
|
||||||
from: 1
|
|
||||||
to: 100000
|
|
||||||
stepSize: 1
|
|
||||||
value: 1000
|
|
||||||
anchors.horizontalCenter: parent.horizontalCenter
|
|
||||||
editable: true
|
|
||||||
anchors {
|
|
||||||
left: parent.left
|
|
||||||
top: parent.top
|
|
||||||
leftMargin: parent.width * 0.5 - width * 0.5
|
|
||||||
topMargin: parent.height * 0.3 - height * 0.5
|
|
||||||
}
|
|
||||||
onValueChanged: {
|
|
||||||
calculator.tickInterval = calculatorTickInterval.value
|
|
||||||
}
|
|
||||||
|
|
||||||
}
|
|
||||||
SpinBox {
|
|
||||||
id: calculatorNumCount
|
|
||||||
from: 1
|
|
||||||
to: 100000
|
|
||||||
stepSize: 1
|
|
||||||
value: 10
|
|
||||||
anchors.horizontalCenter: parent.horizontalCenter
|
|
||||||
editable: true
|
|
||||||
anchors {
|
|
||||||
left: parent.left
|
|
||||||
top: parent.top
|
|
||||||
leftMargin: parent.width * 0.5 - width * 0.5
|
|
||||||
topMargin: parent.height * 0.6 - height * 0.5
|
|
||||||
}
|
|
||||||
onValueChanged: {
|
|
||||||
calculator.numCount = calculatorNumCount.value
|
|
||||||
}
|
|
||||||
}
|
|
||||||
Button {
|
|
||||||
id: calculatorStartButton
|
|
||||||
text: "start"
|
|
||||||
onClicked: {
|
|
||||||
calculator.start()
|
|
||||||
}
|
|
||||||
}
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
Component {
|
|
||||||
id: calculatorGamePageComp
|
|
||||||
Page {
|
|
||||||
Label {
|
|
||||||
id: num
|
|
||||||
anchors.centerIn: parent
|
|
||||||
font.pixelSize: calculator.height * 0.6
|
|
||||||
text: calculator.nums[calculator.currIndex]
|
|
||||||
}
|
|
||||||
|
|
||||||
|
|
||||||
ProgressBar {
|
|
||||||
id: prog
|
|
||||||
property int progress: 0
|
|
||||||
anchors {
|
|
||||||
bottom: parent.bottom
|
|
||||||
bottomMargin: parent.height * 0.02
|
|
||||||
left: parent.left
|
|
||||||
leftMargin: parent.width * 0.01
|
|
||||||
right: parent.right
|
|
||||||
rightMargin: parent.width * 0.01
|
|
||||||
}
|
|
||||||
value: progress/100
|
|
||||||
onValueChanged: {
|
|
||||||
console.log(value)
|
|
||||||
}
|
|
||||||
|
|
||||||
NumberAnimation {
|
|
||||||
id: progAnim
|
|
||||||
target: prog
|
|
||||||
property: "progress"
|
|
||||||
from: 100
|
|
||||||
to: 0
|
|
||||||
duration: tick.interval
|
|
||||||
easing.type: Easing.Linear
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
Timer {
|
|
||||||
id: tick
|
|
||||||
interval: calculator.tickInterval
|
|
||||||
repeat: false
|
|
||||||
running: calculator.state === "running"
|
|
||||||
|
|
||||||
onTriggered: {
|
|
||||||
if(calculator.currIndex+1 <= calculator.numCount-1){
|
|
||||||
nextNumber()
|
|
||||||
tick.start()
|
|
||||||
}
|
|
||||||
else {
|
|
||||||
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
onRunningChanged: {
|
|
||||||
if(running){
|
|
||||||
progAnim.start()
|
|
||||||
}
|
|
||||||
}
|
|
||||||
}
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
|
|
||||||
replaceExit: Transition {
|
|
||||||
NumberAnimation {
|
|
||||||
from: 1
|
|
||||||
to: 0
|
|
||||||
property: "opacity"
|
|
||||||
duration: 200
|
|
||||||
easing.type: Easing.InOutQuad
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
replaceEnter: Transition {
|
|
||||||
NumberAnimation {
|
|
||||||
from: 0
|
|
||||||
to: 1
|
|
||||||
property: "opacity"
|
|
||||||
duration: 200
|
|
||||||
easing.type: Easing.InOutQuad
|
|
||||||
}
|
|
||||||
}
|
|
||||||
}
|
}
|
||||||
|
|
||||||
|
|
||||||
/*-------------------------
|
ProgressBar {
|
||||||
---------functions---------
|
id: prog
|
||||||
-------------------------*/
|
property int progress: 0
|
||||||
|
anchors {
|
||||||
function nextNumber(){
|
bottom: parent.bottom
|
||||||
var randNum = 0
|
bottomMargin: parent.height * 0.02
|
||||||
while(randNum === 0 || randNum === calculator.nums[currIndex]){
|
left: parent.left
|
||||||
randNum = Math.floor(Math.random() * 9)
|
leftMargin: parent.width * 0.01
|
||||||
|
right: parent.right
|
||||||
|
rightMargin: parent.width * 0.01
|
||||||
|
}
|
||||||
|
value: progress/100
|
||||||
|
NumberAnimation {
|
||||||
|
id: progAnim
|
||||||
|
target: prog
|
||||||
|
property: "progress"
|
||||||
|
from: 100
|
||||||
|
to: 0
|
||||||
|
duration: tick.interval
|
||||||
|
easing.type: Easing.Linear
|
||||||
}
|
}
|
||||||
calculator.nums[calculator.currIndex+1] = randNum
|
|
||||||
console.log(randNum)
|
|
||||||
calculator.currIndex += 1
|
|
||||||
}
|
}
|
||||||
|
|
||||||
function start(){
|
Timer {
|
||||||
calculator.nextNumber()
|
id: tick
|
||||||
calculator.state = "running"
|
interval: calculator.tickInterval
|
||||||
|
repeat: false
|
||||||
|
running: calculator.state === "running"
|
||||||
|
|
||||||
|
onTriggered: {
|
||||||
|
if(calculator.currIndex+1 <= calculator.numCount-1){
|
||||||
|
nextNumber()
|
||||||
|
tick.start()
|
||||||
|
}
|
||||||
|
else {
|
||||||
|
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
onRunningChanged: {
|
||||||
|
if(running){
|
||||||
|
progAnim.start()
|
||||||
|
}
|
||||||
|
}
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
|
||||||
64
CalculateStartPage.qml
Normal file
64
CalculateStartPage.qml
Normal file
|
|
@ -0,0 +1,64 @@
|
||||||
|
import QtQuick 2.11
|
||||||
|
import QtQuick.Controls 2.4
|
||||||
|
|
||||||
|
Page {
|
||||||
|
id: calculatorStartPage
|
||||||
|
|
||||||
|
Label {
|
||||||
|
id: calculatorStartPageHeading
|
||||||
|
anchors {
|
||||||
|
top: parent.top
|
||||||
|
topMargin: parent.height * 0.05
|
||||||
|
horizontalCenter: parent.horizontalCenter
|
||||||
|
}
|
||||||
|
font.pixelSize: parent.height * 0.15
|
||||||
|
text: "Calculator"
|
||||||
|
}
|
||||||
|
|
||||||
|
SpinBox {
|
||||||
|
id: calculatorTickInterval
|
||||||
|
from: 1
|
||||||
|
to: 100000
|
||||||
|
stepSize: 1
|
||||||
|
value: 1000
|
||||||
|
anchors.horizontalCenter: parent.horizontalCenter
|
||||||
|
editable: true
|
||||||
|
anchors {
|
||||||
|
left: parent.left
|
||||||
|
top: parent.top
|
||||||
|
leftMargin: parent.width * 0.5 - width * 0.5
|
||||||
|
topMargin: parent.height * 0.3 - height * 0.5
|
||||||
|
}
|
||||||
|
onValueChanged: {
|
||||||
|
calculator.tickInterval = calculatorTickInterval.value
|
||||||
|
}
|
||||||
|
|
||||||
|
}
|
||||||
|
|
||||||
|
SpinBox {
|
||||||
|
id: calculatorNumCount
|
||||||
|
from: 1
|
||||||
|
to: 100000
|
||||||
|
stepSize: 1
|
||||||
|
value: 10
|
||||||
|
anchors.horizontalCenter: parent.horizontalCenter
|
||||||
|
editable: true
|
||||||
|
anchors {
|
||||||
|
left: parent.left
|
||||||
|
top: parent.top
|
||||||
|
leftMargin: parent.width * 0.5 - width * 0.5
|
||||||
|
topMargin: parent.height * 0.6 - height * 0.5
|
||||||
|
}
|
||||||
|
onValueChanged: {
|
||||||
|
calculator.numCount = calculatorNumCount.value
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
Button {
|
||||||
|
id: calculatorStartButton
|
||||||
|
text: "start"
|
||||||
|
onClicked: {
|
||||||
|
calculator.start()
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
104
Calculator.qml
Normal file
104
Calculator.qml
Normal file
|
|
@ -0,0 +1,104 @@
|
||||||
|
import QtQuick 2.11
|
||||||
|
import QtQuick.Controls 2.4
|
||||||
|
|
||||||
|
Item {
|
||||||
|
id: calculator
|
||||||
|
|
||||||
|
property var nums: [0, 0, 0, 0, 0, 0, 0, 0, 0, 0]
|
||||||
|
property int currIndex: -1
|
||||||
|
property int tickInterval: 1000
|
||||||
|
property int numCount: 10
|
||||||
|
|
||||||
|
signal pageOpened()
|
||||||
|
|
||||||
|
onPageOpened: {
|
||||||
|
calculator.state = "starting"
|
||||||
|
}
|
||||||
|
|
||||||
|
states: [
|
||||||
|
State {
|
||||||
|
name: "starting"
|
||||||
|
PropertyChanges {
|
||||||
|
target: calculatorStack
|
||||||
|
currPage: calculatorStartPageComp
|
||||||
|
}
|
||||||
|
},
|
||||||
|
|
||||||
|
State {
|
||||||
|
name: "running"
|
||||||
|
PropertyChanges {
|
||||||
|
target: calculatorStack
|
||||||
|
currPage: calculatorGamePageComp
|
||||||
|
}
|
||||||
|
}
|
||||||
|
]
|
||||||
|
|
||||||
|
StackView {
|
||||||
|
id: calculatorStack
|
||||||
|
|
||||||
|
property var currPage;
|
||||||
|
|
||||||
|
anchors.fill: parent
|
||||||
|
|
||||||
|
onCurrPageChanged: {
|
||||||
|
calculatorStack.replace(currPage)
|
||||||
|
}
|
||||||
|
onCurrentItemChanged: {
|
||||||
|
calculatorStack.currentItem.pageOpened()
|
||||||
|
}
|
||||||
|
|
||||||
|
Component {
|
||||||
|
id: calculatorStartPageComp
|
||||||
|
CalculateStartPage {
|
||||||
|
id: calculatorStartPage
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
Component {
|
||||||
|
id: calculatorGamePageComp
|
||||||
|
CalculatePage {
|
||||||
|
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
|
||||||
|
replaceExit: Transition {
|
||||||
|
NumberAnimation {
|
||||||
|
from: 1
|
||||||
|
to: 0
|
||||||
|
property: "opacity"
|
||||||
|
duration: 200
|
||||||
|
easing.type: Easing.InOutQuad
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
replaceEnter: Transition {
|
||||||
|
NumberAnimation {
|
||||||
|
from: 0
|
||||||
|
to: 1
|
||||||
|
property: "opacity"
|
||||||
|
duration: 200
|
||||||
|
easing.type: Easing.InOutQuad
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
|
||||||
|
/*-------------------------
|
||||||
|
---------functions---------
|
||||||
|
-------------------------*/
|
||||||
|
|
||||||
|
function nextNumber(){
|
||||||
|
var randNum = 0
|
||||||
|
while(randNum === 0 || randNum === calculator.nums[currIndex]){
|
||||||
|
randNum = Math.floor(Math.random() * 9)
|
||||||
|
}
|
||||||
|
calculator.nums[calculator.currIndex+1] = randNum
|
||||||
|
calculator.currIndex += 1
|
||||||
|
}
|
||||||
|
|
||||||
|
function start(){
|
||||||
|
calculator.nextNumber()
|
||||||
|
calculator.state = "running"
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
@ -4,6 +4,7 @@ import "./"
|
||||||
|
|
||||||
Page {
|
Page {
|
||||||
id: root
|
id: root
|
||||||
|
|
||||||
signal pageOpened()
|
signal pageOpened()
|
||||||
Button {
|
Button {
|
||||||
id: calenderButton
|
id: calenderButton
|
||||||
|
|
|
||||||
3
qml.qrc
3
qml.qrc
|
|
@ -4,5 +4,8 @@
|
||||||
<file>CalenderPage.qml</file>
|
<file>CalenderPage.qml</file>
|
||||||
<file>StartPage.qml</file>
|
<file>StartPage.qml</file>
|
||||||
<file>CalculatePage.qml</file>
|
<file>CalculatePage.qml</file>
|
||||||
|
<file>CalculateStartPage.qml</file>
|
||||||
|
<file>CalculateEndPage.qml</file>
|
||||||
|
<file>Calculator.qml</file>
|
||||||
</qresource>
|
</qresource>
|
||||||
</RCC>
|
</RCC>
|
||||||
|
|
|
||||||
Loading…
Reference in a new issue