【Unity】绘制表格：排行榜

绘制一款表格，表格特征为头行颜色不同、间隔行不同背景色、滚动视图；表格内容是分数排行榜，前三名有奖牌图标前缀。

成果展示

Scene部分

标题和背景
滚动视图：表头、表格行模板

效果图

脚本部分

脚本绑定在滚动组件的Viewport物体上。

public class HighscoreTable : MonoBehaviour
{

    private Transform entryContainer;
    private Transform entryTemplate;

    private List<HighscoreEntry> highscoreEntryList;
    private List<Transform> highscoreEntryTransformList;
    private void Awake()
    {
        entryContainer = transform.Find("highscoreEntryContainer");
        entryTemplate = entryContainer.Find("highscoreEntryTemplate");
        
		//模板行隐藏
        entryTemplate.gameObject.SetActive(false);

        highscoreEntryTransformList = new List<Transform>();

        //数据
        highscoreEntryList = new List<HighscoreEntry>() {
        new HighscoreEntry{ score = 43421,name="nckla"},
        new HighscoreEntry{ score = 5634,name="dsc"},
        new HighscoreEntry{ score = 765,name="cxaccs"},
        new HighscoreEntry{ score = 3412,name="asasxa"},
        new HighscoreEntry{ score = 5321,name="cdwqdas"},
        new HighscoreEntry{ score = 76544,name="gtrgf"},
        new HighscoreEntry{ score = 863423,name="bbfbtg"},
        new HighscoreEntry{ score = 323123,name="bgbnhn"},
        new HighscoreEntry{ score = 643,name="tetrwe"},
        };
        Highscores highscores = new Highscores { highscoreEntryList = highscoreEntryList };
        
        //数据排序
        for (int i = 0; i < highscores.highscoreEntryList.Count; i++)
        {
            for (int j = i + 1; j < highscores.highscoreEntryList.Count; j++)
            {
                if (highscores.highscoreEntryList[j].score > highscores.highscoreEntryList[i].score)
                {
                    HighscoreEntry tmp = highscores.highscoreEntryList[i];
                    highscores.highscoreEntryList[i] = highscores.highscoreEntryList[j];
                    highscores.highscoreEntryList[j] = tmp;
                }
            }
        }

        //数据显示到UI
        foreach (var item in highscores.highscoreEntryList)
        {
            CreateHighscoreEntryTransform(item, entryContainer, highscoreEntryTransformList);
        }
    }

    [System.Serializable]
    private class HighscoreEntry
    {
        public int score;
        public string name;
    }

    private class Highscores
    {
        public List<HighscoreEntry> highscoreEntryList;
    }

    private void CreateHighscoreEntryTransform(HighscoreEntry highscoreEntry, Transform container, List<Transform> transformList)
    {
        //实例化新的行
        Transform entryTransform = Instantiate(entryTemplate, container);
        entryTransform.gameObject.SetActive(true);

        //计算排名并显示：前三名特别
        int rank = transformList.Count + 1;
        string rankString;
        switch (rank)
        {
            default: rankString = rank + "TH"; break;
            case 1: rankString = "1ST"; break;
            case 2: rankString = "2ND"; break;
            case 3: rankString = "3RD"; break;
        }
        entryTransform.Find("posText").GetComponent<TextMeshProUGUI>().SetText(rankString);

        //显示分数和姓名
        int score = highscoreEntry.score;
        entryTransform.Find("scoreText").GetComponent<TextMeshProUGUI>().SetText(score.ToString());

        string name = highscoreEntry.name;
        entryTransform.Find("nameText").GetComponent<TextMeshProUGUI>().SetText(name);

        //间隔行不同背景色
        entryTransform.Find("background").gameObject.SetActive(rank%2==1);

        //第一名文本内容颜色不同
        if (rank == 1) {
            entryTransform.Find("nameText").GetComponent<TextMeshProUGUI>().color = Color.green;
            entryTransform.Find("posText").GetComponent<TextMeshProUGUI>().color = Color.green;
            entryTransform.Find("scoreText").GetComponent<TextMeshProUGUI>().color = Color.green;
        }

        //前三名前缀不同颜色的奖牌
        switch (rank)
        {
            default:
                entryTransform.Find("troph").gameObject.SetActive(false);
                break;
            case 1: entryTransform.Find("troph").GetComponent<Image>().color = UtilsClass.GetColorFromString("FFD200"); break;
            case 2: entryTransform.Find("troph").GetComponent<Image>().color = UtilsClass.GetColorFromString("C6C6C6"); break;
            case 3: entryTransform.Find("troph").GetComponent<Image>().color = UtilsClass.GetColorFromString("876F56"); break;
        }

        //所有行整理到表格
        transformList.Add(entryTransform);
    }
} 

排行榜内容可以使用PlayerPrefs实现数据持久化