Btgunluk.com

Flash Lite ile mobil uygulama geliştirme

Flash programını tarafından üretilen swf dosyalarının, cep telefonu gibi mobil cihazlarda çalışması için hazırlanan Flash Lite isimli bir platform var. Bu platform yardımıyla Flash’ta hazırladığımız programcıkları cep telefonunda çalıştırabiliyoruz. Ben birazdan hazırlayacağım örneği kendi cep telefonunum olan Nokia 5800 Express Music‘te çalıştırabildim. Aşağıda yapacağımız uygulamaya ait ekran görüntüsü yer almakta.

Flash Lite ile geliştirme yapabilmek için en son Flash sürümüne ihtiyacınız yok. Flash 8′le bile geliştirme yapılabilir. Flash 8, Flash Lite 1′i desteklediği için buradan Flash Lite 2.1 update’ini Flash 8′e kurabilirsiniz. Ben uygulama geliştirirken bu yöntemi tercih ettim.

Flash Cs5 ile birlikte Flash Lite 4.0 gelmektedir. Flash Lite 4.0 ile ActionScript 3.0 kullanılabilirken, Flash Lite 2.1′de ActionScript 2.0 kullanmak durumundayız.

Yukarıdaki ekran görüntüsünden de anlaşılacağı gibi, Yeni düğmesine her bastığımızda programımız bize iki basamaklı iki rastgele sayı üretiyor. Bizden de bu ikinin sayının çarpımını bulmamız bekleniyor. İki sayının çarpımını yazdıktan sonra Sonuç düğmesine bastığımızda, bulduğumuz sonuç doğru ise yeşil olarak gösteriliyor, eğer sonuç yanlışsa kırmızı renkte doğru sonuç gösteriliyor.

Şimdi uygulumayı geliştirmeye başlayalım.

Öncelikle kullanacağımız mobil cihaza uygun bir boyutta Flash belgesi oluşturacak işe başlıyoruz. Ben 320×320 boyutlarında bir belge oluşturdum. Belgenin arkaplan rengini #CCCCCC olarak ayarladım.

Daha sonra Text Tool ile ekrana iki tane Dynamic Text tipinde iki tane metin kutusu yerleştirdim. Bunların boyutlarını 130×50, yazı tiplerini Times New Roman, yazı boyutlarını da 40, yazı rengini siyah ve yazı biçimini de kalın olarak ayarladım.

Burada dikkat edilmesi gereken son derece önemli bir nokta var. Metin kutularını seçip mutlaka aşağıdaki Use device fonts seçeneğinin aktif hale getirilmesi zorunlu. Yoksa benim gibi bir gününüzü yazılar niye çıktıda görünmüyor diye harcarsınız.

Daha sonra ilk metin kutusuna sayi1_txt, ikinci metin kutusuna ise sayi2_txt Instance name’ini verdim.

Line tool ile aşağıdaki biçimdeki çarpma çizgisin çiziyoruz. Düz ve çapraz çizginin kalınlığı 5.

Bu aşamada ekrana sonucun gösterileceği bir metin kutusu ve kullanıcının tahminini gireceği bir giriş kutusu(input text) yerleştirdim. Metin kutusuna sonuc_txt, giriş kutusuna da giris_txt Instance name’lerini verdim. Giriş kutusunundaki Show border around text seçeneğini aktif hale getirdim.

Sonuç ve yeni düğmelerini oluşturmak için ekrana bir adet siyah çizgi renkli(boyutu 2), kırmızı dolgu renkli bir dikdörtgen çizdim. Bu dikdörtgeni seçip F8 tuşuna basarak Button tipinde bir sembole dönüştürdğm. Daha sonra çift tıklayıp oluşan sembolün kendi timeline’ına geçtim. Over, Down ve Hit bölümlerine F6 ile birer anahtar kare koyduktan sonra; Over bölümünde dikdörtgenin dolgu rengini mavi, Down bölümünde ise dolgu rengini siyah yaptım. Sahneye dönerek bu düğmeni bir kopyasını çıkarttım. Düğmelere sonuc_btn ve yeni_btn Instance name’lerini verdikten sonra, Text Tool ile üzerlerine sarı renkli olarak Sonuç ve Yeni yazdım.

Son olarak uygulamadaki bütün metin kutularını sağa hizaladım.

Uygulamamızın tasarımı bu noktada bitmiş oldu. Artık uygulamayı çalışacak hale getirecek kodları yazma zamanı. Bu işlemleri yaptığımız katmanın üzerine yeni bir katman daha oluşturup adını as olarak değiştirdim. Gereken ActionScript kodlarını bu katmanın ilk Frame’inde yazacağım. Bundan dolayı ilk frame’ı tıklayıp F9 tuşuna basarak, Action panelini açtım ve aşağıdaki kodları yazdım:

giris_txt.restrict ="0-9";
stop();
_root.onEnterFrame=function(){
    sayi1_txt.text=getRandomInt(100);
	sayi2_txt.text=getRandomInt(100);
	sonuc_txt.text="";
	delete _root.onEnterFrame;
}
function getRandomInt(p_int, c_int){
	var n_int = random(p_int);
	if(n_int != c_int){
		return n_int;
	}else{
		return getRandomInt(p_int, c_int);
	}
}
sonuc_btn.onRelease=function(){
	sonuc_txt.text=parseInt(sayi1_txt.text)*parseInt(sayi2_txt.text);
	if (sonuc_txt.text==giris_txt.text) {
		sonuc_txt.textColor=0x00FF00;
	}
	else {
		sonuc_txt.textColor=0xFF0000;
	}
}
yeni_btn.onRelease=function(){
	sayi1_txt.text=getRandomInt(100);
	sayi2_txt.text=getRandomInt(100);
	sonuc_txt.text="";
	giris_txt.text="";
}

Yukardaki kodun birinci satırında Giriş kutusuna sadece sayıların girilmesi için bir sınırlama getiriliyor. İkinci satırda Timeline’in ik frame’inda kalınmasını sağlanıyor.

Üçüncü ve sekizinci satırlar arasında, frame’e ilk kez gelindiğinde yapılacak işlemleri belirtiliyor. Bu işlemler ekrandaki ilk iki metin kutusuna en fazla iki basamaklı iki rastgele sayı atanması ve sonucu gösteren metin kutularının boşaltılmasıdır.

Dokuzuncu ile on altıncı satırlar arasında rastgele sayı üretmeyi sağlayan fonksiyon yer almaktadır.

On yedinci ile yirmi beşinci satırlar arasında Sonuç düğmesine basıldığında yapılacak işlemler belirtilmektedir. Önce sonuç metin kutusunda çarpma işlemini sonucu bulunmakta, kullanıcının girdiği tahmin doğru ise sonuç yeşil olarak ekrana yazılmakta, kullanıcının girdiği tahmin yanlış ise doğrusu kırmızı renkli olarak ekrana yazılmaktadır.

Yirmi altı ile otuz birinci satırlar arasında Yeni düğmesine basıldığında ne olacağı ayarlanmaktadır. Bu düğmeye basıldığında metin kutularına rastgele iki sayı daha yazılmakta, sonuç ve giriş metin kutularındaki yazılar da silinmektedir.

En son olarak da uygulamanın Flash Lite uyumlu olarak yayınlanması gerekir. Bunun File menüsünden Publish Settings komutu verilir. Ekrana gelen pencerenin Flash sekmesinden Flash Lite 2.1 seçilir ve Publish komutu verilir.

Benim telefonum dokunmatik ekranlı olduğu için bu uygulamada ekran kontrollerine gerek kalmadı. Uygulamanın kaynak dosyasını ve bu dosyanın cep telefonunda çalışacak halini buradan indirebilirsiniz.

01.01.2011 20:53:26

Yorumlar