Простой способ регулировки яркости в Unity
В Unity 2D самый простой, производительный и надежный способ изменить яркость всей сцены без использования тяжелых графических фильтров (Post-Processing) — это наложение полноэкранного затемняющего UI-изображения (Overlay).
Вступление
Мы создадим полупрозрачную черную панель на весь экран. Затемнение через спрайт-подложку — самый простой и надежный способ, который я использовал в своих играх — пазлы, найди пару и прочих. Вместо шторки внутри UI Canvas мы создадим шторку прямо на самой сцене в виде обычного 2D-спрайта. Она гарантированно накроет все объекты. Когда ползунок яркости на максимуме — панель полностью прозрачна. Чем ниже/левее ползунок, тем чернее становится панель, плавно затемняя всю игру и интерфейс под ней.
Создаём объект на сцене
В Hierarchy нажмите правой кнопкой мыши -> 2D Object -> Sprites -> Square (Квадрат). Назовите его WorldBrightnessOverlay.
Растяните на весь экран: В компоненте Transform (в инспекторе) задайте ему такой масштаб (Scale), чтобы он полностью закрывал видимую зону вашей камеры (x100 y100).
Настроим слой
Измените параметр для уровня слоя Sorting Layer или Order in Layer. Ему нужно дать число, которое больше, чем у любого вашего элемента на сцена (которые нужно затемнять) в самом пиковом состоянии перетаскивания (если мы мышкой берём за объект для переноса, как у меня в пазлах, например). В моём случае (для пазлов) этой шторке на сцене я установил Order in Layer равный 31000. Но, как правило, вполне достаточно и 100. Врядли вы «отслеживаете» 99 слоёв 🙂
В компоненте Image измените цвет (Color) на чисто черный, а прозрачность (Alpha)
временно поставьте примерно на половину, чтобы видеть изменения (или 170).
Важно (!) Для всех активных объектов (у меня пазлы) снимите галочку с пункта Raycast Target в компоненте Image. Если этого не сделать, черная панель заблокирует клики мыши, и вы не сможете взаимодействовать с элементами мышкой!
Перетащите этот объект WorldBrightnessOverlay в самый низ вашего Canvas (или сделайте так, чтобы он был ниже игровых элементов, но ползунок яркости лежал поверх него, иначе ползунок тоже затемнится). Ну тат на ваше усмотрение…
Создаем ползунок регулировки
В Canvas нажмите правой кнопкой мыши -> UI -> Slider. Расположите его в удобном месте экрана (например, в меню).
Создаём скрипт регулировки яркости
Мы заставим скрипт управлять компонентом SpriteRenderer нашей новой шторки. Создайте пустой скрипт BrightnessController.cs — вот его код:
using UnityEngine;
using UnityEngine.UI;
public class BrightnessController : MonoBehaviour
{
[Header("Компоненты")]
[SerializeField] private SpriteRenderer overlaySprite;
[SerializeField] private Slider brightnessSlider;
private const string BrightnessKey = "GameBrightness";
void Start()
{
if (overlaySprite == null || brightnessSlider == null)
{
Debug.LogError("[Brightness] Забыли привязать SpriteRenderer или Slider в инспекторе!");
return;
}
// Настраиваем ползунок: значения от 0.2 (темно) до 1.0 (ярко)
brightnessSlider.minValue = 0.2f;
brightnessSlider.maxValue = 1.0f;
// Загружаем сохраненную яркость, либо ставим 1.0 (максимум) по умолчанию
float savedBrightness = PlayerPrefs.GetFloat(BrightnessKey, 1.0f);
brightnessSlider.value = savedBrightness;
// Применяем яркость при старте
SetBrightness(savedBrightness);
// Подписываем метод на изменение значения ползунка
brightnessSlider.onValueChanged.AddListener(SetBrightness);
}
public void SetBrightness(float value)
{
// Рассчитываем прозрачность (Alpha-канал) для черного спрайта
float alpha = 1.0f - value;
Color overlayColor = overlaySprite.color;
overlayColor.a = alpha;
overlaySprite.color = overlayColor;
// Сохраняем выбор игрока
PlayerPrefs.SetFloat(BrightnessKey, value);
}
private void OnDestroy()
{
if (brightnessSlider != null)
{
brightnessSlider.onValueChanged.RemoveListener(SetBrightness);
}
}
}
Связываем всё вместе
Создайте пустой объект на сцене (например, назвав его [BrightnessManager])
и прикрепите на него наш скрипт BrightnessController.cs.
Перетащите объект панели WorldBrightnessOverlay в поле Overlay Sprite в инспекторе скрипта.
Перетащите объект ползунка Slider в поле Brightness Slider в инспекторе скрипта.
На компонент WorldBrightnessOverlay в иерархии перетащите скрипт BrightnessController в интспекторе.
Перетащите этот новый объект WorldBrightnessOverlay в инспектор этого скрипта
UI Image. Так как у него слой 31000, он физически накроет и фон, и лежащие объекты, и даже тот объект, который вы прямо сейчас держите в руке, плавно затемняя их.
Регулятор яркости в действии







