Highscore table with GUILayout ?

Unity Engine
1

I’d like a nice highscore-table, but I can’t find a way to do it well.

Basically, I get data from WWW with the highscores, so it’s a long string:

Someone \t score \t date \n
Someonelse \t score \t date \n

and so on.

What’s the best way to put this into a nice table? I’ve tried a few, but before wasting any more time, I thought I’d ask because I’m sure someone else has solved this already.

2

This is what compound controls are for - they’re not anything physical in Unity, but just the concept of grouping a GUI control configuration into a static method that you can reuse.

I suggest you create a RowItem method composed of GUILayout labels and textboxes, you can have an ‘editable’ switch for each RowItem that will turn the labels into textfields and that can be used for new highscore entry.
(something like: if(isEditable){Show the TextField row}else{Show the Label row})
Then create a basic table with headers, and fill it with your RowItem by enumerating the array of highscores.

Here’s and example of a custom progress bar compound control in C#:

public static void ctrProgressBar(float left, float top, float width, float completed)
    {

        GUI.Label(new Rect(left, top, width, 29), "", GUI.skin.GetStyle("progressbar"));

        if (completed > 0.0f) GUI.Label(new Rect(left, top, (((width - 23) / 100) * completed) + 23, 29), "", GUI.skin.GetStyle("progressbarthumb"));
    }

And here’s how I use the code (cllUIControls is my class containing the static method):

cllUIControls.ctrProgressBar(30, 110, 253, PercentComplete);

Below is the resulting GUI - a progress message box.

58465--2130--$picture_1_136.png

3

So in other words, I have to create GUILayout.Table() myself, essentially?

4

Correct :slight_smile:

5

You could always also simply use three GUI text boxes (I’m assuming something like name, level, score) and simply align them in your view and then return out of your DB only the name row in the first one, only the level row in the second, and the score row into the third. It’ll look like one if you make transparent backgrounds but be in three containers. Believe me, I’d love to be able to return high scores into a simple HTML table.

6

Here’s my current solution. If anyone wants to take it and improve it, please do:

function ScoreTable(Scores) {
	var win=Screen.width*0.6;
	var w1=win*0.35; var w2=win*0.15; var w3=win*0.35;
	for (var line in Scores.Split("\n"[0])) {
		fields = line.Split("\t"[0]);
		if (fields.length>=3) {
			GUILayout.BeginHorizontal();
			GUILayout.Label(fields[0], GUILayout.Width(w1));
			GUILayout.Label(fields[1], GUILayout.Width(w2));
			GUILayout.Label(fields[2], GUILayout.Width(w3));
			GUILayout.EndHorizontal();						
		}
	}
}
1 Like