Merhaba Unity geliştiricileri! Bu yazıda, Unity oyun motorunda arayüz (UI) tasarımı için temel bileşenler olan Canvas, Text ve Button öğelerini ele alacağız. Sıfırdan başlayarak, adım adım bir arayüz oluşturacak, metin ekleyecek ve butonlara işlevsellik kazandıracağız.
1. Canvas: Arayüzün Temeli
Canvas, tüm UI öğelerinin yerleştirildiği bir tuval görevi görür. Projenize yeni bir Canvas eklemek için Hierarchy penceresinde sağ tıklayıp UI > Canvas seçeneğini kullanabilirsiniz. Canvas, World Space veya Screen Space – Overlay modlarında çalışabilir. Screen Space – Overlay, arayüzün kameradan bağımsız olarak ekranda sabit kalmasını sağlar, bu da çoğu oyun için ideal bir seçimdir.
Canvas Scaler: Ölçeklendirme ve Çözünürlük
Canvas Scaler bileşeni, farklı ekran çözünürlüklerinde arayüzünüzün doğru şekilde ölçeklenmesini sağlar. Canvas’ın Inspector penceresinde bu bileşeni bulabilirsiniz. UI Scale Mode seçeneğini kullanarak ölçeklendirme yöntemini belirleyebilirsiniz.
2. Text: Metin Ekleme
Arayüzünüze metin eklemek için UI > Text öğesini kullanabilirsiniz. Hierarchy penceresine eklediğiniz Text öğesini seçerek Inspector penceresinde metnin içeriğini, yazı tipini, boyutunu ve rengini ayarlayabilirsiniz. Örnek olarak, bir “Merhaba Dünya!” metni ekleyelim.
// Bu kod, Inspector penceresinden ayarlanabilir. C# script gerektirmez.
3. Button: Etkileşimli Düğmeler
Button öğeleri, kullanıcı etkileşimini sağlamak için kullanılır. Hierarchy penceresinde UI > Button öğesini ekleyerek bir buton oluşturabilirsiniz. Button’a tıklama olayı eklemek için, Inspector penceresindeki On Click() alanına bir event eklemeniz gerekir. Buraya bir C# script ekleyerek butona tıklandığında gerçekleşmesini istediğiniz işlemleri kodlayabilirsiniz.
C# Script ile Buton İşlevselliği
Yeni bir C# script oluşturup, butona tıklandığında çalışacak bir fonksiyon yazalım. Örneğin, butona tıklandığında ekrana bir mesaj yazdıralım.
using UnityEngine;
using UnityEngine.UI;
public class MyButtonScript : MonoBehaviour
{
public Text mesajEkrani;
public void ButtonClicked()
{
mesajEkrani.text = "Butona tıklandı!";
}
}
Bu script’i butonun Inspector penceresindeki On Click() alanına ekleyin ve mesajEkrani değişkenine Text öğesini atayın. Şimdi butona tıkladığınızda, mesajEkrani Text öğesinde “Butona tıklandı!” yazısı göreceksiniz.
4. Daha Fazla UI Öğesi
Canvas, Text ve Button’a ek olarak, Unity’de Image, Slider, Input Field gibi birçok farklı UI öğesi bulunmaktadır. Bu öğelerle daha karmaşık ve etkileşimli arayüzler tasarlayabilirsiniz.
5. Arayüz Düzeni
Arayüz öğelerini düzenlemek için Rect Transform bileşenini kullanabilirsiniz. Rect Transform, öğelerin konumunu, boyutunu ve dönüşünü kontrol etmenizi sağlar. Anchor ve Pivot özelliklerini kullanarak öğelerin Canvas içinde nasıl hizalanacağını belirleyebilirsiniz.
Özet
Bu eğitimde, Unity’de temel UI öğelerini kullanarak basit bir arayüz oluşturmayı öğrendiniz. Canvas, Text ve Button öğelerini kullanarak etkileşimli arayüzler tasarlayabilirsiniz. Daha fazla UI öğesi ve özellik öğrenerek daha karmaşık ve gelişmiş arayüzler oluşturabilirsiniz. Bol bol pratik yaparak Unity UI tasarımında uzmanlaşabilirsiniz!




