Player Eviction Menu Sound and Animation Effect: Code Guideline Sprint4
The Design Guideline：Sprint4: Game Polishing
- Add various sound effects related to eviction menu.
- Various visual effects when using eviction menu.
- Add transition animation for Npcs
In sprint4, the function of the game has been basically completed, so we choose to polish the game to improve the player's playing experience. A series of sound and visual effect had been added in the game and the related code could be find in NpcEvictionMenuDisplayNew.java.
we add four different audio for using evicition menu, open and closed evicition menu,open and closed clues widow. And these sound effects are called through function MusicStuff.playMusic.
private static float bgHeight;
private static final String IMAGES_PATH = "images/eviction_menu/";
private static final String[] cardNames = {
private void addActors() {
new ChangeListener() {
@Override
public void changed(ChangeEvent changeEvent, Actor actor) {
private static final String buttonPath = "sounds/button.mp3";
private static final String[] cardNames = {
MusicStuff.playMusic("sounds/CloseEvictionMenu.wav", false);
logger.debug("Exit button clicked");
logger.info("exit to previous menu");
exitMenu();
public void changed(ChangeEvent changeEvent, Actor actor) {
buttons[i].addListener(new ChangeListener() {
@Override
public void changed(ChangeEvent changeEvent, Actor actor) {
MusicStuff.playMusic("sounds/OpenEvictionMenu.wav", false);
logger.debug("button" + index + "clicked");
createConfirmDialog(cardNames[index]);
}
public boolean touchDown(InputEvent event, float x, float y, int pointer, int bu
public void touchUp(InputEvent event, float x, float y, int pointer, int button) {
if (card.isOver()) {
MusicStuff.playMusic("sounds/OpenClueWindow.wav",false);
logger.debug("card" + index + "clicked up");
createCardInfo(cardNames[index]);
}
private void createCardInfo(String card_name) {
dialog.addListener(new InputListener() {
@Override
public boolean touchDown(InputEvent event, float x, float y, int pointer, int button) {
MusicStuff.playMusic("sounds/CloseClueWindow.wav",false);
logger.debug(card_name + " clicked");
dialog.remove();
return true;
}
});And there are three sound effects that appear when Wrongprompt box1, Wrongprompt box2 and Rightprompt box are triggered. Also called by function MusicStuff.playMusic.
public void changed(ChangeEvent changeEvent, Actor actor) {
okButton.addListener(new ChangeListener() {
@Override
public void changed(ChangeEvent changeEvent, Actor actor) {
MusicStuff.playMusic(buttonPath, false);
logger.debug("yes_button from " + button_name + " clicked");
dialog.remove();
private void createResultDialog(String button_name, NpcResultDialogType type) {
String backgroundPath, buttonPathDefault, buttonPathHover;
if (type == NpcResultDialogType.RIGHT_BOX) {
MusicStuff.playMusic("sounds/RightPromptBox1.wav",false);
backgroundPath = IMAGES_PATH + "rightBox.png";
buttonPathDefault = IMAGES_PATH + "rightBtn.png";
buttonPathHover = IMAGES_PATH + "rightBtn_H.png";
} else if (type == NpcResultDialogType.WRONG_BOX1) {
MusicStuff.playMusic("sounds/WrongPromptBox1.wav",false);
backgroundPath = IMAGES_PATH + "wrongBox1.png";
buttonPathDefault = IMAGES_PATH + "chanceBtn.png";
buttonPathHover = IMAGES_PATH + "chanceBtn_H.png";
} else {
MusicStuff.playMusic("sounds/WrongPromptBox2.wav",false);
backgroundPath = IMAGES_PATH + "wrongBox2.png";
buttonPathDefault = IMAGES_PATH + "chanceBtn2.png";
buttonPathHover = IMAGES_PATH + "chanceBtn2_H.png";
}On the other hand, we also added some visual effects to the menu, like fireworks when the rightprompt box appears and dark smoke for the wrongprompt box.To make these visual effects possible, we need to change some function from stageto window.
private void createResultDialog(String button_name, NpcResultDialogType type) {
logger.debug("create Result dialog from name: " + button_name + " type:" + type);
// if Lose, it will jump to ending screen, no need to create dialog
if (type == NpcResultDialogType.LOSE) {
@@ -469,20 +477,40 @@ private void createResultDialog(String button_name, NpcResultDialogType type) {
String backgroundPath, buttonPathDefault, buttonPathHover;
if (type == NpcResultDialogType.RIGHT_BOX) {
MusicStuff.playMusic("sounds/RightPromptBox1.wav",false);
backgroundPath = IMAGES_PATH + "rightBox.png";
buttonPathDefault = IMAGES_PATH + "rightBtn.png";
buttonPathHover = IMAGES_PATH + "rightBtn_H.png";
particleRightActor.setPosition((float) (bgWidth * (1200.33 / 1600)), (float) (bgHeight * 640.33 / 900));
particleRightActor.start();
window.addActor(particleRightActor);
particleRightActorTwo.setPosition((float) (bgWidth * (400.33 / 1600)), (float) (bgHeight * 640.33 / 900));
particleRightActorTwo.start();
window.addActor(particleRightActorTwo);
} else if (type == NpcResultDialogType.WRONG_BOX1) {
MusicStuff.playMusic("sounds/WrongPromptBox1.wav",false);
backgroundPath = IMAGES_PATH + "wrongBox1.png";
buttonPathDefault = IMAGES_PATH + "chanceBtn.png";
buttonPathHover = IMAGES_PATH + "chanceBtn_H.png";
particleWrongActor1.setPosition((float) (bgWidth * (1200.33 / 1600)), (float) (bgHeight * 640.33 / 900));
particleWrongActor1.start();
particleWrongActor2.setPosition((float) (bgWidth * (400.33 / 1600)), (float) (bgHeight * 640.33 / 900));
particleWrongActor2.start();
window.addActor(particleWrongActor1);
window.addActor(particleWrongActor2);
} else {
MusicStuff.playMusic("sounds/WrongPromptBox2.wav",false);
backgroundPath = IMAGES_PATH + "wrongBox2.png";
buttonPathDefault = IMAGES_PATH + "chanceBtn2.png";
buttonPathHover = IMAGES_PATH + "chanceBtn2_H.png";
particleSecondWrongActor1.setPosition((float) (bgWidth * (1200.33 / 1600)), (float) (bgHeight * 640.33 / 900));
particleSecondWrongActor1.start();
particleSecondWrongActor2.setPosition((float) (bgWidth * (400.33 / 1600)), (float) (bgHeight * 640.33 / 900));
particleSecondWrongActor2.start();
window.addActor(particleSecondWrongActor1);
window.addActor(particleSecondWrongActor2);
}
TextureRegionDrawable styleImage = new TextureRegionDrawable(
resourceService.getAsset(backgroundPath, Texture.class));
private void createResultDialog(String button_name, NpcResultDialogType type) {
Button okButton = createButton(buttonPathDefault, buttonPathHover);
if (type == NpcResultDialogType.RIGHT_BOX) {
dialog_size_x = (float) (bgWidth * (683.67 / 1600));
dialog_size_y = (float) (bgHeight * (416.24 / 900));
dialog.setSize(dialog_size_x, dialog_size_y);
private void createResultDialog(String button_name, NpcResultDialogType type) {
table.add(message).width(dialog_size_x * 3 / 5);
table.padLeft(dialog_size_x/6).padTop(dialog_size_y/6);
dialog.add(table);
} else {
dialog_size_x = (float) (bgWidth * (678.67 / 1600));
dialog_size_y = (float) (bgHeight * (382.38 / 900));
public void changed(ChangeEvent changeEvent, Actor actor) {
//when you select ok button
MusicStuff.playMusic(buttonPath,false);
dialog.remove();
particleWrongActor1.remove();
particleRightActor.remove();
particleRightActorTwo.remove();
particleWrongActor2.remove();
particleSecondWrongActor1.remove();
particleSecondWrongActor2.remove();
if (type == NpcResultDialogType.RIGHT_BOX)
handleWin();
}
});
dialog.addActor(okButton);
window.addActor(dialog);
}
private void exitMenu() {
window.remove();
}
public void setFindKey(Boolean findKey) {
public boolean touchDown(InputEvent event, float x, float y, int pointer, int bu
}
});
showWinContext(dialog);
window.addActor(dialog);
}Additionally, We added a new file to help with our visual implementation. ParticleActor.java
package com.deco2800.game.components.npcEvictionMenu;
import com.badlogic.gdx.Gdx;
import com.badlogic.gdx.graphics.g2d.Batch;
import com.badlogic.gdx.graphics.g2d.ParticleEffect;
import com.badlogic.gdx.scenes.scene2d.Actor;
public class ParticleActor extends Actor {
private ParticleEffect particleEffect;
public ParticleActor(String path) {
super();
particleEffect = new ParticleEffect();
particleEffect.load(Gdx.files.internal(path), Gdx.files.internal("data/"));
}
@Override
public void setPosition(float x, float y) {
particleEffect.setPosition(x, y);
}
@Override
public void draw(Batch batch, float parentAlpha) {
particleEffect.draw(batch);
}
@Override
public void act(float delta) {
super.act(delta);
particleEffect.update(delta);
}
public void start(){
particleEffect.start();
}
}Add a new window to play the trans animation, bringing players a better game experience. In creatTransDialog, the function resourceService.getAsset is used to call the animation. And which animation is called is determined according to the name of the Npc and the result of the player's choice.
private void creatTransDialog(String button_name, NpcResultDialogType result) {
TextureRegionDrawable styleImage = new TextureRegionDrawable(
resourceService.getAsset(IMAGES_PATH + "transparentBg.png", Texture.class));
Window.WindowStyle windowStyle = new Window.WindowStyle(new BitmapFont(), Color.BLACK, styleImage);
Window dialog = new Window("", windowStyle); dialog.setModal(true); dialog.setFillParent(true);
dialog.addListener(new InputListener() {
@Override
public boolean touchDown(InputEvent event, float x, float y, int pointer, int button) {
dialog.remove();
return true;
}
});
Image background = new Image(
resourceService.getAsset(IMAGES_PATH + "transBg.png", Texture.class));
Image step1 = new Image(resourceService.getAsset(
IMAGES_PATH + button_name.toLowerCase() + "Trans1.png", Texture.class));
Image step2 = new Image(resourceService.getAsset(
IMAGES_PATH + button_name.toLowerCase() + "Trans2.png", Texture.class));
Image step3 = new Image(resourceService.getAsset(
IMAGES_PATH + button_name.toLowerCase() + "Trans3.png", Texture.class));
String resultImg = IMAGES_PATH + "wrongTrans.png";
if (Objects.equals(button_name, "Ares")) {
resultImg = IMAGES_PATH + "correctTrans.png";
}
Image step4 = new Image(
resourceService.getAsset(resultImg, Texture.class));
background.setFillParent(true);
dialog.addActor(background);
dialog.addActor(step1);
step1.addAction(Actions.alpha(0));
window.addActor(dialog);
SequenceAction overallSequence = new SequenceAction();
overallSequence.addAction(Actions.alpha(0));
overallSequence.addAction(Actions.fadeIn(1));
//All animations
RunnableAction show1 = new RunnableAction(); // Characters appear
show1.setRunnable(() -> {
step1.addAction(Actions.fadeIn(1));
});
overallSequence.addAction(show1);
overallSequence.addAction(Actions.delay(1));
RunnableAction show2 = new RunnableAction(); // Tied up npc
show2.setRunnable(() -> {
step1.remove();
dialog.addActor(step2);
});
overallSequence.addAction(show2);
overallSequence.addAction(Actions.delay(1));
RunnableAction show3 = new RunnableAction(); // Put down npc and Dragged it out
show3.setRunnable(() -> {
step2.remove();
dialog.addActor(step3);
SequenceAction actions = new SequenceAction();
actions.addAction(Actions.delay(1));
actions.addAction(Actions.moveTo(1000,10, 3));
actions.addAction(Actions.fadeOut(1));
step3.addAction(actions);
});
overallSequence.addAction(show3);
overallSequence.addAction(Actions.delay(2+3));
RunnableAction show4 = new RunnableAction(); // show the result
show4.setRunnable(() -> {
step3.remove();
dialog.addActor(step4);
SequenceAction actions = new SequenceAction();
actions.addAction(Actions.delay(3));
actions.addAction(Actions.fadeOut(2));
step4.addAction(actions);
});
overallSequence.addAction(show4);
overallSequence.addAction(Actions.delay(3));
overallSequence.addAction(Actions.fadeOut(2));
RunnableAction exit = new RunnableAction();
exit.setRunnable(() -> {
dialog.remove();
createResultDialog(button_name, result);
});
overallSequence.addAction(exit);
background.addAction(overallSequence);
}NpcEvictionMenuDisplayNew.java
