add main menu (WIP)

README.md

@@ -1,2 +1,3 @@
 https://kenmi-art.itch.io/cute-fantasy-rpg
 https://yubatake.bandcamp.com/album/jrpg-collection
+https://crusenho.itch.io/complete-ui-essential-pack

assets/ui/skin.atlas

@@ -0,0 +1,44 @@
+
+skin.png
+size: 1024, 1024
+format: RGBA8888
+filter: Nearest, Nearest
+repeat: none
+banner
+  rotate: false
+  xy: 4, 602
+  size: 632, 164
+  orig: 632, 164
+  offset: 0, 0
+  index: -1
+bar
+  rotate: false
+  xy: 4, 461
+  size: 107, 8
+  orig: 107, 8
+  offset: 0, 0
+  index: -1
+bar_frame
+  rotate: false
+  xy: 644, 750
+  size: 130, 16
+  split: 3, 3, 3, 2
+  orig: 130, 16
+  offset: 0, 0
+  index: -1
+button
+  rotate: false
+  xy: 141, 578
+  size: 32, 16
+  split: 5, 5, 8, 6
+  orig: 32, 16
+  offset: 0, 0
+  index: -1
+frame
+  rotate: false
+  xy: 4, 477
+  size: 129, 117
+  split: 46, 49, 30, 54
+  orig: 129, 117
+  offset: 0, 0
+  index: -1

core/build.gradle

@@ -8,6 +8,10 @@ dependencies {
   api "com.badlogicgames.gdx:gdx-box2d:$gdxVersion"
   api "com.badlogicgames.gdx:gdx-freetype:$gdxVersion"
   api "com.badlogicgames.gdx:gdx:$gdxVersion"
+  // freetype font support for skins
+  api "com.github.raeleus.stripe:freetype:$stripeVersion"
+  // ten patch for better ProgressBar support (scene2d)
+  api "com.github.raeleus.TenPatch:tenpatch:$tenPatchVersion"
 
   if(enableGraalNative == 'true') {
     implementation "io.github.berstanio:gdx-svmhelper-annotations:$graalHelperVersion"

core/src/main/java/io/github/com/quillraven/asset/AssetService.java

@@ -7,7 +7,9 @@ import com.badlogic.gdx.audio.Music;
 import com.badlogic.gdx.graphics.g2d.TextureAtlas;
 import com.badlogic.gdx.maps.tiled.TiledMap;
 import com.badlogic.gdx.maps.tiled.TmxMapLoader;
+import com.badlogic.gdx.scenes.scene2d.ui.Skin;
 import com.badlogic.gdx.utils.Disposable;
+import com.ray3k.stripe.FreeTypeSkinLoader;
 
 public class AssetService implements Disposable {
     private final AssetManager assetManager;
@@ -15,6 +17,7 @@ public class AssetService implements Disposable {
     public AssetService(FileHandleResolver fileHandleResolver) {
         this.assetManager = new AssetManager(fileHandleResolver);
         this.assetManager.setLoader(TiledMap.class, new TmxMapLoader());
+        assetManager.setLoader(Skin.class, new FreeTypeSkinLoader(assetManager.getFileHandleResolver()));
     }
 
     public TiledMap load(MapAsset mapAsset) {
@@ -49,6 +52,14 @@ public class AssetService implements Disposable {
         this.assetManager.finishLoading();
     }
 
+    public void queue(SkinAsset skinAsset) {
+        this.assetManager.load(skinAsset.getPath(), Skin.class);
+    }
+
+    public Skin get(SkinAsset skinAsset) {
+        return this.assetManager.get(skinAsset.getPath(), Skin.class);
+    }
+
     public boolean update() {
         return this.assetManager.update();
     }

core/src/main/java/io/github/com/quillraven/asset/SkinAsset.java

@@ -0,0 +1,15 @@
+package io.github.com.quillraven.asset;
+
+public enum SkinAsset {
+    DEFAULT("skin.json");
+
+    private final String path;
+
+    SkinAsset(String skinJsonFile) {
+        this.path = "ui/" + skinJsonFile;
+    }
+
+    public String getPath() {
+        return path;
+    }
+}

core/src/main/java/io/github/com/quillraven/screen/GameScreen.java

@@ -5,6 +5,8 @@ import com.badlogic.ashley.core.Entity;
 import com.badlogic.ashley.core.EntitySystem;
 import com.badlogic.ashley.core.Family;
 import com.badlogic.ashley.utils.ImmutableArray;
+import com.badlogic.gdx.Gdx;
+import com.badlogic.gdx.Input;
 import com.badlogic.gdx.ScreenAdapter;
 import com.badlogic.gdx.maps.tiled.TiledMap;
 import com.badlogic.gdx.math.Vector2;
@@ -78,10 +80,20 @@ public class GameScreen extends ScreenAdapter {
         this.tiledService.setMap(startMap);
     }
 
+    @Override
+    public void hide() {
+        this.engine.removeAllEntities();
+    }
+
     @Override
     public void render(float delta) {
         delta = Math.min(1 / 30f, delta);
         engine.update(delta);
+
+        // TODO refactor
+        if (Gdx.input.isKeyJustPressed(Input.Keys.ESCAPE)) {
+            this.game.setScreen(MenuScreen.class);
+        }
     }
 
     @Override

core/src/main/java/io/github/com/quillraven/screen/LoadingScreen.java

@@ -5,6 +5,7 @@ import com.badlogic.gdx.ScreenAdapter;
 import io.github.com.quillraven.GdxGame;
 import io.github.com.quillraven.asset.AssetService;
 import io.github.com.quillraven.asset.AtlasAsset;
+import io.github.com.quillraven.asset.SkinAsset;
 
 public class LoadingScreen extends ScreenAdapter {
 
@@ -21,6 +22,7 @@ public class LoadingScreen extends ScreenAdapter {
         for (AtlasAsset atlasAsset : AtlasAsset.values()) {
             assetService.queue(atlasAsset);
         }
+        assetService.queue(SkinAsset.DEFAULT);
     }
 
     @Override
@@ -30,11 +32,12 @@ public class LoadingScreen extends ScreenAdapter {
             createScreens();
             this.game.removeScreen(this);
             this.dispose();
-            this.game.setScreen(GameScreen.class);
+            this.game.setScreen(MenuScreen.class);
         }
     }
 
     private void createScreens() {
         this.game.addScreen(new GameScreen(this.game));
+        this.game.addScreen(new MenuScreen(this.game));
     }
 }

core/src/main/java/io/github/com/quillraven/screen/MenuScreen.java

@@ -0,0 +1,131 @@
+package io.github.com.quillraven.screen;
+
+import com.badlogic.gdx.Gdx;
+import com.badlogic.gdx.InputMultiplexer;
+import com.badlogic.gdx.ScreenAdapter;
+import com.badlogic.gdx.scenes.scene2d.InputEvent;
+import com.badlogic.gdx.scenes.scene2d.Stage;
+import com.badlogic.gdx.scenes.scene2d.ui.Image;
+import com.badlogic.gdx.scenes.scene2d.ui.Label;
+import com.badlogic.gdx.scenes.scene2d.ui.ProgressBar;
+import com.badlogic.gdx.scenes.scene2d.ui.Skin;
+import com.badlogic.gdx.scenes.scene2d.ui.Table;
+import com.badlogic.gdx.scenes.scene2d.ui.TextButton;
+import com.badlogic.gdx.scenes.scene2d.utils.ClickListener;
+import com.badlogic.gdx.utils.Align;
+import com.badlogic.gdx.utils.viewport.FitViewport;
+import com.badlogic.gdx.utils.viewport.Viewport;
+import io.github.com.quillraven.GdxGame;
+import io.github.com.quillraven.asset.SkinAsset;
+
+public class MenuScreen extends ScreenAdapter {
+
+    private final GdxGame game;
+    private final Stage stage;
+    private final Skin skin;
+    private final Viewport uiViewport;
+    private final InputMultiplexer inputMultiplexer;
+
+    public MenuScreen(GdxGame game) {
+        this.game = game;
+        this.uiViewport = new FitViewport(800f, 450f);
+        this.stage = new Stage(uiViewport, game.getBatch());
+        this.skin = game.getAssetService().get(SkinAsset.DEFAULT);
+        this.inputMultiplexer = game.getInputMultiplexer();
+    }
+
+    @Override
+    public void resize(int width, int height) {
+        uiViewport.update(width, height, true);
+    }
+
+    @Override
+    public void show() {
+        this.inputMultiplexer.clear();
+        this.inputMultiplexer.addProcessor(stage);
+
+        menuUI();
+    }
+
+    @Override
+    public void hide() {
+        this.stage.clear();
+    }
+
+    private void menuUI() {
+        Table table = new Table();
+        table.setFillParent(true);
+
+        Image image = new Image(skin, "banner");
+        table.add(image);
+
+        table.row();
+        Table table1 = new Table();
+        table1.setBackground(skin.getDrawable("frame"));
+        table1.padLeft(40.0f);
+        table1.padRight(40.0f);
+        table1.padTop(25.0f);
+        table1.padBottom(20.0f);
+
+        TextButton textButton = new TextButton("Start Game", skin);
+        textButton.addListener(new ClickListener() {
+            @Override
+            public void clicked(InputEvent event, float x, float y) {
+                game.setScreen(GameScreen.class);
+            }
+        });
+        table1.add(textButton);
+
+        table1.row();
+        Table table2 = new Table();
+
+        Label label = new Label("Music Volume", skin);
+        label.setColor(skin.getColor("sand"));
+        table2.add(label);
+
+        table2.row();
+        ProgressBar progressBar = new ProgressBar(0.0f, 100.0f, 1.0f, false, skin);
+        table2.add(progressBar);
+        table1.add(table2).padTop(10.0f);
+
+        table1.row();
+        table2 = new Table();
+
+        label = new Label("Sound Volume", skin);
+        label.setColor(skin.getColor("sand"));
+        table2.add(label);
+
+        table2.row();
+        progressBar = new ProgressBar(0.0f, 100.0f, 1.0f, false, skin);
+        table2.add(progressBar);
+        table1.add(table2).padTop(10.0f);
+
+        table1.row();
+        textButton = new TextButton("Quit Game", skin);
+        textButton.addListener(new ClickListener() {
+            @Override
+            public void clicked(InputEvent event, float x, float y) {
+                Gdx.app.exit();
+            }
+        });
+        table1.add(textButton).padTop(10.0f);
+        table.add(table1).align(Align.top).expandY().padTop(20f);
+
+        table.row();
+        label = new Label("by Quillraven 2025", skin, "small");
+        label.setColor(skin.getColor("white"));
+        table.add(label).padRight(5.0f).padBottom(5f).expand().align(Align.bottomRight);
+        stage.addActor(table);
+    }
+
+    @Override
+    public void render(float delta) {
+        stage.act(delta);
+        stage.draw();
+    }
+
+    @Override
+    public void dispose() {
+        stage.dispose();
+    }
+}

gradle.properties

@@ -8,3 +8,5 @@ enableGraalNative=false
 graalHelperVersion=2.0.1
 gdxVersion=1.13.5
 projectVersion=1.0.0
+stripeVersion=2.0.0
+tenPatchVersion=5.2.3