Corona SDK – Resim Yükleme, Vektörel Nesneler Oluşturma, Android İçin Apk Oluşturma
Merhaba arkadaşlar, bu dersimizde Corona SDK ile alakalı temel, önemli bazı konuları işleyeceğiz. Bu dersin sonunda şu konuları uygulamalı örnekler ile birlikte öğrenmiş olacaksınız :
- Resim Yükleme
- Vektörel Nesneler Oluşturma(kare, diktörtgen, çember vb.)
- Android İçin Apk Oluşturma
Resim Yükleme
Bildiğiniz gibi birçok oyunda hemen hemen herşey birer resimdir. Örneğin arkaplan, oyundaki ana karekter, menüdeki simgeler, ikonlar vs bunların her biri resimdir. Tabi ki illa resim/imaj olmak zorunda değiller. Bu nedenlerle bir oyunda resimlerin yüklenmesi, gösterilmesi, boyutunun modifiye edilmesi, anime edilmesi vs konuları çok önemlidir.
ÖNEMLİ NOT: ÖRNEK UYGULAMA CORONA SIMULATOR 2015.27.31 İLE TEST EDİLMİŞTİR. TEST EDİLİRKEN CİHAZ OLARAK Android(xxhdpi) CİHAZI SEÇİLMİŞTİR. LÜTFEN TÜM TESTLERİ BU CİHAZDA YAPINIZ. İÇERİĞİN EKRAN BOYUTUNA VE ÇÖZÜNÜRLÜĞÜNE GÖRE OPTİMİZASYONU KONULARINI İLERİKİ DERSLERİMİZDE ANLATACAĞIM. SABIRLI OLUN BİRAZ DAHA YOLUMUZ VAR
1. Corona Simulator ü çalıştırın. NEW PROJECT
butonu ile yeni bir proje başlatın.
2. Application Name
kısmına ben örnek amaçlı CoronaTutorial adını verdim siz de bunu veya başka birşey girebilirsiniz. Daha sonra OK
butonuna tıklayarak bitirin. Corona Simulator in projeyi oluşturmasını, proje klasörünü açmasını ve simulatörde projeyi çalıştırmasını göreceksiniz. Şimdilik karşınıza boş ve siyah bir ekran gelecektir.
3. Oluşturulan proje klasörüne gidin ve config.lua
dosyasını herhangi bir text editörde açın.
Aşağıdaki değişiklikleri yapıp dosyayı kaydedin.
width = 320 --> width = width height = 480 --> height = height
4. Oluşturulan proje klasörüne gidin ve main.lua
dosyasını herhangi bir text editörde açın. Ve içeriği aşağıda verdiğim satırlar ile değiştirip kaydedin.
-- durum çubuğunu kaldırma display.setStatusBar(display.HiddenStatusBar) -- arkaplan rengi beyaz bir dikdörtgen oluşturma local mainBg = display.newRect(display.contentCenterX,display.contentCenterY,display.contentWidth, display.contentHeight)
Ne Yaptık ? Kod içerisine açıklamalar bıraktım lütfen onlara göz atın. Bildirim çubuğunu kaldırdık ve cihaz ekranı büyüklüğünde bir dikdörtgen oluşturduk.
Bu adımdan sonra simulatörde karşınıza şöyle bir ekran gelmiş olmalıdır :
5. Şimdi örneğimizi sadece landscape(yatay) modu destekleyecek şekilde değiştirelim. build.settings
dosyasını açın ve aşağıda verdiğim gibi varsayılan(default)
ve desteklenen(supported)
ekran yönünü landscape
olarak değiştirin. Kaydedip projeyi tekrar çalıştırdığında simulatörün yatay modda çalıştığını göreceksiniz.
6. Proje klasörü içine images
adında bir klasör oluşturun. Ve aşağıda verdiğim resmi örnek amaçlı main_bg.jpg
adıyla açtığımız images
klasörüne kopyalayın.
7. main.lua dosyasına bu resmi arkaplan olarak kullanmak için şu kodları ekleyin:
-- arkaplan görseli local mainBgImage = display.newImage("images/main_bg.jpg") -- görselin x pozisyonunu cihaz ekran genişliğinin ortası olarak ayarlıyoruz mainBgImage.x = display.contentCenterX -- görselin y pozisyonunu cihaz ekran yüksekliğinin ortası olarak ayarlıyoruz mainBgImage.y = display.contentCenterY
Kod içine okumanız için açıklamalar bıraktım ihmal etmeyin :). Bu adımdan sonra simulatördeki görüntü şöyle olacaktır :
Vektörel Nesneler Oluşturma
Vektörel nesnelerden kastımız nedir ? Kastımız çizgi, dikdörtgen, kare, çember gibi nesnelerdir. Şimdi bunları tek tek nasıl oluşturabileceğiniz göreceğiz.
Çizgi Oluşturma
Corona SDK da çizgi vektörel nesneler display
kütüphanesindeki newLine()
fonksiyonu ile oluşturulur.
8. Ekranın sol üst köşesinden sağ üst köşesine uzanan, rengi beyaz olan, kalınlığı 8 px olan bir çizgi çizmek için aşağıdaki kodları main.lua
dosyasına ekleyin ve kaydedin.
-- çizgi çizme local line = display.newLine( 0, 0, display.contentWidth,display.contentHeight ) line:setStrokeColor( 1, 1, 1, 1 ) line.strokeWidth = 8
Bu adımdan sonra ekranda göreceğiniz görüntü şöyle olmalıdır :
Dikdörtgen Çizme
Aslında bunu bir önceki dersimizde de bu dersimizde de yaptık. Corona SDK da dikdörtgen display
kütüphanesindeki newRect()
fonksiyonu ile çizilir.
9. Örnek : Kod içine açıklamalar bıraktım, ayrıcana tekrar açıklama yapmayacağım.
-- dikdörtgen çizme -- 500px x 300 px büyüklüğünde bir dikdörtgen oluşturma local rectangle = display.newRect( 0, 0, 500, 300 ) -- ekranın ortasına pozisyonlandırma rectangle.x = display.contentCenterX rectangle.y = display.contentCenterY -- dikdörtgenin kenarlık kalınlığını ayarlama rectangle.strokeWidth = 4 -- dikdörtgen rengini ayarlama rectangle:setFillColor(1,1,1,0.5 ) -- dikdörgen kenarlık rengini ayarlama rectangle:setStrokeColor( 0, 1, 0 )
Sonuç :
Kare Çizme
Kare çizmek için yine newRect()
fonksiyonunu kullanıp genişliği ve yüksekliği eşit olan bir dikdörtgen(yani kare) çizdireceğiz.
10. Örnek :
-- kare çizme local square = display.newRect( 0, 0, 250, 250 ) square.x = display.contentCenterX square.y = display.contentCenterY square.strokeWidth = 4 square:setFillColor(0,0,1,0.5 ) square:setStrokeColor( 1, 1, 0 )
Sonuç :
Çember veya Daire Çizme
Corona SDK da çember veya daire display
kütüphanesindeki newCircle()
fonksiyonu ile çizdirilir.
11. Örnek :
-- çember veya daire çizme -- merkezi (300,ekran yüksekliğinin yarısı) olan -- 200 px yarıçaplı -- rengi beyaz -- kenarlık kalınlığı 10 px -- kenarlık rengi grinin açık bir tonu -- olan bir daire çizdiriyoruz local circle = display.newCircle( 300, display.contentCenterY, 200 ) circle:setFillColor( 1,1,1 ) circle.strokeWidth = 10 circle:setStrokeColor( 0.7, 0.7, 0.7 )
Sonuç:
Bunların dışında display
kütüphanesinde daha birçok işlevsel fonksiyon var. Bunların tamamına şuradan göz atabilir, detaylarını inceleyebilirsiniz.
ÖNEMLİ NOT: ÖRNEK UYGULAMA CORONA SIMULATOR 2015.27.31 İLE TEST EDİLMİŞTİR. TEST EDİLİRKEN CİHAZ OLARAK Android(xxhdpi) CİHAZI SEÇİLMİŞTİR. LÜTFEN TÜM TESTLERİ BU CİHAZDA YAPINIZ. İÇERİĞİN EKRAN BOYUTUNA VE ÇÖZÜNÜRLÜĞÜNE GÖRE OPTİMİZASYONU KONULARINI İLERİKİ DERSLERİMİZDE ANLATACAĞIM. SABIRLI OLUN BİRAZ DAHA YOLUMUZ VAR
Android İçin Apk Oluşturma
Corona SDK ile oyun geliştirirken geliştirmeyi pc de testleri Corona Simulator da yaparsınız. Gerçek bir cihazda veya bir Android Emülatöründe test etmek isterseniz öncelikle projenizi built/inşa etmeniz gerekir.
Android için built/inşa etme işlemiyle sonuçta oyununuzun apk si oluşturulur. Android için inşa işlemini bir pc veya mac te yapabilirsiniz.
iOS için built/inşa etme işlemini sadece mac bir bilgisayarda yapabilirsiniz. Windows ta built edemezsiniz.
Windows Phone için built/inşa işlemi henüz betadır.
12. Corona Simulator da üst menüden File
> Build
> Android
i seçin. Veya Ctrl + B
kısayolu ile de yapabilirsiniz.
13. Karşınıza Android Build Setup
penceresi çıkacaktır. Burada formdaki seçenekleri ihtiyacınıza göre girin/değiştirin/düzenleyin. Daha önce blogumdan dersleri takip ettiyseniz formdaki bütün seçenekler hakkında bilginiz vardır. Formu doldurduktan sonra Build
butonuna tıklayıp Corona Simulator in projeyi built/inşa etmesini bekleyelim.
Sonuçta formda varsayılan olarak gösterilen dosya yolunda veya değiştirdiyseniz belirttiğiniz dosya yolunda projeye ait Android cihaz veya emülatörlere kurup test edebileceğiniz bir apk çıkacaktır.
Peyam – Gazeteler
Peyam Osmanlıcada Haber demektir bunu biliyor muydunuz?
Kaynak Kod
Bunun gibi birçok ders hazırlayıp yayınlamak istiyoruz ancak bunun için gerçekten ciddi desteğe ihtiyacımız var arkadaşlar. Lütfen 1 dakikanızı ayırıp bu dersi facebook veya twitter hesabınız üzerinden paylaşarak bize destek olun.
Corona SDK hakkındaki ikinici dersimizin sonuna geldik, umarım yararlı olmuştur. Corona SDK hakkında yeni dersler için Android Evreni’ni takipte kalın!
İyi Çalışmalar Herkese!