Qt是一個跨平臺框架，通常用作圖形工具包，它不僅創(chuàng)建CLI應(yīng)用程序中非常有用。而且它也可以在三種主要的臺式機(jī)操作系統(tǒng)以及移動操作系統(tǒng)（如Symbian，Nokia Belle，Meego Harmattan，MeeGo或BB10）以及嵌入式設(shè)備，Android（Necessitas）和iOS的端口上運(yùn)行。現(xiàn)在我們?yōu)槟闾峁┝嗣赓M(fèi)的試用版。

下載Qt6最新試用版

Qt組件推薦：

現(xiàn)在我們已經(jīng)編寫了一些類型，讓我們開始編寫游戲。

第一項任務(wù)是生成游戲塊。每次單擊“新建游戲”按鈕時，游戲畫布上都會填充一組新的隨機(jī)塊。由于我們需要為每個新游戲動態(tài)生成新塊，因此我們無法使用Repeater來定義塊。相反，我們將使用JavaScript創(chuàng)建塊。

這是JavaScript代碼，用于生成包含在新文件中的塊samegame.js。該代碼在下面說明。

var blockSize = 40;
var maxColumn = 10;
var maxRow = 15;
var maxIndex = maxColumn * maxRow;
var board = new Array(maxIndex);
var component;

//Index function used instead of a 2D array
function index(column, row) {
    return column + (row * 
}

function startNewGame() {
    //Delete blocks from previous game
    for (var i = 0; i < maxIndex; i++) {
        if (board[i] != null)
            board[i].destroy
    }

    //Calculate board size
    maxColumn = Math.floor(background.width / blockSize);
    maxRow = Math.floor(background.height / blockSize);
    maxIndex = maxRow * maxColumn;

    //Initialize Board
    board = new Array(maxIndex);
    for (var column = 0; column < maxColumn; column++) {
        for (var row = 0; row < maxRow; row++) {
            board[index(column, row)] = null;
            createBlock(column, row);
        }
    }
}

function createBlock(column, row) {
    if (component == null)
        component = Qt.createComponent("Block.qml");

    // Note that if Block.qml was not a local file, component.status would be
    // Loading and we should wait for the component's statusChanged() signal to
    // know when the file is downloaded and ready before calling createObject().
    if (component.status == Component.Ready) {
        var dynamicObject = component.createObject(background);
        if (dynamicObject == null) {
            console.log("error creating block");
            console.log(component.errorString());
            return false;
        }
        dynamicObject.x = column * blockSize;
        dynamicObject.y = row * blockSize;
        dynamicObject.width = blockSize;
        dynamicObject.height = blockSize;
        board[index(column, row)] = dynamicObject;
    } else {
        console.log("error loading block component");
        console.log(component.errorString());
        return false;
    }
    return true;
}

該startNewGame()函數(shù)刪除在先前游戲中創(chuàng)建的塊，并計算填充新游戲的游戲窗口所需的塊的行數(shù)和列數(shù)。然后，它創(chuàng)建一個數(shù)組來存儲所有游戲塊，并調(diào)用createBlock()創(chuàng)建足夠的塊來填充游戲窗口。

 createBlock()函數(shù)從Block.qml文件創(chuàng)建一個塊，然后將新塊移動到其在游戲畫布上的位置。這涉及幾個步驟：

• 調(diào)用Qt.createComponent（）從中生成類型Block.qml。如果組件已準(zhǔn)備就緒，我們可以調(diào)用createObject()創(chuàng)建該Block項目的實例。
• 如果createObject()返回null（即，加載對象時發(fā)生錯誤），則打印錯誤信息。
• 將模塊放置在板上的位置，然后設(shè)置其寬度和高度。另外，將其存儲在blocks數(shù)組中以備將來參考。
• 最后，如果由于某種原因（例如，文件丟失）而無法加載組件，則將錯誤信息打印到控制臺。

將JavaScript組件連接到QML

現(xiàn)在，我們需要samegame.js從QML文件中調(diào)用JavaScript代碼。為此，我們添加以下行samegame.qml，將JavaScript文件作為模塊導(dǎo)入到該行：

import "samegame.js" as SameGame

這使我們可以samegame.js使用“ SameGame”作為前綴來引用任何函數(shù)：例如SameGame.startNewGame()或SameGame.createBlock()。這意味著我們現(xiàn)在可以將New Game按鈕的onClicked處理程序連接到該startNewGame()函數(shù)，如下所示：

 Button {
            anchors { left: parent.left; verticalCenter: parent.verticalCenter }
            text: "New Game"
            onClicked: SameGame.startNewGame()
        }

因此，當(dāng)您單擊“新建游戲”按鈕時，將startNewGame()被調(diào)用并生成一個塊字段，如下所示：

現(xiàn)在，我們有了一個方塊屏幕，我們可以開始添加游戲機(jī)制了。