Displaying Status Effect UI

Combat Stats Display

The CombatStatsDisplay class is responsible for visualizing player and enemy stats during combat, including health, hunger, experience, and status effects.

Key Methods

updateStatusEffectUI

This method is responsible for displaying the status effect bar and label when a player is afflicted with a status effect.

public void updateStatusEffectUI(CombatStatsComponent.StatusEffect statusEffect) {
    String statusFilePath = String.format("images/statuses/%s_stat.png", statusEffect.name().toLowerCase());
    statusEffectImage = new Image(ServiceLocator.getResourceService().getAsset(statusFilePath, Texture.class));
    statusTable = new Table();
    statusTable.add(statusEffectImage);
    statusTable.top().left();
    statusTable.row();

    String statusMessage = String.format("You are currently %s", statusEffect.name().toLowerCase());
    statusEffectLabel = new Label(statusMessage, skin, "large");
    statusTable.add(statusEffectLabel);
    statusTable.setFillParent(true);
    statusTable.padTop(tableTopPadding).padLeft(tableLeftPadding);
    
    // Add hover listener for status effect description
    statusTable.addListener(new InputListener() {
        @Override
        public boolean mouseMoved(InputEvent event, float x, float y) {
            setTextForStatusEffectHint();
            return true;
        }
        
        @Override
        public void exit(InputEvent event, float x, float y, int pointer, Actor fromActor) {
            hoverTextTable.setVisible(false);
            backgroundImage.setVisible(false);
        }
    });

    stage.addActor(statusTable);
}

removeStatusUI

This method removes the status effect bar and text from the combat screen when the effect wears off.

private void removeStatusUI() {
    statusTable.remove();
}

Usage

To use the CombatStatsDisplay class:

1. Create an instance of CombatStatsDisplay with player and enemy CombatStatsComponent objects:

CombatStatsDisplay display = new CombatStatsDisplay(playerStats, enemyStats);

2. Call the create() method to initialize the display:

display.create();

3. The display will automatically update when changes occur to player or enemy stats, or when status effects are added or removed.

4. To manually update specific parts of the display, you can call the following methods:

display.updateHealthUI(playerStats, enemyStats);
display.updatePlayerExperienceUI(playerStats);
display.updatePlayerHungerUI(playerStats, enemyStats);

5. Status effects are automatically displayed when added to the player's CombatStatsComponent and removed when they wear off.

Status Effect Images

The following status effect images are used in the game:

• Confusion source/core/assets/images/confused_stat.png:

• Shocked source/core/assets/images/shocked_stat.png:

• Poisoned source/core/assets/images/poisoned_stat.png:

• Bleeding source/core/assets/images/bleeding_stat.png:

Class Diagram

classDiagram
    class CombatStatsDisplay {
        -CombatStatsComponent playerStats
        -CombatStatsComponent enemyStats
        -Image playerHealthImage
        -Image playerHungerImage
        -Image enemyHealthImage
        -Image xpImage
        -Image statusEffectImage
        -Label playerHealthLabel
        -Label playerHungerLabel
        -Label enemyHealthLabel
        -Label experienceLabel
        -Label statusEffectLabel
        +create()
        +updateHealthUI(playerStats, enemyStats)
        +updatePlayerExperienceUI(playerStats)
        +updatePlayerHungerUI(playerStats, enemyStats)
        +updateStatusEffectUI(statusEffect)
        -removeStatusUI()
        -createTextForHints()
        -createBackgroundForHints()
        -setTextForStatusEffectHint()
    }
    CombatStatsDisplay --|> UIComponent

Loading

Sequence Diagrams

Adding Status Effect UI

sequenceDiagram
    participant NPC
    participant PlayerEntity
    participant CombatStatsComponent
    participant CombatStatsDisplay
    NPC->>PlayerEntity: Apply status effect
    PlayerEntity->>CombatStatsComponent: addStatusEffect(effect)
    CombatStatsComponent->>CombatStatsDisplay: trigger("statusEffectAdded", effect)
    CombatStatsDisplay->>CombatStatsDisplay: updateStatusEffectUI(effect)
    CombatStatsDisplay->>Stage: addActor(statusTable)

Loading

Removing Status Effect UI

sequenceDiagram
    participant PlayerEntity
    participant CombatStatsComponent
    participant CombatStatsDisplay
    PlayerEntity->>CombatStatsComponent: removeStatusEffect(effect)
    CombatStatsComponent->>CombatStatsDisplay: trigger("statusEffectRemoved")
    CombatStatsDisplay->>CombatStatsDisplay: removeStatusUI()
    CombatStatsDisplay->>Stage: remove(statusTable)

Loading

Testing

Due to the nature of UI components, testing for this feature was primarily conducted through visual testing. A detailed testing plan can be found in the Combat Visual Asset Testing Plan. Testing was completed for all three boss encounters, with a focus on the Kanga boss for demonstration purposes.