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 "./"
|
||||
|
||||
Page {
|
||||
id: calculator
|
||||
id: root
|
||||
|
||||
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: {
|
||||
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
|
||||
}
|
||||
}
|
||||
Label {
|
||||
id: num
|
||||
anchors.centerIn: parent
|
||||
font.pixelSize: calculator.height * 0.6
|
||||
text: calculator.nums[calculator.currIndex]
|
||||
}
|
||||
|
||||
|
||||
/*-------------------------
|
||||
---------functions---------
|
||||
-------------------------*/
|
||||
|
||||
function nextNumber(){
|
||||
var randNum = 0
|
||||
while(randNum === 0 || randNum === calculator.nums[currIndex]){
|
||||
randNum = Math.floor(Math.random() * 9)
|
||||
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
|
||||
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(){
|
||||
calculator.nextNumber()
|
||||
calculator.state = "running"
|
||||
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()
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
|
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 {
|
||||
id: root
|
||||
|
||||
signal pageOpened()
|
||||
Button {
|
||||
id: calenderButton
|
||||
|
|
3
qml.qrc
3
qml.qrc
|
@ -4,5 +4,8 @@
|
|||
<file>CalenderPage.qml</file>
|
||||
<file>StartPage.qml</file>
|
||||
<file>CalculatePage.qml</file>
|
||||
<file>CalculateStartPage.qml</file>
|
||||
<file>CalculateEndPage.qml</file>
|
||||
<file>Calculator.qml</file>
|
||||
</qresource>
|
||||
</RCC>
|
||||
|
|
Loading…
Reference in a new issue