Adventures in Unity – 1.7b Highscores (In-Game Overview)



The unify community ‘Server Side Highscores’ article provided basic code for connecting to the server, downloading the current high score list and uploading new entries.

But no real framework to manage downloads & uploads, nothing to display highscores or to add new entries to the table.

Prior to using the unify community code, I implementing the dreamlo highscore system – I set this up by following the excellent you tube guide ‘[Unity Tutorial] Online Highscores 01 (dreamlo)‘ put together by Sebastian Lague.

While I wasn’t able to get the dreamlo system to work with WebGL games – I did borrow elements of the framework Sabastian demonstrated when constructing high score code for this game.

The final framework can be split into three basic sections;

  1. Backend high score management.
  2. Display current high scores.
  3. Add new high score.

The code itself is surprisingly extensive, so for this post I’ll try and provide a top level overview for each section & try to explain how they all fit together in a high level – Then, for the next few posts I’ll focus on each section in turn and explain in more detail.



1. Backend high score management;


HighScore (Component) – Holds both HighscoreController and HighscoreDisplay scripts

HighscoreController (script) – A singleton, this script contains methods to get the current highscore list from the server (used by HighScoreDisplay script), and add new highscore entries to the server (used by HighScoreAdd). Also contains a static array of type HighScore where the current list of highscores are held, and a static int lastHighScore which identifies the index of the last highscore added (set to -1 by default)

HighScore (Strut) – A simple object containing two variables, int score & string name. Used to hold the details of a single high score entry. A static list of these is maintained by the HighscoreController script.

GameController (script) – A currently very overloaded script. The original intend for this script was to manage the game states (title screen, in game, game over , new high score screen, display highscores, etc). However it currently also manages the player’s score, the title screen buttons and manages the various highscore states – It does this primarily through two methods;

CheckHighScore, which at game over, checks to see if the player’s score should be added to the highscore list – If the player has scored high, the script both sets the HighscoreController.lastHighScore int, and sets the game state to display the new high score screen.

A second method managed by GameController;  SetHighScore, called by the AddHighScore script once a new player names has been added, directly requests that the highscorecontroller add the new high score to the highscore list (locally and on the server) by calling highscorecontroller.AddNewHighScore, before passing control to the UpdateHighscore method, which changes the game state to Display the current highscore list.



2. Display High Scores;


HighScoreDisplay (script) – Attached to the HighScore component; this uses the HighScore (Strut) list in HighscoreController to populate a list of HighScorePanel (Panel)  when displaying the highscore list to the player. Also, every 30 seconds, it requests the HighscoreController to download an updated list of highscores.


HighScorePanel (prefab ) – This is a customised panel UI component. It has three Text UI children – PositionText, NameText ScoreText. The values are set by the HighScoreDisplay (script) and used to display the details of a single high score entry when displaying the highscore table.


HighScoreDisplay (Component) – An empty component, groups the UI elements used to display the high score screen.

HighScoreTextTop (Component ) – A Text UI element, child of the HighScoreDisplay (Component), used to display the title HIGH SCORE on the high score screen.

Scroll View (Component) – A ScrollView UI element, child of the HighScoreDisplay (Component), Used to hold up to 50 HighScorePanel (Panel) prefabs when displaying the highscore table.



3. Add High Score;


HighscoreAdd (Script) – Contains a number of methods referenced by the UI components of the New Highscore screen. These methods validate and process user input when adding a player new to a new highscore. Ensuring the players name only contains valid characters, switches text case, ensure the players name doesn’t exceed a maximum length putting in a dummy name should the player not enter anything at all – Finally, it calls the SetHighScore method in the gamecontroller script once the new name has been entered.


HighscoreAdd (Component) – An empty component, groups the UI elements used for the new highscore screen.

HighScoreTextTop (Component) – A Text UI element, child of the HighscoreAdd (Component), used to display the title NEW HIGH SCORE! on the add highscore screen.

Window (Component) – An empty component, child of the HighscoreAdd (Component), groups the UI elements used for the new high score screen.

InputField (Component) – An inputfield UI component, child of the window (component), used to display the players name when adding  new highscore. Players can also click directly onto the component and type their name using the computer’s keyboard.

Vertical Group (Component) – An empty component, child of the window (Component), groups and formats the UI elements used for the keyboard buttons on the new high score screen.

Grid (Component) – An empty component, child of the Vertical Group (Component), groups and formats the UI elements used for the keyboard buttons on the new high score screen.

GridCell-X (Component) – Button UI components, child of the Grid (Component). 40 of these operate as the buttons for a virtual keyboard that can be used to add a player name for a new highscore.


Play the game (WebGL)

Grab a copy of the project here




Next post: 1.7c Highscores (In-Game Backend)

Last post: 1.7a Highscores (Server Side MySQLi)

Contents page.



6 Replies to “Adventures in Unity – 1.7b Highscores (In-Game Overview)”

Leave a Reply

Fill in your details below or click an icon to log in: Logo

You are commenting using your account. Log Out /  Change )

Twitter picture

You are commenting using your Twitter account. Log Out /  Change )

Facebook photo

You are commenting using your Facebook account. Log Out /  Change )

Connecting to %s

%d bloggers like this: