Электронное табло (цифирное)

Простой, но интересный скрипт, с помощью которого можно создать, например, цифирное табло или что-то похоже. В любом случаи, смысл алгоритма в том, что он разбивает целое число на отдельные части, то есть, цифры, и заменяет их картинкой этого числа. Это можно сравнить со шрифтом, но здесь мы работаем на прямую с картинками. В этом есть свои плюсы, например, нет нужды создавать специальный шрифт, можно просто нарисовать цифры, при этом они могут быть уникальными, а если надо быстро что-то изменить или отредактировать, так всё еще упрощается, с таким походом. В общем, на наш взгляд, штука может быть весьма полезной.

Для начала нужно приготовить спрайты цифр, от нуля и до девяти, плюс спрайт по умолчанию, когда цифра не активна.

Потом создаем Canvas если нет, и в нем создаем пустой Rect Transform, на него вешаем:

using System.Collections;
using System.Collections.Generic;
using UnityEngine;
using UnityEngine.UI;
[RequireComponent(typeof(RectTransform))]
public class CustomDigits : MonoBehaviour {

    public int max = 3; // сколько цифр доступно
    public float scale = 1; // размер спрайтов 1 = 100%
    public float offset = 0; // отступ между цифрами
    public Sprite[] digits; // массив спрайтов
    [HideInInspector] public Image[] images; // массив UI

    public void CustomReset() // сброс в ручную
    {
        for (int i = 0; i < images.Length; i++)
        {
            images[i].sprite = digits[digits.Length - 1];
        }
    }

    public void CustomInputField(InputField inputField) // набор через InputField
    {
        int value;

        if (int.TryParse(inputField.text, out value))
        {
            Show(value);
        }
    }

    public void Show(int value) // преобразуем число в спрайты
    {
        if (value < 0) return;

        for (int i = 0; i < images.Length; i++)
        {
            images[i].sprite = digits[digits.Length - 1];
        }

        if (value == 0)
        {
            images[images.Length - 1].sprite = digits[value];
            return;
        }

        bool last = false;
        List<int> result = new List<int>();

        while (value != 0)
        {
            result.Add(value % 10);
            value /= 10;
        }

        result.Reverse();

        for (int i = 0; i < result.Count; i++)
        {
            if (last)
            {
                for (int j = 0; j < images.Length - 1; j++)
                {
                    images[j].sprite = images[j + 1].sprite;
                }
            }

            images[images.Length - 1].sprite = digits[result[i]];
            last = true;
        }
    }

    public void ReBuild() // создать шаблон
    {
        for (int i = 0; i < images.Length; i++)
        {
            if (images[i] != null) DestroyImmediate(images[i].gameObject);
        }

        images = new Image[max];

        float width = digits[0].textureRect.width * scale;
        float height = digits[0].textureRect.height * scale;
        float size = width + offset;
        float posX = -size * max / 2f - size / 2f;
        GetComponent<RectTransform>().sizeDelta = new Vector2(size * max, height);

        for (int i = 0; i < max; i++)
        {
            posX += size;
            Image img = new GameObject("Num-" + i).AddComponent<Image>();
            img.rectTransform.SetParent(transform);
            img.rectTransform.localScale = Vector3.one;
            img.rectTransform.localPosition = new Vector2(posX, 0);
            img.sprite = digits[digits.Length - 1];
            img.rectTransform.sizeDelta = new Vector2(width, height);
            images[i] = img;
        }
    }
}
Теперь в массив digits нам нужно добавить спрайты в правильном порядке, то есть, если спрайт обозначает цифру ноль - то он должен находится в массиве, под индексом ноль. И таким образом мы добавляем все спрайты-цифры, а в самую последнюю очередь уже добавляем в массив дефолтный спрайт.

Электронное табло (цифирное)

Пример, как добавлять спрайты.

Осталось сделать кнопку "Создать / Обновить":

#if UNITY_EDITOR
using UnityEditor;
using UnityEngine;
[CustomEditor(typeof(CustomDigits))]
public class CustomDigitsEditor : Editor
{
    public override void OnInspectorGUI()
    {
        DrawDefaultInspector();
        CustomDigits t = (CustomDigits)target;
        EditorGUILayout.Separator();
        if (GUILayout.Button("Создать / Обновить")) t.ReBuild();
    }
}
#endif
Вот и всё, можно тестировать!

Скачать демо проект:

Внимание! Посетители, находящиеся в группе Гости, не могут скачивать файлы.
Тестировалось на: Unity 2018.2.6

Комментариев 3

Офлайн
doshirak 1 сентября 2018
Отличная работа,братан kissing_heart
Офлайн
siriusspark 2 сентября 2018
Мож табло все таки "цифровое"? wink
Офлайн
Light 2 сентября 2018
siriusspark, есть буквено-цифирное табло, а есть просто цифирное.
Информация
Посетители, находящиеся в группе Гости, не могут оставлять комментарии к данной публикации.
  • Дешевый хостинг
  • Яндекс.Метрика