[pixage]

Ön bilgi : Aşağıdaki tutorial-yazı Macline dergisi Mart sayısında çıkan yazımın buraya entegre edilmiş halidir.

flash MX ile Zaman Öğelerini Kullanarak Saat ve Tarih Göstergesi .

Her insan için, Zaman ve saatlerimizdeki öğelerin konumu büyük önem taşır. Nerede olursak olalım hep saatlerin hangi zamanı gösterdiğini bilmek, öğrenmek ihtiyacı duyar, Zamana göre hareket edip, hayatın akıcılığında geri kalmamak isteriz. Bir multimedya tasarımcısı ve programcısı içinde; zamansal verilere ulaşmak ve bu verileri işleyerek projenin akışını doğal koşullara uygun yönetebilmek oldukça hoş sonuçlar verebilecek bir durumdur. Şu an aklıma gelen bir fikri örnek olarak göstermek gerekirse, İçinde bir oda görüntüsü olan bir projede, odadaki duvar saatinin gerçek zamanı gösteriyor olması ne kadar da etkileyici olurdu değil mi.

Bu ay ki konumuzda, flash MX ve ActionScript kullanarak işte bu ihtiyaçlarımıza cevap verecek bilgiye sahip olmamızı amaçlıyor. Çalışmamıza başlamadan önce, çalışmanın başlangıç aşaması ve tamamlanmış dosyalarını içeren Zip dosyasını buradan indirmenizi tavsiye ederim. Bu sıkıştırılmış dosya içerisinde tasarım aşaması yapılmış, programlamaya hazır olan bir başlangıç dosyası ve bitmiş proje olan sonuç dosyasını bulabilirsiniz.

< -- saat gorsel.tif -- >

Tasarım ve Kodlamaya Hazırlık

Öncelikle; biri mekanik saat diğeri tarih göstergesini içerecek şekilde iki tane ayrı movieclip oluşturun ve içlerine görsel tasarımlarını yapın.
Mekanik saat movieclip’inde; akrep, yelkovan ve saniye oklarını ayrı movieclipler olarak düzenleyin ve merkez noktalarını saatin merkezine konumlandırın. Bu üç movieclibin Instance Name (Tanımlama Adı) kısımlarını; akrep, yelkovan ve saniye olarak isimlendirin. (Bu tanımlama, movieclipleri ActionScript üzerinden yönetebilmemizi sağlayacak.)
Tarih göstergesine ise; iki adet dinamik text alanı oluşturun, bunlardan biri “02 Mart 2004” şeklinde tarihi içerecek diğeri ise o günün adını örn. “PAZARTESİ” içerek. Bu dinamik metin alanlarının Var (variables) alanına “ tarihString “ ve “ gunString “ yazın.


Şimdi Sahne’ye dönün , kodlamaya başlıyoruz
Kodlamaya Geçiş

Ana Sahne (Scene1) üzerinde mekanik saat movieclib’ini seçin, ve F9 tuşu ile aktif hale getirebileceğiniz Actions Paneline aşağıdaki kodları girin.

onClipEvent(enterFrame) {
	myDate = new Date();
	akrep._rotation = myDate.getHours()*30+(myDate.getMinutes()/2);
	yelkovan._rotation = myDate.getMinutes()*6+(myDate.getSeconds()/10);
	saniye._rotation = myDate.getSeconds()*6;
} ;

isterseniz bu kodları biraz inceleyelim.

onClipEvent(enterFrame) { };

İçine yazılan kodların, Ana filmin frame Rate (kare oynatım hızı) hızında çalıştırılacağını ifade eder. ( Örn : frame Rate = 20 ise bu; kod saniyede 20 kere tekrarlanacak demektir.)

myDate = new Date();

ActionScript’te zaman ile ilgili bütün veriler Date() nesnesinden temin edilir. Ve bir işlem yapmadan önce bu nesneyi bir değişkene atamamız gereklidir.

akrep._rotation = myDate.getHours()*30+(myDate.getMinutes()/2);

bu kod ile, akrep isimli movieclip’in rotasyon (dönme açısı) değerini o anki saat ve dakika verilerine göre ayarlamış oluyor ve akrebin saat üzerinde doğru konumda olmasını sağlıyoruz.
Bu kod içindeki getHours() saat değerini, getMinutes ise dakika değerini verir.
Normalde myDate.getHours() * 30 kullanarak (daire 360 dereceli açıya sahip olduğundan ve 360/12=30 olduğundan) akrepin tam saat sayısının üzerinde olmasını sağlayabilirdik, ama daha gerçekçi bir görüntü vermek için saatin konumuna (her saat arası açı uzaklığı = 30 derece , 60dakika/30 = 2 olduğundan) o anki dakika değerinin yarısı kadar bir değer ekliyoruz.
Bu durum aynı mantıkla, 4. ve 5 . kod satırlarında da devam eder.

Şimdi Tarih Göstergesi movieclib’ine tıklayıp yine Actions paneline aşağıdaki kodları ekleyin.

onClipEvent(enterFrame) {
	Tarihim = new Date();

	Gun = Tarihim.getDate();
	Ay = Tarihim.getMonth();
	Yıl = Tarihim.getFullYear();
	HaftalikGun = Tarihim.getDay();
	
	Aylar = new Array("OCAK","ŞUBAT","MART","NİSAN","MAYIS","HAZİRAN","TEMMUZ","AĞUSTOS","EYLÜL","EKİM","KASIM","ARALIK");
	AyString = Aylar[Ay];
	
	Gunler = new Array("PAZAR","PAZARTESİ","SALI","ÇARŞAMBA","PERŞEMBE","CUMA","CUMARTESİ");
	gunString = Gunler[HaftalikGun];
	tarihString = Gun + " " + AyString + " " + Yıl;
	
}

Bu kodun 3,4,5 ve 6. satırlarında;
Ayın kaçıncı gününde olduğumuz, Yılın kaçıncı ayında olduğumuz, Kaçıncı yılda olduğumuz ve Haftanın kaçıncı gününde olduğumuz bilgilerini sonraki satırlarda kullanmak üzere ilgili değişkenlere tanımlamış oluyoruz.
Onu takip eden, 7. satırda, Ay isimlerini Aylar isimli bir dizi değişkene sırasıyla yazıyoruz.
8. satırda ise, Ay değişkeninin değerini bu dizi değişken sıralamasında aratıyor ve çıkan sonucu AyString isimli değişkene atıyoruz. Örn. 4. ayda isek, AyString’in değeri 4.sıradaki “NİSAN” olacaktır.
Sonraki 9 ve 10. satırlardaki kodlarda aynı mantıkla Haftanın hangi gününde olduğumuzu yazı olarak elde etmemizi sağlıyor.
Son satırda ise, tarihString değişkenine “02 MART 2004” gibi bir sonuç elde edebilecek şekilde değişkenleri ardaşık olarak topluyoruz.

Artık çalışmamızı tamamladık ve kullanılabilir hale getirdik. “Ctrl+Enter” komutu ile projenizi test edebilirsiniz. Zamana hakim olacağınız uzun yıllar dileğiyle ...

[gravity]

Hocam çok güzel olmuş, ellerine sağlık umarım senin tutorial flash bölümünde actionscript alt başlığı açılmasına vesile olur (olabilir mi @zoque?..) ve devamını getiririz.

Saygılar...