Редизайн стандартного Toggle UI

Небольшой, но надеемся полезный проект, здесь мы представляем новый, более современный дизайн стандартного UI Toggle. Для плавного перехода состояния переключателя из одного в другое, используется анимация, сам аниматор настроен на работу в режиме паузы, когда время остановлено, это полезно для создания различных игровых меню. Toggle управляется простым скриптом, при этом, с ним можно работать в обычном режиме, то есть, менять его состояние как нужно. А для удобства разработчика, в скрипт встроена функция, с помощью которой, можно добавлять новый Toggle, через стандартное меню Unity.


В новом дизайне используется атлас с двумя спрайтами:

Редизайн стандартного Toggle UI

Всё достаточно просто, фон и кнопка переключателя.

Чтобы добавить наш Toggle в свой проект:


Выбираем на сцене нужный RectTransform, затем ПКМ > UI > Custom > Toggle.

Скрипт управления состояниями:

using UnityEngine.EventSystems;
using UnityEngine;
using UnityEngine.UI;
#if UNITY_EDITOR
using UnityEditor;
#endif
[RequireComponent(typeof(Toggle))]
public class CustomToggle : MonoBehaviour, IPointerExitHandler, IPointerClickHandler
{
    public float scale = 1; // изменение размера
    public Animator animator;
    public Toggle toggle;

    void OnValidate()
    {
        toggle.transform.localScale = new Vector3(scale, scale, 1);
    }

    void IPointerClickHandler.OnPointerClick(PointerEventData eventData)
    {
        animator.SetBool("IsOn", toggle.isOn);
    }

    void IPointerExitHandler.OnPointerExit(PointerEventData eventData)
    {
        eventData.pointerPress = null;
        EventSystem.current.SetSelectedGameObject(null); // сброс выбранного объекта
    }

    void Transition()
    {
        animator.SetBool("IsOn", toggle.isOn);
        animator.Play(toggle.isOn ? "ToggleOn" : "ToggleOff");
    }

#if UNITY_EDITOR
    [MenuItem("GameObject/UI/Custom/Toggle")]
    static void CreateToggle()
    {
        if (Selection.activeTransform == null)
        {
            EditorApplication.ExecuteMenuItem("GameObject/UI/Canvas"); // добавить стандартный Canvas
        }

        string path = "Assets/NULLcode Studio/Toggle/Prefab/Toggle.prefab"; // путь к префабу Toggle
        GameObject prefab = PrefabUtility.InstantiatePrefab(AssetDatabase.LoadAssetAtPath<Object>(path)) as GameObject;
        prefab.transform.SetParent(Selection.activeTransform, false);
        prefab.transform.localPosition = Vector3.zero;
        prefab.transform.localEulerAngles = Vector3.zero;
        prefab.transform.localScale = Vector3.one;
    }
#endif
}

Здесь у нас контроль анимации и функция добавления, через меню Unity.

Скачать проект:
Внимание! Посетители, находящиеся в группе Гости, не могут скачивать файлы.
Тестировалось на: Unity 2018.3.6
Информация
Посетители, находящиеся в группе Гости, не могут оставлять комментарии к данной публикации.
  • Яндекс.Метрика