Mini iOS Apps 1 : Catch The Fruits

Merhabalar Arkadaşlar,

Bugünkü yazımla birlikte yepyeni bir seriye başlıyoruz. Her blog yazımda bir mini uygulama yaparak, öğrendiğimiz komponentleri ve yapıları kullanarak bilgilerimizi kalıcı hale getireceğiz. Hazırsanız vakit kaybetmeden başlayalım :)


Uygulamayı Tanıyalım

Catch The Fruits uygulaması 20 saniye içerisinde ekranda en fazla kaç tane meyve yakalayabilirsiniz bunu ölçen bir uygulamadır. Uygulamada hızlı olmanız toplayacağınız meyve sayısını daha da arttıracaktır. Uygulamadaki en yüksek skorunuz iseniz ekranın altında gözükücektir. Arkadaşlarınızla mini rekabetlere girebileceğiniz bir uygulamadır. Uygulamada süre bitince bir mesaj gözükecek. İstenirse tekrardan oynanabilecek istenirse oyun sonlandırılacak. Uygulamada Label, Image View, Alert, Timer yapılarını kullanacağız.


Uygulamanın Tasarımı

Uygulamada 9 adet Image View kullanılmaktadır. Her Image View bileşeninde ise farklı meyvelerin resimleri bulunmaktadır. 3 adet Label kullanılmaktadır. Süreyi tutan, Skoru tutan ve En yüksek skoru tutan label bileşenleri şeklindedir. Aşağıdaki gibi bir ekran sizlerde tasarlayabilirsiniz :

Uygulamada kullandığım resimleri aşağıdaki siteden ücretsiz bir şekilde indirebilirsiniz :


Bileşenlerin Tanımlanması

Image View ve Label nesnelerini kod tarafında tanımlıyoruz.

Resimlere tıklayabilmemiz için Gesture Recognizer sınıfından yararlanıyoruz. Bu yapılarla ilgili daha fazla bilgiye aşağıdaki blog yazısından edinebilirsiniz :

Resimlerin ekranda dokunulmasını aktif etme işlemini yapıyoruz :

Seçilen resim için User Interaction Enabled seçeneğini tikleyerek bu resimlerin etkileşimli olacağını belirtmiş olduk.

Resimlere tanımlanan recognizer nesnelerini atama işlemlerini yapıyoruz :

Resimlere tıklanınca skoru arttıracak olan fonksiyonu yazdık :


Timer Tanımlamak ve Kullanmak

Timer belirli zamanlarda yapılan işlemleri gerçekleştirmek için kullanılan bir sınıftır. Timer sınıfından bir nesne üreteceğiz ve o nesne üzerinden 20 saniye geriye doğru sayan bir sayaç dizayn ederek uygulamamızda kullanacağız.

Timer nesnesi ve counter adında bir sayaç tanımladık.

timer nesnemize özelliklerini ekledik. 1 saniyede geri gelecek şekilde ayarlandı. Fonksiyonumuzu oluşturup içine ekledik. countDown() isminde fonksiyonumuzu tanımladık. İçerisini altta doldurmaya devam edeceğiz :)


Alert Tanımlamak ve Kullanmak

Alert ekranda kullanıcıya yapmak istediği seçeneği belirtmesi için gösterilen bir mini mesaj ekranıdır. Biz örneğimizde kullanıcıya oyun bittiğinde tekrardan oynamak isteyip istemediğini sormak için kullanacağız.

Yazmış olduğumuz fonksiyonun içerisini doldurmaya devam ediyoruz. Counter değeri sıfırlandığında alert nesnesi üretip, kullanıcıya gösteriyoruz. Alert ekranımızla ilgili düzenlemeleri yapıp, Alert nesnemizi başlatıyoruz.


Array Tanımı ve Kullanımı

Meyveler için bir array tanımlıyoruz. Tutacağımız elemanlar UIImageView türündedir. Oluşturduğumuz diziye meyveleri ekleme işlemini yaptık.

Tanımlanan dizinin elemanları ekranda rastgele gösterip kapatabilmek için isHidden() adında bir fonksiyon tanımlıyoruz.

Fonksiyonun içerisinde bir for döngüsü oluşturup tüm resimleri gizledik. Daha sonra random değişkeni oluşturup resimler arasından biri rastgele ekranda gözükecek şekilde gösterildi.

Ekranda hareketli bir şekilde gözükebilmesi için başka bir timer daha oluşturduk. Her 0.5 saniyede bir resim random olarak yer değiştirerek ekranda gösterilecek. Bu timer nesnelerini invalidate etmeyi unutmayalım :)

countDown() fonksiyonunun içerisinde bunları geçersiz hale getiriyoruz.


Tekrardan Oynama Özelliği

Kullanıcı oyunu tekrardan oynamak istediğinde Alert ekranında “Yep” tuşuna basınca gerçekleşecek işlemleri yapacağız.

Skoru, zamanı sıfırlıyoruz. Bunları text değerlerine yazıyoruz. Timer nesnelerini tekrardan aktif hale getirip işlemleri bitiriyoruz.


Yüksek Skoru Tutmak

Uygulama sonlanınca bir sonraki oyunda alt ekranda şu ana kadar oynanmış ve en yüksek skor yazılmaktadır. Basit verileri tutmak için UserDefaults yapısı kullanılmaktadır. Bu yapıyı derinlemesine ilerleyen zamanlarda anlatmayı düşünüyorum.

ViewDidLoad() içinde highScore ile ilgili işlemler tanımladık. Eğer değer nil e eşitse direkt sonuç sıfıra eşitlendi. Sonuç varsa direkt o kısma yazılıyor.

Counter sıfırlandığı vakit bu kısım çalıştırılacak. Sıfırdan farklı veya sıfır ise değeri ekrana yazdırılacak.


Evet Arkadaşlar ilk mini uygulamamızın sonuna geldik. Bir sonraki yazıda görüşmek üzere. Bol kodlu günler dilerim :)

Projenin son haline aşağıdaki repodan ulaşabilirsiniz :