 |
| Önce animasyonu inceleyelim. Filmin tam orta noktası esas alınarak kayma hareketinin fare ile uyumuna dikkat edin. Kayma hareketi vertikal olarak planlandı. Yatay düzlemde animasyonu hazırlama da aynı sistemle yapılır. Sadece resimleri yatay sıralamak ve kodlardaki _y yerine _x yazmanız yeterli olacaktır.
Animasyonu oluşturalım: 1-Önce sahneye arkaplanda kullanacağımız resimleri import edelim. Resimleri import etmeden önce boyut ayarlamasını mutlaka yapalım. Aynı işlemi flash içinde de yapabiliriz. Fakat büyük ebadlarda bir resmi küçülttüğümüzde dosya boyutu yine yüksek kalır. dosya boyutunu arttırmamak için daha önceden resmi istediğimiz ebadlarda ayarlamak daha uygun olacaktır. Bu animasyonda 5 resim kullanılmıştır. İmport edilen resimleri sahneden silelim, sahne tamamen boş kalmalıdır. ( MX 2004 versiyonunda doğrudan kütüphaneye import edebilirsiniz. )Resimler sahneden silinmesine rağmen kütüphanede kullanıma hazır olarak bekler. 2- Insert--> New Symbol komutunu verelim ve davranış olarak grafik seçeneğini kullanalım. Kütüphaneyi açalım ve 5 adet resmi dikey olarak yerleştirelim. Bu resimleri buton olarak kullanacağımız için yeni bir katman ekleyelim. Bu katmanda 1. kareyi seçerek dikdörtgen aracı ile sahnedeki resimlerle aynı boyutta bir dikdörtgen çizelim. Bu dikdörtgenin tamamını seçerek F8`e basalım ve sembol iletişim kutusundan button davranışını seçelim. Bu butona çift tıklayarak açalım. Hit alanına bir keyframe ekleyelim. Up kısmındaki dikdörgeni seçip silelim. Sadece hit kısmında şeklimiz kalacaktır. Bu bize görünmez bir buton oluşturma şansını verecektir. Bu görünmez butonun birer örneğini diğer 4 resim üzerine de yerleştirelim. İPUCU: Görünmez butonu seçip CTRL tuşuna basılı iken fare ile tutarak çekersek bir kopyasını oluşturmuş oluruz. Kütüpheneden bir örneğini çekme sıkıntısından kurtuluruz. UYARI: Grafideki resimler birbirine bitişik konulmazsa (ki bizim animasyonda böyledir) minik bir sorun çıkabilir.Grafi ilerde vereceğimiz komutlarla çoğaltılacak ve ucuca eklenerek kesintisiz animasyonu sağlayacaktır.Grafinin alt kısmına diğer resimlerdeki kadar bir boşluk eklemezseniz animasyon oynarken bazen iki resmin birbirine bitişik diğerlerinin aralıklı olması gibi görsel bir problem çıkartır.
Bu nedenle resimler dikey olarak yerleştirildiğinde en alttaki resmin hemen altına dikdörgen aracı ile diğer resimler arasındaki kadar boyutta bir dikdörtgen çizin. Bu dikdörtgenin animasyonda gözükmemesi için onu seçin ve grafik olarak tanımlayın , sonra properties panelinden alfa değerini %0 yaparak görünmez olmasını sağlayın. Bu grafik gözükmeyecek fakat arada tampon görevi sağlayarak çoğalan resimlerin birbirine yapışmasını engelleyecektir. 3-Grafi ile işimiz bitti. Buradaki butonları seçerek istediğiniz linki verebilirsiniz. CTRL+F8`e basarak sembol kutumuzu açalım ve davranış olarak film klibi seçeneğini kullanalım. İsim olarak imaj adını verelim.İmaj klibimiz içine kütüphanede az evvel hazırladığımız grafiyi ekleyelim. Bu klibe hiçbir kod yazılmayacaktır. hazırlanmasındaki tek amaç grafiği bir klip içine yerleştirip bu klibe komut uygulamak olacaktır. 4- Tekrar CTRL+F8`e basarak yeni bir klip oluşturalım. Adına mc_foto adını verelim. Kütüphaneden imaj klibimizi alarak bu klip içine yerleştirelim. İmaj klibimizi seçelim ve properties panelinde örnek adını yine imaj olarak ayarlayalım. 5- Şimdi hala tamamen boş olan ana sahneye dönelim. En son oluşturduğuuz mc_foto klibini sahneye yerleştirelim ve örnek adı olarak foto adını verelim. Üste bir katman ekleyelim ve dikdörtgen aracı ile dış çizgisi olmayan bir dikdörtgen çizelim. Bu dikdörtgen maske olarak kullanıldığından boyutlarını arzu ettiğiniz şekilde düzenleyin. Maske katmanının timeline`da sol kenarında görülen dosya ikonuna çift tıklayarak layer properties panelini açalım( veya katmana sağ klik yapıp properties seçeneğini kullanalım) Mask seçeneğini işaretleyelim. bu katman altındaki resimlerin bulunduğu katmanı da Masked olarak oluşturalım. Şayet animasyonu süslemek isterseniz en üst kısma bir katman daha ekleyerek bizim yaptığımız gibi görsel eklentiler verebilirsiniz. Hazırlık tamam. Şimdi sıra kodlarda. 6- CTRL+F8`e basarak yeni bir klip oluşturalım. (mc_script) Bu klip içine hiçbir sembol konulmayacaktır. Sahnedeki animasyonu yönlendirecek kodlar eklenecektir. Anasahneye dönelim. Bu boş klibi kütüphaneden sahnenin herhangibir yerine çekelim. Boş daire şeklindeki klibi seçelim ve şu komutları atayalım: onClipEvent (load) { yukardaki komutlar fare hareketi ile animasyonun yukarı-aşağı kaymasında ihtiyaç duyacağımız işlemleri sağlar. Klip sahneye yüklendiğinde iki değişkeni film içine alıyor. sahneyuksekligi ve hiz. Hiz değeri ne kadar düşük olursa film sahnede o kadar hızla kayma yapar. Sahneyuksekligi değeri için kullanılan filmin yükseklik değerini yazın. Bizim filmimiz 300*400 piksel olduğundan 300 değeri verildi. Sonra yeniden onClipEvent komutunu verelim ve enterframe olayını seçelim. Enterframe olayında verilen kodlar devamlı tetiklendiğinden birkez değil sonsuz olarak tekrarlanacak ve animasyonumuz hiçbir zaman kesintiye uğramıyacaktır. ypozisyon değişkenine farenin o an bulunduğu y ekseninden sahneyuksekligi değerinin (300 değeri) yarısının çıkartılması ile elde edilen değeri atıyoruz. İkiye bölünme nedeni fare sahnenin üst yarısında ise animasyon aşağı alt yarısında ise animasyonun yukarı hareketini sağlamak içindir. 7- Sahneye dönelim ve foto film klibimizi çift tıklayarak açalım. Bildiğiniz gibi bu klip içinde örnek adı imaj olan film klibimiz vardır. Bu klibimizi seçelim ve şu komutları atayalım: onClipEvent (enterFrame)
{ klibe sonsuz döngüyü sağlaması için yine enterframe olayı atanmıştır. Burada yapılan işlem foto ve imaj kliplerinin _y düzlemini birbirine çakıştırmak içindir. 8- Şimdi bu klip timeline`ındaki mevcut olan tek kareyi seçelim: for (i=1; i<3; i++)
{ Bir döngü hazırlayarak imaj klibimizi çoğaltmaya başladık. Yapılan işlem klasik bir döngü i değişkeni 1 den başlayıp 3 olmadan sona erecek, yani i 1 ve 2 değerlerini alabilecek. Sonra bu değerler duplike komutu ile "image"+1 ve "image"+2 yani imaj1 ve imaj2 şeklinde kopyalanacak. Ve alttaki atanan _y düzlem değerleri ile asıl imaj animasyonunun peşine eklenerek kesintisiz bir kayma sağlayacak. Bu komutları daha önce gördünüz. Buradaki soru bu 3 değeri nereden bulundu olmalıdır. Niye 2 veya 10 değil de 3 ? Sorunun cevabı basit. Sahnemizin yüksekliği 300 piksel,kayan grafiğimizin yüksekliği ise 600 piksel üzerinde . Bu durumda asıl grafi sahneyi terkedip kopyası yerleştiğinde sahneyi tam doldurmalı ki animasyon kesik kesik olmasın.3 rakamı sahne yüksekliğinin en fazla 800 piksel kullanılacağı düşünülerek hazırlanmıştır. Şayet değeri 3 yerine 2 yazsa idik tek bir kopya hazırlanacaktı ve diğer asıl animasyon sahneden çıkar çıkmaz bu kopya eklendiğinde 800- 600=200 piksellik boş bir alan ortaya çıkacaktı. Bu nedenle 2 kopya dolayısı ile 3 değeri gereklidir. Peki 10 ya da 100 yazsak ne olur? Tabii ki animasyon kusursuz oynar, fazladan flash duplike işlemi yapar ki bu da animasyonun yüklenmesini yavaşlatır. Evet, hepsi bu. daha önce de belittiğim gibi, bu kodlar kullanılabilecek en basit kodlardır. Uygun kodlar bu olmayabilir ama animasyonunuz basit kodlarla hatasız çalışacaktır. Son bir not: Şayet butonlar üzerine gelindiğinde ayrıca bu butonun seçildiğine dair görsel bir eklenti isterseniz (örneğin parlama efekti vs gibi) butona bir rollOver efekt veya grafideki elemanlara bir tween işlemi yaptırabilirsiniz. |
