Skip to content

Map Change Cutscene

Jonoym edited this page Oct 4, 2021 · 2 revisions

Map Change Cutscene

Before the current implementation, when the player teleports between the levels, the screen will freeze while the new area and entities load in. To create a smoother transition, a CutsceneScreen class which is a UI component has been added to help with this. To keep with the theme that is currently being used during the cutscenes - black bars slide in and out, the CutsceneScreen screen class uses this method to cover the entire screen.

Implementation

The cutscene screen will be directly called from the TeleportComponent class component that will be added to the teleportation pad. Once the player has been in contact with the pad, the screen will begin to fade in. The sliding in of the black screen will require all of the other UI components such as the Health Bar and Exit Button to be hidden from view. The black box will enter and exit through the top of the screen.

To ensure that the black screen is in full view of the screen before the map changes, a buffer of 1 second allows the screen to unfold before beginning the transition. When loading the new map, the map will load in with the black screen already covering the screen instead of having the map flash on.

Architecture

Reasons behind this architecture: Although this uses somewhat of singleton design, it did not make sense to store an instance of the CutsceneScreen class in any of the classes that will call on it. The changing of the screen could happen in a variety of different classes and storing it in each of them would not be feasible and would overall increase the unnecessary coupling between components of the system.

UML Class Diagram

Shown below is how the components will directly interact with each other in the case of a teleport between game areas. Once the player has touched an entity containing the TeleportComponent then the collision that occurs will call the changing of the game to a new level as well as the sliding in of the map change screen.

image

Sequence Diagram

Below is a very simple sequence diagram showing an interaction between the Teleport Pad and the Player as well as the function calls that cause the changing of the map. Once the player has collided with the pad, the first function to be called will be one to slide the black screen down. The second one will occur at a delay with the use of Timer to ensure that the black screen has been completely covered while the previous map is being disposed of and the new map is being loaded in.

image

Implementing the Screen Change

The black screen could be used for a variety of different things, implementing it for the change of screen when the player quits from the main game could also be used. Due to the use of a ServiceLocator, the CutsceneScreen class can be obtained very easily as it is a component in the UIComponents this means that calling function on it can be done from every class.

Below is a snippet of the code used to call the function within the TelportComponent class. As shown below, the function will obtain the CutsceneScreen through the ServiceLocator. From there it will call the method setOpen() to begin the transition and finally, a Timer instance is created to change the level at a 1 second delay.

This piece of code could be added anywhere where required with a little bit of tweaking. The changes where this would need to occur would be the line where commented in the snippet below.

If implementing, the screen that will be shown after the transition will need to call setClosed() when it is first being loaded or else the black screen will remain permanently.

            CutsceneScreen screen = ServiceLocator.getEntityService()
                    .getUIEntity().getComponent(CutsceneScreen.class);
            screen.setOpen();
            Timer timer = new Timer();
            timer.schedule(new TimerTask() {
                @Override
                public void run() {
                    MainGameScreen.levelChange(); //Could be changed depending on use.
                }
            }, 1000);

Table of Contents

Home

Design Document

Design Document

Design Document

Game Engine

Getting Started

Entities and Components

Item Drops from Entities

Service Locator

Loading Resources

Logging

Unit Testing

Debug Terminal

Input Handling

UI

Animations

Audio

AI

Physics

Game Screens and Areas

Terrain

Map Generation

Concurrency & Threading

Settings

Troubleshooting

MacOS Setup Guide

Clone this wiki locally