《開(kāi)源精選》是我們分享Github、Gitee等開(kāi)源社區(qū)中優(yōu)質(zhì)項(xiàng)目的欄目，包括技術(shù)、學(xué)習(xí)、實(shí)用與各種有趣的內(nèi)容。本期推薦的是使用JavaFX / Kotlin開(kāi)發(fā)的2D和3D游戲引擎——FXGL。

FXGL是一個(gè)基于JavaFX的2D和3D游戲引擎，適合開(kāi)發(fā)任何類(lèi)型的2D游戲，包括橫向卷軸、平臺(tái)、街機(jī)、RPG等。并提供了大量的游戲示例來(lái)幫助我們掌握游戲開(kāi)發(fā)技能。

FXGL特性：

• 無(wú)需安裝，開(kāi)箱即用，支持Java 8-15、Win/Mac/Linux/Android 8+/iOS 11.0+/Web
• 簡(jiǎn)單干凈的API，比其他引擎更高效
• JavaFX的超集：無(wú)需學(xué)習(xí)新的UI API
• 真實(shí)世界的游戲開(kāi)發(fā)技術(shù)：實(shí)體組件、插值動(dòng)畫(huà)、粒子等等
• 游戲很容易打包成單個(gè)可執(zhí)行文件 .jar 或本機(jī)映像

依賴

Maven

<dependency>    <groupId>com.github.almasb</groupId>    <artifactId>fxgl</artifactId>    <version>11.17</version></dependency>

Gradle

compile 'com.github.almasb:fxgl:11.17'

簡(jiǎn)單示例：一個(gè)乒乓球游戲

默認(rèn)情況下，F(xiàn)XGL 將游戲大小設(shè)置為 800x600，這適用于我們的游戲。您可以通過(guò) 更改這些設(shè)置和各種其他設(shè)置settings.setXXX()?，F(xiàn)在，我們將只設(shè)置標(biāo)題并添加入口點(diǎn) - main()。

public class PongApp extends GameApplication {    @Override    protected void initSettings(GameSettings settings) {        settings.setTitle("Pong");    }    public static void main(String[] args) {        launch(args);    }}

接下來(lái)，我們將定義一些不言自明的常量。

private static final int PADDLE_WIDTH = 30;private static final int PADDLE_HEIGHT = 100;private static final int BALL_SIZE = 20;private static final int PADDLE_SPEED = 5;private static final int BALL_SPEED = 5;

我們有三個(gè)游戲?qū)ο螅貏e是兩個(gè)槳和一個(gè)球。FXGL 中的游戲?qū)ο蠓Q為Entity. 所以，讓我們定義我們的實(shí)體。

private Entity paddle1;private Entity paddle2;private Entity ball;

接下來(lái)，我們將查看輸入。與某些框架不同，不需要手動(dòng)查詢輸入狀態(tài)。在 FXGL 中，我們通過(guò)定義動(dòng)作（游戲應(yīng)該做什么）并將它們綁定到輸入觸發(fā)器（按下某物時(shí)）來(lái)處理輸入。例如：

@Overrideprotected void initInput() {    getInput().addAction(new UserAction("Up 1") {        @Override        protected void onAction() {            paddle1.translateY(-PADDLE_SPEED);        }    }, KeyCode.W);    // ...}

上面的意思是，當(dāng)W被按下時(shí)，paddle在 Y 軸上移動(dòng)-PADDLE_SPEED，這實(shí)際上意味著向上移動(dòng)槳。剩下的輸入：

getInput().addAction(new UserAction("Down 1") {    @Override    protected void onAction() {        paddle1.translateY(PADDLE_SPEED);    }}, KeyCode.S);getInput().addAction(new UserAction("Up 2") {    @Override    protected void onAction() {        paddle2.translateY(-PADDLE_SPEED);    }}, KeyCode.UP);getInput().addAction(new UserAction("Down 2") {    @Override    protected void onAction() {        paddle2.translateY(PADDLE_SPEED);    }}, KeyCode.DOWN);

我們現(xiàn)在將添加游戲變量來(lái)記錄玩家 1 和玩家 2 的分?jǐn)?shù)。我們可以使用int score1;. 但是，F(xiàn)XGL 提供了一個(gè)強(qiáng)大的屬性概念，它建立在 JavaFX 屬性之上。澄清一下，F(xiàn)XGL 中的每個(gè)變量都在內(nèi)部存儲(chǔ)為 JavaFX 屬性，因此是可觀察和可綁定的。我們聲明變量如下：

@Overrideprotected void initGameVars(Map vars) {    vars.put("score1", 0);    vars.put("score2", 0);}

FXGL 將根據(jù)默認(rèn)值推斷每個(gè)變量的類(lèi)型。在這種情況下 0 是 type int，因此score1將被分配int類(lèi)型。稍后我們將看到這些變量與原始 Java 類(lèi)型相比有多么強(qiáng)大。

@Overrideprotected void initGame() {    paddle1 = spawnBat(0, getHeight() / 2 - PADDLE_HEIGHT / 2);    paddle2 = spawnBat(getWidth() - PADDLE_WIDTH, getHeight() / 2 - PADDLE_HEIGHT / 2);    ball = spawnBall(getWidth() / 2 - BALL_SIZE / 2, getHeight() / 2 - BALL_SIZE / 2);}private Entity spawnBat(double x, double y) {    return Entities.builder()            .at(x, y)            .viewFromNodeWithBBox(new Rectangle(PADDLE_WIDTH, PADDLE_HEIGHT))            .buildAndAttach();}private Entity spawnBall(double x, double y) {    return Entities.builder()            .at(x, y)            .viewFromNodeWithBBox(new Rectangle(BALL_SIZE, BALL_SIZE))            .with("velocity", new Point2D(BALL_SPEED, BALL_SPEED))            .buildAndAttach();}

我們要求Entities建造者：

1. 在給定的 x, y 創(chuàng)建一個(gè)新實(shí)體
2. 使用我們提供的視圖
3. 從視圖生成邊界框
4. 將創(chuàng)建的實(shí)體添加到游戲世界中。
5. 添加了一個(gè)名為“速度”的 Point2D 類(lèi)型的新實(shí)體屬性

此后，我們?cè)O(shè)計(jì)了由兩個(gè)Text對(duì)象組成的 UI 。重要的是，我們將這些對(duì)象的 text 屬性綁定到我們之前創(chuàng)建的兩個(gè)變量。這是 FXGL 變量提供的強(qiáng)大功能之一。更具體地說(shuō)，當(dāng)score1更新時(shí)，textScore1UI 對(duì)象的文本將自動(dòng)更新。

@Overrideprotected void initUI() {    Text textScore1 = getUIFactory().newText("", Color.BLACK, 22);    Text textScore2 = getUIFactory().newText("", Color.BLACK, 22);    textScore1.setTranslateX(10);    textScore1.setTranslateY(50);    textScore2.setTranslateX(getWidth() - 30);    textScore2.setTranslateY(50);    textScore1.textProperty().bind(getGameState().intProperty("score1").asString());    textScore2.textProperty().bind(getGameState().intProperty("score2").asString());    getGameScene().addUINodes(textScore1, textScore2);}

這個(gè)游戲的最后一部分是更新滴答聲。通常，F(xiàn)XGL 游戲?qū)⑹褂肅omponents 為每一幀上的實(shí)體提供功能。所以根本不需要更新代碼。在這種情況下，作為一個(gè)簡(jiǎn)單的例子，我們將使用傳統(tǒng)的更新方法，如下所示：

@Overrideprotected void onUpdate(double tpf) {    Point2D velocity = ball.getObject("velocity");    ball.translate(velocity);    if (ball.getX() == paddle1.getRightX()            && ball.getY()  paddle1.getY()) {        ball.setProperty("velocity", new Point2D(-velocity.getX(), velocity.getY()));    }    if (ball.getRightX() == paddle2.getX()            && ball.getY()  paddle2.getY()) {        ball.setProperty("velocity", new Point2D(-velocity.getX(), velocity.getY()));    }    if (ball.getX() = getWidth()) {        getGameState().increment("score1", +1);        resetBall();    }    if (ball.getY() = getHeight()) {        ball.setY(getHeight() - BALL_SIZE);        ball.setProperty("velocity", new Point2D(velocity.getX(), -velocity.getY()));    }}

我們獲取球的“速度”屬性并使用它在每一幀上平移（移動(dòng)）球。然后，我們對(duì)球相對(duì)于游戲窗口和球拍的位置進(jìn)行各種檢查。如果球擊中窗口的頂部或底部，則我們?cè)?Y 軸上反轉(zhuǎn)。類(lèi)似地，如果球擊中槳，那么我們會(huì)反轉(zhuǎn) X 軸。最后，如果球未擊中球拍并擊中屏幕的一側(cè)，則相反地球拍得分并重置球。復(fù)位方法如下：

private void resetBall() {    ball.setPosition(getWidth() / 2 - BALL_SIZE / 2, getHeight() / 2 - BALL_SIZE / 2);    ball.setProperty("velocity", new Point2D(BALL_SPEED, BALL_SPEED));}

運(yùn)行后游戲?qū)⑷缦滤荆?/p>

更多示例

另外，F(xiàn)XGL還提供了大量的完整游戲示例，包括炸彈人、飛翔的小鳥(niǎo)、馬里奧、太空游俠、吃豆人等，如果你想學(xué)習(xí)如何開(kāi)發(fā)一個(gè)2D游戲，可以參考一下這些示例。

項(xiàng)目地址：
https://github.com/AlmasB/FXGLGames

開(kāi)源地址：github.com/AlmasB/FXGL

想學(xué)習(xí)更多關(guān)于游戲開(kāi)發(fā)的知識(shí)嗎？歡迎來(lái)火星時(shí)代教育，我們提供游戲設(shè)計(jì)培訓(xùn)、動(dòng)畫(huà)培訓(xùn)、UI設(shè)計(jì)培訓(xùn)等多種課程，點(diǎn)擊咨詢獲取更多信息！