menu.fw

Unity 2D Oyun Tasarımı Ders9 | Menu Tasarımı (Canvas)

Önce ki derse buradan erişebilirsiniz.

Unity 2D derslerinin 9. ile devam ediyoruz..
Bu dersimiz de olmazsa olmaz Menümüzü oluşturacağız ve Canvas yapısına bakacağız..

Oyunların başlangıcın da genel olarak, ya Play menu, ya da Level menu bulunur..
Bunu UI (User Interface) yani kullanıcı arayüzü ile yapıyoruz..
Şimdi kendimize yeni bir sahne açıp başlayalım..

File>New Scene daha sonra Hierarchy bölümüne sağ tıklayıp UI>Button tıklıyoruz..

1 2
Resim1

Otomatik olarak bize Canvas Object, Alt Object (Child) olarak Button ve onun altına bir Text Object oluşturdu..
Scene penceresinde iken mousenuzun tekerleğini çevirerek sahnemize uzaktan bakalım..

Canvas Camera‘mızın aksine daha büyük bir alanda gösteriliyor.. Ve Camera’ya muhtaç kalmadan ekrana görüntü aktarıyor..
Canvas, UI‘mizin çalışma alanı.. İçerisin de bulundurduğu objelerin kendisine ait pozisyonları vardır..

Canvası büyütüp küçültemez veya konumunu değiştiremezsiniz(Script hariç).. Lakin Render Mode ile yapılabilecek bir kaç şey var..
Şimdi Canvasımızın ayarlarına bakalım..

2 2
Resim2

Başlangıç için işimize yarayacak sadece iki ayar göstereceğim burada..
1. Render Mode = Canvasımızın boyutlandırılması.. Default olarak Screen Space – Overlay olarak geliyor..

Bu her şeyin üstünde görün demek..
Screen Space – Camera = Render Camera’nın içine Hierarchy de bulunan Camera’nızı sürükleyip bırakıyorsunuz..

Böylece Canvasınız Cameranıza göre boyutlanıyor..
World Space ise 3 boyutlu arayüzler oluşturmanız için..

2. UI Scale Mode = Objelerinizin referans konumları
Constant Pixel Size = Objeleriniz Canvas‘a olan uzaklıklarını referans alarak konumlanır..

Scale With Screen Size = Cihazınızı referans alarak konumlanır..
Constant Physical Size = Ekranın boyutu nasıl olursa olsun objelerinizin boyutu hep sabit kalır..

Button ayarlarımıza bakalım..

3 2
Resim3

Source İmage kısmından Arka plan resmini değiştirebiliyoruz..
Color kısmından butonunuzun rengini ve alpha değerini değiştiriyorsunuz..
Normal Color = Default renginiz..

Highlighted Color = Fareniz ile üstüne geldiğiniz de ki renk..
Pressed Color = Butona basılı tuttuğunuz zaman çıkan renk..
Disabled Color = Butonunuz aktif değil iken oluşan renginiz..

Başlangıçta işimizi görecek özellikler sadece bunlar.. On Click () kısmını ise birazdan göreceğiz..

Şimdi 2 tane buton oluşturuyoruz.. Biri Start diğeri Exit Color Alpha değerlerini “0” yapıyoruz..
Text bölümünden isimlerini vererek, buton ve text size nı arttırıyoruz..

Script:
4 2
Resim4

1: Sahnelerimiz ile ilgili ayarlar yapabilmek için gerekli olan kütüphane
2: SceneManager altında ki LoadScene (Sahneyi Yükle) getir.. Hangi sahne (1) 1. sahneyi getir..
3: Uygulamadan çıkış yap..

Evet kodumuzu yazdık.. Şimdi ise butonlara tıklandığı zaman Class‘ları çağırmamız gerek..
Script dosyamızı Canvasımızın Inspector alanına sürükleyip bırakıyoruz..

5 2
Resim5

Start butonumuzun On Click () bölümünde bulunan “+” simgesine tıklıyoruz..

None Object yazan yere Canvasımızı sürükleyip bırakıyoruz..
No Function kısmında ise Script’imizin içinde bulunan LoadScene classına tıklıyoruz..

Aynı işlemi Exit butonu için yapıyoruz sadece Function kısmında ExitApplication classını seçiyoruz..

6
Resim6

Son olarak File>Build Settings kısmına Menu sahnemizi sürükleyip bırakıyoruz ve en üste taşıyoruz..

Bu ekranda Sahnelerin yanında bulunan İndex numaralarına dikkat edin..
LoadScene Class‘ın 1. sahneyi çağırdığımız zaman kodumuz burada ki index numaralarına göre çağırıyor..

Evet bir dersimizin daha sonuna geldik..
Dilimiz döndüğünce anlatmaya çalıştık.. Takıldığınız herhangi bir yerde çekinmeden yorum yazabilirsiniz.. 🙂

İletişim: admin@herseymi.com
Yazı oluşturuldu 110

Unity 2D Oyun Tasarımı Ders9 | Menu Tasarımı (Canvas)” için bir görüş

Bir yanıt yazın

E-posta adresiniz yayınlanmayacak. Gerekli alanlar * ile işaretlenmişlerdir

Benzer yazılar

Aramak istediğinizi üstte yazmaya başlayın ve aramak için enter tuşuna basın. İptal için ESC tuşuna basın.

Üste dön