
Створення інтерфейсу гри в Unity
Створення інтерфейсу гри в Unity курси програмування
Створення інтерфейсу гри в Unity за допомогою C# 🎮🖥️
Сьогодні ти навчишся:
✅ Додавати елементи інтерфейсу (UI) в Unity
✅ Відображати текст, кнопки, лічильники очок та здоров’я
✅ Писати C#-код для оновлення інтерфейсу в реальному часі

Створення інтерфейсу гри в Unity курси програмування
1. Що таке UI (інтерфейс користувача) в Unity?
UI (User Interface) – це графічний інтерфейс, який дозволяє взаємодіяти з грою.
Приклади UI:
🔹 Лічильник очок 🏆
🔹 Полоса здоров’я ❤️
🔹 Кнопка «Пауза» ⏸️
🔹 Меню гри 📜
2. Додаємо UI в Unity
Крок 1: Створюємо Canvas (полотно)
1️⃣ У Hierarchy натисни Create → UI → Canvas.
2️⃣ Це буде головний контейнер для всіх елементів інтерфейсу.
⚙️ Налаштування Canvas:
- Виділи Canvas.
- У Inspector знайди Canvas Scaler.
- У полі UI Scale Mode вибери Scale With Screen Size.
Тепер UI буде правильно масштабуватися під різні екрани.
Крок 2: Додаємо текст (лічильник очок)
1️⃣ У Canvas натисни Create → UI → Text – TextMeshPro.
2️⃣ У вікні вибери Import TMP Essentials (це обов’язково для тексту).
3️⃣ Назви об’єкт ScoreText.
4️⃣ У Inspector зміні Text на Score: 0.
5️⃣ Зміни Font Size на 40 та розмісти у верхньому куті екрану.
Крок 3: Додаємо полосу здоров’я
1️⃣ У Canvas натисни Create → UI → Slider.
2️⃣ Назви об’єкт HealthBar.
3️⃣ Виділи його Fill Area → Fill.
4️⃣ Зміни колір Fill на червоний (❤️).
5️⃣ Перемісти HealthBar у верхній лівий кут.
3. Програмуємо оновлення інтерфейсу на C#
Крок 1: Створюємо скрипт для очок
1️⃣ У Assets створи C# Script.
2️⃣ Назви його GameUI.
3️⃣ Відкрий у Visual Studio та заміни код:
using UnityEngine;
using TMPro;
public class GameUI : MonoBehaviour
{
public TextMeshProUGUI scoreText; // Текст для очок
private int score = 0;
public void AddScore(int points)
{
score += points; // Додаємо очки
scoreText.text = "Score: " + score; // Оновлюємо текст
}
}
4️⃣ Збережи скрипт.
5️⃣ Перетягни GameUI на Canvas.
6️⃣ У Inspector перетягни ScoreText у поле scoreText.
Тепер можна викликати AddScore(10);
, і очки будуть додаватися!
Крок 2: Створюємо скрипт для здоров’я
1️⃣ У Assets створи ще один C# Script.
2️⃣ Назви його PlayerHealth.
3️⃣ Відкрий і встав цей код:
using UnityEngine;
using UnityEngine.UI;
public class PlayerHealth : MonoBehaviour
{
public Slider healthBar;
private int health = 100;
public void TakeDamage(int damage)
{
health -= damage; // Віднімаємо здоров'я
healthBar.value = health / 100f; // Оновлюємо полосу здоров'я
if (health <= 0)
{
Debug.Log("Гравець загинув!");
}
}
}
4️⃣ Збережи скрипт.
5️⃣ Перетягни PlayerHealth на гравця.
6️⃣ У Inspector перетягни HealthBar у поле healthBar.
Тепер якщо викликати TakeDamage(20);
, здоров’я зменшиться!
4. Додаємо кнопку “Пауза”
1️⃣ У Canvas натисни Create → UI → Button – TextMeshPro.
2️⃣ Назви об’єкт PauseButton.
3️⃣ Зміни Text на Пауза.
4️⃣ Перемісти кнопку у верхній правий кут.
Крок 1: Програмуємо паузу
1️⃣ Створи новий C# Script – PauseMenu.
2️⃣ Відкрий його та додай код:
using UnityEngine;
public class PauseMenu : MonoBehaviour
{
private bool isPaused = false;
public void TogglePause()
{
isPaused = !isPaused;
Time.timeScale = isPaused ? 0 : 1; // Зупиняємо або відновлюємо гру
}
}
3️⃣ Перетягни PauseMenu на Canvas.
4️⃣ В PauseButton знайди OnClick().
5️⃣ Натисни +, перетягни туди Canvas та вибери PauseMenu → TogglePause.
✅ Готово! Тепер кнопка ставить гру на паузу! ⏸️
5. Практичне завдання 🎯
🔹 Додай екран “Game Over” (коли здоров’я = 0).
🔹 Додай ефект підсвічування кнопки при наведенні.
🔹 Додай звуковий ефект при натисканні кнопки.
🚀 Вітаю! Ти навчився створювати інтерфейс в Unity! 🎮