Merge pull request #217 from UQcsse3200/team5-ui

Fix UI in Main Game

Author: zzkhangg

source/core/assets/images/main_game_background.png

@@ -429,22 +429,20 @@ public void create() {
             ServiceLocator.getAudioService().stopMusic();
             logger.info("主菜单音乐已停止");
         }
-        
+
         // Load assets (textures, sounds, etc.) before creating anything that needs them
         loadAssets();
         registerForCleanup();
 
         // Create the main UI entity that will handle area info, hotbar, and tower placement
         Entity ui = new Entity();
-        ui.addComponent(new GameAreaDisplay("Box Forest")); // Shows the game area's name
-        
+
         // 添加防御塔列表组件，但初始隐藏（如果是新游戏）
         TowerHotbarDisplay towerHotbar = new TowerHotbarDisplay();
         if (!hasExistingPlayer) {
             towerHotbar.setVisible(false); // 新游戏时隐藏，对话结束后显示
         }
         ui.addComponent(towerHotbar);
-        
         ui.addComponent(new com.csse3200.game.components.maingame.MainGameWin());
         SimplePlacementController placementController = new SimplePlacementController();
         ui.addComponent(placementController); // Handles user input for tower placement
@@ -471,7 +469,7 @@ public void create() {
 
         // Create background entity (renders behind everything)
         Entity background = new Entity();
-        background.addComponent(new com.csse3200.game.rendering.BackgroundRenderComponent("images/game background.jpg"));
+        background.addComponent(new com.csse3200.game.rendering.BackgroundRenderComponent("images/main_game_background.png"));
         background.setPosition(0, 0); // Set position at origin
         spawnEntity(background);
 
@@ -752,11 +750,11 @@ private Entity spawnPlayer() {
         // mapEditor = new com.csse3200.game.areas2.MapTwo.MapEditor2((TerrainComponent2)terrain, newPlayer);
         mapEditor = new MapEditor(terrain, newPlayer);
         mapEditor.generateEnemyPath(); // Generate fixed enemy path
-        
+
         // Set path layer opacity to 0.7 (70% opacity) for map1
         // 调整map1路径砖块的透明度为70%
         mapEditor.setPathLayerOpacity(0.7f);
-        
+
         // Uncomment if crystal spawning is needed:
         // mapEditor.spawnCrystal(); // Generate crystal
 
@@ -1106,7 +1104,7 @@ private void spawnIntroDialogue() {
                             // 对话结束后显示防御塔列表和播放背景音乐
                             showTowerUI();
                             playMusic();
-                            
+
                             if (MainGameScreen.ui != null) {
                                 MainGameScreen.ui.getEvents().trigger("startWave");
                             } else {

source/core/src/main/com/csse3200/game/areas/ForestGameArea.java

@@ -44,23 +44,17 @@ private void addActors() {
     table.setFillParent(true);
 
     // Create custom button style
-    TextButtonStyle customButtonStyle = UIStyleHelper.orangeButtonStyle();
+    TextButtonStyle customButtonStyle = UIStyleHelper.mainGameMenuButtonStyle();
     TextButton saveBtn = new TextButton("Save", customButtonStyle);
     TextButton mainMenuBtn = new TextButton("Exit", customButtonStyle);
     TextButton rankingBtn = new TextButton("Ranking", customButtonStyle);
     speedButton = new TextButton("Speed: 1x", customButtonStyle);
     TextButton startWaveButton = new TextButton("Start Wave", customButtonStyle);
 
     // Set button size
-    float buttonWidth = 120f;
+    float buttonWidth = 140f;
     float buttonHeight = 40f;
 
-    saveBtn.getLabel().setColor(Color.CYAN);
-    mainMenuBtn.getLabel().setColor(Color.CYAN);
-    rankingBtn.getLabel().setColor(Color.CYAN);
-    speedButton.getLabel().setColor(Color.CYAN);
-    startWaveButton.getLabel().setColor(Color.CYAN);
-    
     saveBtn.addListener(
       new ChangeListener() {
         @Override
@@ -117,13 +111,13 @@ public void changed(ChangeEvent event, Actor actor) {
 
     table.add(saveBtn).size(buttonWidth, buttonHeight).padTop(10f).padRight(10f);
     table.row();
-    table.add(mainMenuBtn).size(buttonWidth, buttonHeight).padTop(5f).padRight(10f);
+    table.add(mainMenuBtn).size(buttonWidth, buttonHeight).padTop(10f).padRight(10f);
     table.row();
-    table.add(rankingBtn).size(buttonWidth, buttonHeight).padTop(5f).padRight(10f);
+    table.add(rankingBtn).size(buttonWidth, buttonHeight).padTop(10f).padRight(10f);
     table.row();
-    table.add(speedButton).size(buttonWidth, buttonHeight).padTop(5f).padRight(10f);
+    table.add(speedButton).size(buttonWidth, buttonHeight).padTop(10f).padRight(10f);
     table.row();
-    table.add(startWaveButton).size(buttonWidth, buttonHeight).padTop(5f).padRight(10f);
+    table.add(startWaveButton).size(buttonWidth, buttonHeight).padTop(10f).padRight(10f);
 
     stage.addActor(table);
     applyUiScale();

source/core/src/main/com/csse3200/game/components/maingame/MainGameExitDisplay.java

@@ -64,8 +64,9 @@ private void addActors() {
         avatarImage = createAvatarImage(avatarId);
 
         // Create player name label
-        playerNameLabel = new Label(playerName, skin, "large");
-        playerNameLabel.setColor(Color.WHITE);
+        Label.LabelStyle labelStyle = new Label.LabelStyle(skin.get(Label.LabelStyle.class));
+        labelStyle.fontColor = Color.WHITE;
+        playerNameLabel = new Label(playerName, labelStyle);
 
         // Add padding and positioning
         table.pad(20f, 20f, 0f, 20f);

source/core/src/main/com/csse3200/game/components/maingame/PlayerNameDisplay.java

@@ -1,5 +1,7 @@
 package com.csse3200.game.components.player;
 
+import com.badlogic.gdx.graphics.Color;
+import com.badlogic.gdx.graphics.Pixmap;
 import com.badlogic.gdx.graphics.Texture;
 import com.badlogic.gdx.graphics.g2d.SpriteBatch;
 import com.badlogic.gdx.graphics.g2d.TextureRegion;
@@ -25,13 +27,11 @@
  */
 public class PlayerStatsDisplay extends UIComponent {
   Table table;
-  private Image heartImage;
-  private Label healthLabel;
   private final Map<CurrencyType, Image> currencyImages = new EnumMap<>(CurrencyType.class);
   private final Map<CurrencyType, Label> currencyLabels = new EnumMap<>(CurrencyType.class);
   private Image scoreImage;
   private Label scoreLabel;
-
+  // private Texture bgTexture;
   /**
    * Creates reusable ui styles and adds actors to the stage.
    */
@@ -40,7 +40,6 @@ public void create() {
     super.create();
     addActors();
 
-    entity.getEvents().addListener("updateHealth", this::updatePlayerHealthUI);
     entity.getEvents().addListener("updateCurrencyUI", this::updatePlayerCurrencyAmountUI);
     entity.getEvents().addListener("updateScore", this::updatePlayerScoreUI);
   }
@@ -52,29 +51,23 @@ public void create() {
   private void addActors() {
     table = new Table();
     table.top().left();
+    table.setFillParent(true);
+    table.padTop(60f).padLeft(5f);
+
     float screenWidth = stage.getWidth();
     float screenHeight = stage.getHeight();
-    float rowWidth =  screenWidth * 0.03f;
-
-    // Heart image
-    heartImage = new Image(ServiceLocator.getResourceService().getAsset("images/heart.png", Texture.class));
-
-    // Health text
-    int health = entity.getComponent(PlayerCombatStatsComponent.class).getHealth();
-    CharSequence healthText = String.format("Health: %d", health);
-    healthLabel = new Label(healthText, skin, "large");
 
     // Score image (trophy)
+    float scoreSideLength = 64f;
     scoreImage = new Image(ServiceLocator.getResourceService().getAsset("images/score_trophy.png", Texture.class));
 
+    Label.LabelStyle labelStyle = new Label.LabelStyle(skin.get(Label.LabelStyle.class));
+    labelStyle.fontColor = Color.WHITE;
+    labelStyle.font = skin.getFont("segoe_ui");
     // Score text
     int score = 0; //entity.getComponent(ScrapStatsComponent.class).getScrap();
     CharSequence scoreText = String.format("Score: %d", score);
-    scoreLabel = new Label(scoreText, skin, "large");
-
-    table.add(heartImage).size(rowWidth).pad(5);
-    table.add(healthLabel);
-    table.row();
+    scoreLabel = new Label(scoreText, labelStyle);
 
     // Dynamically render currencies
     for (CurrencyType currencyType : CurrencyType.values()) {
@@ -86,46 +79,43 @@ private void addActors() {
       );
       int currencyAmount = entity.getComponent(CurrencyManagerComponent.class).getCurrencyAmount(currencyType);
       Label currencyLabel = new Label(
-              String.format("%s%n%d", currencyType.getDisplayName(), currencyAmount),
-              skin,
-              "large"
-      );
+              String.format("%s%n%d", currencyType.getDisplayName(), currencyAmount), labelStyle);
 
       currencyImages.put(currencyType, currencyImage);
       currencyLabels.put(currencyType, currencyLabel);
 
-      table.add(currencyImage).size(rowWidth).pad(5);
+      float sideLength = 64f;
+      table.add(currencyImage).size(sideLength).pad(5);
       table.add(currencyLabel).left();
       table.row();
     }
 
     // Score text position
     table.row();
-    table.add(scoreImage).size(rowWidth).pad(5);
+    table.add(scoreImage).size(scoreSideLength).pad(5);
     table.add(scoreLabel).left().padTop(5f);
-
-    // set table’s background
-    Texture bgTexture = ServiceLocator.getResourceService()
-            .getAsset("images/Main_Menu_Button_Background.png", Texture.class);
-    Drawable background = new TextureRegionDrawable(new TextureRegion(bgTexture));
-    table.setBackground(background);
-
-    // Wrap table inside a container for background + positioning
-    Container<Table> container = new Container<>(table);
-    container.align(Align.topLeft); // align the content inside
-    container.top().left();         // align the container itself
-    container.padTop(60f);
-
-    // Add container to root layout
-    Table rootTable = new Table();
-    rootTable.top().left(); // this line ensures it's anchored to top-left
-    rootTable.setFillParent(true);
-    rootTable.add(container)
-            .width(screenWidth * 0.15f)
-            .height(screenHeight * 0.3f)
-            .left().top();
-
-    stage.addActor(rootTable);
+//    bgTexture = buildSolidTexture(new Color(0.15f, 0.15f, 0.18f, 0.6f)); // 60% opacity
+//    Drawable background = new TextureRegionDrawable(new TextureRegion(bgTexture));
+//
+//    table.setBackground(background);
+//
+//    // Wrap table inside a container for background + positioning
+//    Container<Table> container = new Container<>(table);
+//    container.align(Align.topLeft); // align the content inside
+//    container.top().left();         // align the container itself
+//    container.padTop(60f);
+//
+//    // Add container to root layout
+//    Table rootTable = new Table();
+//    rootTable.top().left(); // this line ensures it's anchored to top-left
+//    rootTable.setFillParent(true);
+//    rootTable.add(container)
+//            .width(screenWidth * 0.15f)
+//            .height(screenHeight * 0.3f)
+//            .left().top();
+//
+//    stage.addActor(rootTable);
+    stage.addActor(table);
 
     applyUiScale();
   }
@@ -154,15 +144,6 @@ public void draw(SpriteBatch batch)  {
     // draw is handled by the stage
   }
 
-  /**
-   * Updates the player's health on the ui.
-   * @param health player health
-   */
-  public void updatePlayerHealthUI(int health) {
-    CharSequence text = String.format("Health: %d", health);
-    healthLabel.setText(text);
-  }
-
   /**
    * Updates the player's currency amount for certain type on the UI.
    * @param type currency type to render
@@ -184,12 +165,9 @@ private void updatePlayerScoreUI(int totalScore) {
     scoreLabel.setText(text);
   }
 
-
   @Override
   public void dispose() {
     super.dispose();
-    heartImage.remove();
-    healthLabel.remove();
 
     for (Image image : currencyImages.values()) {
       image.remove();

source/core/src/main/com/csse3200/game/components/player/PlayerStatsDisplay.java

@@ -56,8 +56,8 @@ public class MainGameScreen extends ScreenAdapter {
           "images/homebase1.png",
           "images/homebase2.png",
           "images/basement.png",
-          "images/Background4.png",
-          "images/re.gif"
+          "images/re.gif",
+          "images/main_game_background.png"
   };
 
   private static final Vector2 CAMERA_POSITION = new Vector2(7.5f, 7.5f);