diff options
Diffstat (limited to 'demos/declarative')
| -rw-r--r-- | demos/declarative/samegame/SamegameCore/BoomBlock.qml | 21 | ||||
| -rw-r--r-- | demos/declarative/samegame/SamegameCore/Button.qml | 25 | ||||
| -rw-r--r-- | demos/declarative/samegame/SamegameCore/Dialog.qml | 25 | ||||
| -rwxr-xr-x | demos/declarative/samegame/SamegameCore/samegame.js | 167 | ||||
| -rw-r--r-- | demos/declarative/samegame/samegame.qml | 78 |
5 files changed, 174 insertions, 142 deletions
diff --git a/demos/declarative/samegame/SamegameCore/BoomBlock.qml b/demos/declarative/samegame/SamegameCore/BoomBlock.qml index db43182..bad1bf4 100644 --- a/demos/declarative/samegame/SamegameCore/BoomBlock.qml +++ b/demos/declarative/samegame/SamegameCore/BoomBlock.qml @@ -26,12 +26,16 @@ Item { id:block anchors.fill: parent } - Particles { id: particles - width:1; height:1; anchors.centerIn: parent; - emissionRate: 0; - lifeSpan: 700; lifeSpanDeviation: 600; + Particles { + id: particles + + width: 1; height: 1 + anchors.centerIn: parent + + emissionRate: 0 + lifeSpan: 700; lifeSpanDeviation: 600 angle: 0; angleDeviation: 360; - velocity: 100; velocityDeviation:30; + velocity: 100; velocityDeviation: 30 source: { if(type == 0){ "pics/redStar.png"; @@ -44,10 +48,13 @@ Item { id:block } states: [ - State{ name: "AliveState"; when: spawned == true && dying == false + State { + name: "AliveState"; when: spawned == true && dying == false PropertyChanges { target: img; opacity: 1 } }, - State{ name: "DeathState"; when: dying == true + + State { + name: "DeathState"; when: dying == true StateChangeScript { script: particles.burst(50); } PropertyChanges { target: img; opacity: 0 } StateChangeScript { script: block.destroy(1000); } diff --git a/demos/declarative/samegame/SamegameCore/Button.qml b/demos/declarative/samegame/SamegameCore/Button.qml index 9c7986b..0faabc9 100644 --- a/demos/declarative/samegame/SamegameCore/Button.qml +++ b/demos/declarative/samegame/SamegameCore/Button.qml @@ -3,23 +3,32 @@ import Qt 4.7 Rectangle { id: container - signal clicked property string text: "Button" - color: activePalette.button; smooth: true - width: txtItem.width + 20; height: txtItem.height + 6 - border.width: 1; border.color: Qt.darker(activePalette.button); radius: 8; + signal clicked + + width: buttonLabel.width + 20; height: buttonLabel.height + 6 + smooth: true + border { width: 1; color: Qt.darker(activePalette.button) } + radius: 8 + color: activePalette.button gradient: Gradient { GradientStop { - id: topGrad; position: 0.0 - color: if (mr.pressed) { activePalette.dark } else { activePalette.light } } + position: 0.0 + color: { + if (mouseArea.pressed) + return activePalette.dark + else + return activePalette.light + } + } GradientStop { position: 1.0; color: activePalette.button } } - MouseArea { id: mr; anchors.fill: parent; onClicked: container.clicked() } + MouseArea { id: mouseArea; anchors.fill: parent; onClicked: container.clicked() } Text { - id: txtItem; text: container.text; anchors.centerIn: container; color: activePalette.buttonText + id: buttonLabel; text: container.text; anchors.centerIn: container; color: activePalette.buttonText } } diff --git a/demos/declarative/samegame/SamegameCore/Dialog.qml b/demos/declarative/samegame/SamegameCore/Dialog.qml index 7f1189e..8784348 100644 --- a/demos/declarative/samegame/SamegameCore/Dialog.qml +++ b/demos/declarative/samegame/SamegameCore/Dialog.qml @@ -2,21 +2,32 @@ import Qt 4.7 Rectangle { id: page + + property Item text: dialogText + + signal closed + function forceClose() { page.closed(); page.opacity = 0; } + function show(txt) { - myText.text = txt; + dialogText.text = txt; page.opacity = 1; } - signal closed(); - property Item text: myText - color: "white"; border.width: 1; width: myText.width + 20; height: myText.height + 40; + + width: dialogText.width + 20; height: dialogText.height + 20 + color: "white" + border.width: 1 opacity: 0 - Behavior on opacity { + + Behavior on opacity { NumberAnimation { duration: 1000 } } - Text { id: myText; anchors.centerIn: parent; text: "Hello World!" } - MouseArea { id: mr; anchors.fill: parent; onClicked: forceClose(); } + + Text { id: dialogText; anchors.centerIn: parent; text: "Hello World!" } + + MouseArea { anchors.fill: parent; onClicked: forceClose(); } } + diff --git a/demos/declarative/samegame/SamegameCore/samegame.js b/demos/declarative/samegame/SamegameCore/samegame.js index a119a88..3888381 100755 --- a/demos/declarative/samegame/SamegameCore/samegame.js +++ b/demos/declarative/samegame/SamegameCore/samegame.js @@ -1,18 +1,18 @@ /* This script file handles the game logic */ -//Note that X/Y referred to here are in game coordinates -var maxX = 10;//Nums are for gameCanvas.tileSize 40 -var maxY = 15; -var maxIndex = maxX*maxY; + +var maxColumn = 10; +var maxRow = 15; +var maxIndex = maxColumn*maxRow; var board = new Array(maxIndex); -var tileSrc = "SamegameCore/BoomBlock.qml"; +var blockSrc = "SamegameCore/BoomBlock.qml"; var scoresURL = "http://qtfx-nokia.trolltech.com.au/samegame/scores.php"; var scoresURL = ""; -var timer; -var component = createComponent(tileSrc); +var gameDuration; +var component = createComponent(blockSrc); //Index function used instead of a 2D array -function index(xIdx,yIdx) { - return xIdx + (yIdx * maxX); +function index(column,row) { + return column + (row * maxColumn); } function timeStr(msecs) { @@ -22,51 +22,48 @@ function timeStr(msecs) { return ret; } -function initBoard() +function startNewGame() { + //Delete blocks from previous game for(var i = 0; i<maxIndex; i++){ - //Delete old blocks if(board[i] != null) board[i].destroy(); } //Calculate board size - maxX = Math.floor(gameCanvas.width/gameCanvas.tileSize); - maxY = Math.floor(gameCanvas.height/gameCanvas.tileSize); - maxIndex = maxY*maxX; + maxColumn = Math.floor(gameCanvas.width/gameCanvas.blockSize); + maxRow = Math.floor(gameCanvas.height/gameCanvas.blockSize); + maxIndex = maxRow*maxColumn; //Close dialogs - scoreName.forceClose(); + nameInputDialog.forceClose(); dialog.forceClose(); - var a = new Date(); //Initialize Board board = new Array(maxIndex); gameCanvas.score = 0; - for(var xIdx=0; xIdx<maxX; xIdx++){ - for(var yIdx=0; yIdx<maxY; yIdx++){ - board[index(xIdx,yIdx)] = null; - createBlock(xIdx,yIdx); + for(var column=0; column<maxColumn; column++){ + for(var row=0; row<maxRow; row++){ + board[index(column,row)] = null; + createBlock(column,row); } } - timer = new Date(); - - //print(timer.valueOf() - a.valueOf()); + gameDuration = new Date(); } -var fillFound;//Set after a floodFill call to the number of tiles found +var fillFound;//Set after a floodFill call to the number of blocks found var floodBoard;//Set to 1 if the floodFill reaches off that node //NOTE: Be careful with vars named x,y, as the calling object's x,y are still in scope function handleClick(x,y) { - var xIdx = Math.floor(x/gameCanvas.tileSize); - var yIdx = Math.floor(y/gameCanvas.tileSize); - if(xIdx >= maxX || xIdx < 0 || yIdx >= maxY || yIdx < 0) + var column = Math.floor(x/gameCanvas.blockSize); + var row = Math.floor(y/gameCanvas.blockSize); + if(column >= maxColumn || column < 0 || row >= maxRow || row < 0) return; - if(board[index(xIdx, yIdx)] == null) + if(board[index(column, row)] == null) return; - //If it's a valid tile, remove it and all connected (does nothing if it's not connected) - floodFill(xIdx,yIdx, -1); + //If it's a valid block, remove it and all connected (does nothing if it's not connected) + floodFill(column,row, -1); if(fillFound <= 0) return; gameCanvas.score += (fillFound - 1) * (fillFound - 1); @@ -74,67 +71,67 @@ function handleClick(x,y) victoryCheck(); } -function floodFill(xIdx,yIdx,type) +function floodFill(column,row,type) { - if(board[index(xIdx, yIdx)] == null) + if(board[index(column, row)] == null) return; var first = false; if(type == -1){ first = true; - type = board[index(xIdx,yIdx)].type; + type = board[index(column,row)].type; //Flood fill initialization fillFound = 0; floodBoard = new Array(maxIndex); } - if(xIdx >= maxX || xIdx < 0 || yIdx >= maxY || yIdx < 0) + if(column >= maxColumn || column < 0 || row >= maxRow || row < 0) return; - if(floodBoard[index(xIdx, yIdx)] == 1 || (!first && type != board[index(xIdx,yIdx)].type)) + if(floodBoard[index(column, row)] == 1 || (!first && type != board[index(column,row)].type)) return; - floodBoard[index(xIdx, yIdx)] = 1; - floodFill(xIdx+1,yIdx,type); - floodFill(xIdx-1,yIdx,type); - floodFill(xIdx,yIdx+1,type); - floodFill(xIdx,yIdx-1,type); + floodBoard[index(column, row)] = 1; + floodFill(column+1,row,type); + floodFill(column-1,row,type); + floodFill(column,row+1,type); + floodFill(column,row-1,type); if(first==true && fillFound == 0) - return;//Can't remove single tiles - board[index(xIdx,yIdx)].dying = true; - board[index(xIdx,yIdx)] = null; + return;//Can't remove single blocks + board[index(column,row)].dying = true; + board[index(column,row)] = null; fillFound += 1; } function shuffleDown() { //Fall down - for(var xIdx=0; xIdx<maxX; xIdx++){ + for(var column=0; column<maxColumn; column++){ var fallDist = 0; - for(var yIdx=maxY-1; yIdx>=0; yIdx--){ - if(board[index(xIdx,yIdx)] == null){ + for(var row=maxRow-1; row>=0; row--){ + if(board[index(column,row)] == null){ fallDist += 1; }else{ if(fallDist > 0){ - var obj = board[index(xIdx,yIdx)]; - obj.targetY += fallDist * gameCanvas.tileSize; - board[index(xIdx,yIdx+fallDist)] = obj; - board[index(xIdx,yIdx)] = null; + var obj = board[index(column,row)]; + obj.targetY += fallDist * gameCanvas.blockSize; + board[index(column,row+fallDist)] = obj; + board[index(column,row)] = null; } } } } //Fall to the left fallDist = 0; - for(xIdx=0; xIdx<maxX; xIdx++){ - if(board[index(xIdx, maxY - 1)] == null){ + for(column=0; column<maxColumn; column++){ + if(board[index(column, maxRow - 1)] == null){ fallDist += 1; }else{ if(fallDist > 0){ - for(yIdx=0; yIdx<maxY; yIdx++){ - obj = board[index(xIdx,yIdx)]; + for(row=0; row<maxRow; row++){ + obj = board[index(column,row)]; if(obj == null) continue; - obj.targetX -= fallDist * gameCanvas.tileSize; - board[index(xIdx-fallDist,yIdx)] = obj; - board[index(xIdx,yIdx)] = null; + obj.targetX -= fallDist * gameCanvas.blockSize; + board[index(column-fallDist,row)] = obj; + board[index(column,row)] = null; } } } @@ -143,40 +140,38 @@ function shuffleDown() function victoryCheck() { - //awards bonuses for no tiles left + //awards bonuses for no blocks left var deservesBonus = true; - for(var xIdx=maxX-1; xIdx>=0; xIdx--) - if(board[index(xIdx, maxY - 1)] != null) + for(var column=maxColumn-1; column>=0; column--) + if(board[index(column, maxRow - 1)] != null) deservesBonus = false; if(deservesBonus) gameCanvas.score += 500; //Checks for game over - if(deservesBonus || !(floodMoveCheck(0,maxY-1, -1))){ - timer = new Date() - timer; - //scoreName.show("You won! Please enter your name: "); - scoreName.show("You won! Please enter your name: "); - scoreName.initialWidth = scoreName.text.width + 20; - scoreName.width = scoreName.initialWidth; - scoreName.text.opacity = 0;//Just a spacer - //dialog.show("Game Over. Your score is " + gameCanvas.score); + if(deservesBonus || !(floodMoveCheck(0,maxRow-1, -1))){ + gameDuration = new Date() - gameDuration; + nameInputDialog.show("You won! Please enter your name: "); + nameInputDialog.initialWidth = nameInputDialog.text.width + 20; + nameInputDialog.width = nameInputDialog.initialWidth; + nameInputDialog.text.opacity = 0;//Just a spacer } } -//only floods up and right, to see if it can find adjacent same-typed tiles -function floodMoveCheck(xIdx, yIdx, type) +//only floods up and right, to see if it can find adjacent same-typed blocks +function floodMoveCheck(column, row, type) { - if(xIdx >= maxX || xIdx < 0 || yIdx >= maxY || yIdx < 0) + if(column >= maxColumn || column < 0 || row >= maxRow || row < 0) return false; - if(board[index(xIdx, yIdx)] == null) + if(board[index(column, row)] == null) return false; - var myType = board[index(xIdx, yIdx)].type; + var myType = board[index(column, row)].type; if(type == myType) return true; - return floodMoveCheck(xIdx + 1, yIdx, myType) || - floodMoveCheck(xIdx, yIdx - 1, board[index(xIdx,yIdx)].type); + return floodMoveCheck(column + 1, row, myType) || + floodMoveCheck(column, row - 1, board[index(column,row)].type); } -function createBlock(xIdx,yIdx){ +function createBlock(column,row){ // Note that we don't wait for the component to become ready. This will // only work if the block QML is a local file. Otherwise the component will // not be ready immediately. There is a statusChanged signal on the @@ -190,14 +185,14 @@ function createBlock(xIdx,yIdx){ } dynamicObject.type = Math.floor(Math.random() * 3); dynamicObject.parent = gameCanvas; - dynamicObject.x = xIdx*gameCanvas.tileSize; - dynamicObject.targetX = xIdx*gameCanvas.tileSize; - dynamicObject.targetY = yIdx*gameCanvas.tileSize; - dynamicObject.width = gameCanvas.tileSize; - dynamicObject.height = gameCanvas.tileSize; + dynamicObject.x = column*gameCanvas.blockSize; + dynamicObject.targetX = column*gameCanvas.blockSize; + dynamicObject.targetY = row*gameCanvas.blockSize; + dynamicObject.width = gameCanvas.blockSize; + dynamicObject.height = gameCanvas.blockSize; dynamicObject.spawned = true; - board[index(xIdx,yIdx)] = dynamicObject; - }else{//isError or isLoading + board[index(column,row)] = dynamicObject; + }else{ print("error loading block component"); print(component.errorsString()); return false; @@ -211,14 +206,14 @@ function saveHighScore(name) { //OfflineStorage var db = openDatabaseSync("SameGameScores", "1.0", "Local SameGame High Scores",100); var dataStr = "INSERT INTO Scores VALUES(?, ?, ?, ?)"; - var data = [name, gameCanvas.score, maxX+"x"+maxY ,Math.floor(timer/1000)]; + var data = [name, gameCanvas.score, maxColumn+"x"+maxRow ,Math.floor(gameDuration/1000)]; db.transaction( function(tx) { tx.executeSql('CREATE TABLE IF NOT EXISTS Scores(name TEXT, score NUMBER, gridSize TEXT, time NUMBER)'); tx.executeSql(dataStr, data); //Only show results for the current grid size - var rs = tx.executeSql('SELECT * FROM Scores WHERE gridSize = "'+maxX+"x"+maxY+'" ORDER BY score desc LIMIT 10'); + var rs = tx.executeSql('SELECT * FROM Scores WHERE gridSize = "'+maxColumn+"x"+maxRow+'" ORDER BY score desc LIMIT 10'); var r = "\nHIGH SCORES for this grid size\n\n" for(var i = 0; i < rs.rows.length; i++){ r += (i+1)+". " + rs.rows.item(i).name +' got ' @@ -233,7 +228,7 @@ function saveHighScore(name) { function sendHighScore(name) { var postman = new XMLHttpRequest() var postData = "name="+name+"&score="+gameCanvas.score - +"&gridSize="+maxX+"x"+maxY +"&time="+Math.floor(timer/1000); + +"&gridSize="+maxColumn+"x"+maxRow +"&time="+Math.floor(gameDuration/1000); postman.open("POST", scoresURL, true); postman.setRequestHeader("Content-Type", "application/x-www-form-urlencoded"); postman.onreadystatechange = function() { diff --git a/demos/declarative/samegame/samegame.qml b/demos/declarative/samegame/samegame.qml index 94f5c24..92201f5 100644 --- a/demos/declarative/samegame/samegame.qml +++ b/demos/declarative/samegame/samegame.qml @@ -9,85 +9,95 @@ Rectangle { SystemPalette { id: activePalette } Item { - width: parent.width; anchors.top: parent.top; anchors.bottom: toolBar.top + width: parent.width + anchors { top: parent.top; bottom: toolBar.top } Image { id: background - anchors.fill: parent; source: "SamegameCore/pics/background.png" + anchors.fill: parent + source: "SamegameCore/pics/background.png" fillMode: Image.PreserveAspectCrop - smooth: true } Item { id: gameCanvas property int score: 0 - property int tileSize: 40 + property int blockSize: 40 z: 20; anchors.centerIn: parent - width: parent.width - (parent.width % tileSize); - height: parent.height - (parent.height % tileSize); + width: parent.width - (parent.width % blockSize); + height: parent.height - (parent.height % blockSize); MouseArea { - id: gameMR anchors.fill: parent; onClicked: Logic.handleClick(mouse.x,mouse.y); } } } Dialog { id: dialog; anchors.centerIn: parent; z: 21 } + Dialog { - id: scoreName; anchors.centerIn: parent; z: 22; + id: nameInputDialog + property int initialWidth: 0 - Behavior on width {NumberAnimation{} enabled: initialWidth!=0} + + anchors.centerIn: parent + z: 22; + + Behavior on width { + NumberAnimation {} + enabled: initialWidth != 0 + } + Text { - id: spacer - anchors.left: scoreName.left - anchors.leftMargin: 20 - anchors.verticalCenter: parent.verticalCenter + id: dialogText + anchors { left: nameInputDialog.left; leftMargin: 20; verticalCenter: parent.verticalCenter } text: "You won! Please enter your name: " } + TextInput { - id: editor + id: nameInputText + anchors { verticalCenter: parent.verticalCenter; left: dialogText.right } + focus: true + onTextChanged: { - var newWidth = editor.width + spacer.width + 40; - if((newWidth > scoreName.width && newWidth < screen.width) - || (scoreName.width > scoreName.initialWidth)) - scoreName.width = newWidth; + var newWidth = nameInputText.width + dialogText.width + 40; + if ( (newWidth > nameInputDialog.width && newWidth < screen.width) + || (nameInputDialog.width > nameInputDialog.initialWidth) ) + nameInputDialog.width = newWidth; } onAccepted: { - if(scoreName.opacity==1&&editor.text!="") - Logic.saveHighScore(editor.text); - scoreName.forceClose(); + if (nameInputDialog.opacity == 1 && nameInputText.text != "") + Logic.saveHighScore(nameInputText.text); + nameInputDialog.forceClose(); } - anchors.verticalCenter: parent.verticalCenter - focus: true - anchors.left: spacer.right } } Rectangle { id: toolBar + width: parent.width; height: 32 color: activePalette.window - height: 32; width: parent.width anchors.bottom: screen.bottom Button { - id: btnA; text: "New Game"; onClicked: Logic.initBoard(); - anchors.left: parent.left; anchors.leftMargin: 3 - anchors.verticalCenter: parent.verticalCenter + id: newGameButton + anchors { left: parent.left; leftMargin: 3; verticalCenter: parent.verticalCenter } + text: "New Game" + onClicked: Logic.startNewGame() } Button { - id: btnB; text: "Quit"; onClicked: Qt.quit(); - anchors.left: btnA.right; anchors.leftMargin: 3 - anchors.verticalCenter: parent.verticalCenter + text: "Quit" + anchors { left: newGameButton.right; leftMargin: 3; verticalCenter: parent.verticalCenter } + onClicked: Qt.quit(); } Text { id: score - text: "Score: " + gameCanvas.score; font.bold: true - anchors.right: parent.right; anchors.rightMargin: 3 - anchors.verticalCenter: parent.verticalCenter + anchors { right: parent.right; rightMargin: 3; verticalCenter: parent.verticalCenter } + text: "Score: " + gameCanvas.score + font.bold: true color: activePalette.windowText } } |