Unity- Health Bar Yapımı
Bugün oyunlarda kullanılan Health Bar yapısının en temel halini anlatmaya çalışacağım.
Yaptığımız oyunda bir karakterimiz var. Bu karakterin belli bir canı olsun.
Bu karakter tuzaklara temas ettiğinde, saldırıya uğradığında canı azalabilir. Canı bitince de oyun sona erer. Bu durumu kullanıcıya belirtmek için Health Bar yapısını kullanabiliriz. Kullanıcı can durumunu bu bar üzerinden kontrol edebilir.
Yapıdan kısaca bahsedelim. Health Bar sistemi oyun ekranında köşe noktada bulunur. Health Bar mevcut cana göre aşağıdaki gibi görünecektir
Oyun başlangıcında Health Bar full olacak. Yani tamamı yeşil olacak. Karakter can kaybettikçe yeşil kısım azalmaya başlayacaktır. Can bitince de Health Bar tamamen kırmızı olacaktır.
Şimdi ise bunu uygulamalı biçimde yapalım. Öncelikli olarak 2 farklı resme sahip olmamız gerekmektedir. Aynı boyutta yeşil ve kırmızı renkte 2 farklı resim lazım. Bunları internetten indirebileceğiniz gibi Paint üzerinden hızlıca yapabilirsiniz.
Bunlarla uğraşmak istemezseniz de üst tarafta ki resimlere sağ tık yapıp farklı kaydet yapıp indirebilirsiniz.
Öncelikle boş bir proje açalım. Hierarchy panelinde iken sağ tık yapıp UI menüsü altındaki Image seçeneğine tıklayıp bu yapıyı oyuna ekleyelim. Health Bar sistemi yapacağımızdan dolayı 2 adet Image eklememiz gerekmektedir.
Bu Image objelerini ayırt edebilmek için RedBar ve GreenBar olarak isimlendirelim.
İndirdiğimiz Health Bar grafiklerini Project klasörü içerisine atalım.
Bu resimleri UI panelinde kullanabilmemiz için bunları Sprite yapmamız gerekmektedir. Bunun için resme tıklayıp Inspector panelinde bulunan Texture Type değerini Sprite(2D and UI) olarak seçelim. Ardından Apply deyip değişiklikleri kaydedelim.
Daha sonra UI kısmında Image objelerini alt köşeye sabitlememiz gerekmektedir. Bunun için Image objelerini seçip Inspector panelindeki Rect Transform aracına tıklayalım.
Açılan ufak pencerede iken Alt+Shift yaparak sağ altta bulunan simgeye tıklayalım.
Bunu yaptığımız zaman objelerimiz UI tarafında sağ alt kısma sabitlenecektir.
Daha sonra Rect Tool aracı ile Image objelerinin boyutunu arttıralım.
Daha sonra indirdiğimiz resimleri bu objelere atalım. İlgili objeye uygun resmi Image componenti altında bulunan Source Image kısmına sürükleyip bırakalım.
Hierarchy panelinde bulunan GreenBar objesini seçelim. Seçili objenin Inspector panelinde bulunan Image componentine bakalım. Bu component altında bulunan Image Type seçeneğini Filled olarak belirleyelim.
Image Type değerini Filled olarak seçtikten sonra ek seçenekler çıkacaktır. Fill Method değerini Horizontal olarak seçelim.
Bunu yaptıktan sonra alt kısımdaki seçeneklerden Fill Amount değerine bakalım. Fill Amount 0–1 arası değer alır. Bu değeri azaltalım. Değeri azalttıkça gördüğünüz gibi Yeşil kısımda azalma olacaktır. Bu azalma sonucu arkadaki kırmızı kısım gözükecektir. Fill Amount 1 iken can barı full yani tamamen yeşil olacaktır. Bu miktar azalınca yeşil kısım azalacaktır. Azalan kısım yerine arkadaki kırmızı alan gözükeceği için kullanıcı can kaybettiğini anlayacaktır. Bu işlemi kod tarafında yapalım.
Kullanıcı SPACE tuşuna her bastığında Fill Amount azalsın.
Sahnede GameController adında boş bir obje oluşturalım. Bu obje içerisine de boş bir script dosyası ekleyelim.
UI kısmında işlem yapacağımız için script dosyamız içerisine ilk olarak UnityEngine.UI kütüphanesini eklememiz gerekmektedir.
Ardından gerekli değişkenleri belirledik.
Sahnedeki bulunan GreenBar objesi içerisindeki Image componentine eriştik.
Şimdi ise en önemli yere geldik.
SPACE tuşuna her bastığımızda Fill Amount değeri 0.1 azalacak. Fill Amount değeri sıfıra ulaşınca oyun bitecek ve biz SPACE tuşuna bassak bile bir etkileşim olmayacaktır.
Gerekli kodları yazıp oyunu çalıştırdığınız zaman SPACE tuşuna her basmanızda Health Bar kısmında azalma olacaktır. Health Bar tamamen kırmızı olunca ise Console ekranında Game Over yazdığını göreceksiniz.
Bu konuyu en temel haliyle gördük. Bu temelden yola çıkarak sizde bu yapıyı oyunlarınıza ekleyebilirsiniz. Örneğin karaktere mermi isabet ettiğinde, tuzağa temas ettiğinde, saldırıya uğradığında Fill Amount değeri azalacaktır.
