Flash'ta setMask ile Maskeleme Teknikleri

Bu dersimizde Flash içerisinde istediğimiz bir animasyonu Movie Klip olarak atayarak fotoğraflarımıza maske olarak eklemeyi göstermeye çalışacağım.

Bu dersimizde Flash içerisinde istediğimiz bir animasyonu Movie Klip olarak atayarak fotoğraflarımıza maske olarak eklemeyi göstermeye çalışacağım.

Arkaplandaki mantığı anladığınızda ilk başta çok karışık gibi gelsede eminim 2. ve 3. seferlerde Movie Klipleri daha etkili tasarlayıp muhteşem maskeler çıkaracaksınız. Mantığımız ise çok basit: maskelenecek bir foto (foto layerında) ve maske olacak bir movie klip ve setMask actionscripti ile bu movie klipi o fotonun instance name'i ile maskelemek.



Gelin hemen başlayalım,öncelikle bazı temel adımları atlıyorum uygulamalarımda herzaman için temel bir flash bilgisi(dosya oluşturma,layer açma,kopyalama gibi..) gerekecektir,kusura bakmayın. Alttaki gibi 2 farklı layer açalım ve alta maskeleyeceğimiz fotoğrafı ekleyelim. Daha sonra burada yukaryada örneğini koyduğum çalışmamı yapacağım,orada aslında ufak bir büyüyen daire movie klip olarak tutuluyor ve bu movie klip 8 kere yanyana eklenerek bir başka movie klipin içine bırakılıyor.Ve o 8 tane ufak movie klipi tutan movie klip actionscript ile maske olarak gösteriliyor. Bu yüzden önce bu ufak asnimasyonu ufak_maske adında CTRL-F8 ile yeni bir movie klipte tasarlayalım.



Ufak maske animasyonu maske efektini verecek animasyonumuzdur,burada
farklı şeylerde tasarlayabilirsiniz,özellikle Shape Hint ile eğitimlerde öğrencilerim değişik şeyler çıkarıyorlar. Ben kafa karıltırmasın diye basit bir shape tween ile büyüyen bir daire tasarlıyorum,alttaki gibi ve son frame de bir stop(); ekliyorum. Burada ufak_maske MovieKlipi içerisinde olduğumuzdan emin olalım.



Daha sonra ana sahnemize geri dönelim,yukarıdaki Scene 1 yazısına tıklayarak dönebilirsiniz. Şimdi ise bu ufak_maskeden onlarca tutacak maske olacak Movie Klipi yaratalım.Yine CTRL-F8 ile yeni bir MovieKlip yaratıyorum,ana_maske adını veriyorum ve içerisine libraryden(window-library ile açabilirsiniz) ufak_maske Movie Klipinden 4 sıralı çekiyorum.Ve bunları Window-Align ile kırmızı daire ile gösterdiğim gibi tepeden hizalayıp aralarını da eşitliyorum. Daha sonra 4ünü de shift ile seçip Alt tuşuna basılıyken bir alta sürükleyerek kopyalıyorum. Bu adımı gerektiği kadar çoğaltabilirsiniz.



Ana_Maske movie klipimizden de Scene 1 'e tıklayarak ana sahnemize çıkıyoruz ve Library açıkken Ana_Maske movie klipini sahneye Maske layerına bırakıyoruz. Alttaki gibi daireler tasarım olarak gözükecekler. CTRL-Enter ile flash palyerında önizlerseniz şuan maske özelliği kazanmadan animasyonunuz çalışıyor. Hemen o ana_maske movie klipini sahnede tutalım(arkaplandaki foto ile karışıyorsa foto layerını kitleyin böyleliklesadece movie klipi seçersiniz. Ona bir alttaki gibi instance name atayın.Instance Name'ler o elemanların actionscript kodlarıyla erişebilmemiz için taktığımız adlardır ve asla türkçe karakter,boşluk ve önceden tanımlı class isimleri(button,graphic..) olamaz.Ben daireler adını verdim.



Aynı şekilde fotoğrafımızı da actionscript ile çağıracağımızdan onu da seçip(kilitlediyseniz foto layerındaki kilidi kaldırıp) alttaki gibi foto instance name verelim.



Buraya kadar tasarım kısmını tamamladık. İş geldi yukarıdaki animasyonu alttaki instane name'ler atanmış fotoğrafa maske olarak atamaya. Bunun için sahnede 1.frame'e sağ tıklayıp actions kısmına girip eğer açıksa Script assisti kapatıyoruz çünkü kendi kodumuzu kendimiz yazağız.Öncelikle maske eklenecek fotoğrafın instance name yazıp daha sonra .setMask yazıyoruz ve parantez açıp çift tırnak içinde maske olacak movie klipin instance name'ini yazıyoruz,burada ben daireler verdim.



Yapamayanlar,çalıştıramayanlar buyrun fla dosyası tepe tepe kurcalayın :)


  • Etiketler;
Ercan Altuğ Yılmaz
1981 İstanbul doğumlu. Öğrencilik kariyerine Maltepe Üniversitesinde e-MBA yaparak devam etmektedir. <p>Eğitmenliğe 2000 yılında Akademi-İstanbul'da Web Tasarımı eğitimleri vermekle başladı. İznik Akademisi, Digiturk, Medyasoft, SmartPRO gibi yerlerden sonra, şu an Netron Bilişim Akademisi Web & Grafik Tasarım Ürünleri Eğitmenidir. <p> Sanalkurs.net üzerindeki dersleriyle de sizlere yol göstermeye devam edecek.
Yorum Yaz

Yorum yazabilmek için üye girişi yapmanız gerekiyor!

Çok Güzel VE İŞE YARAR... Ellerşn Dert Görmesin
Güzel bir ders ellerinize sağlık..
cok guzel anlatmissin tesekkurler
Öncelikle tşkler.Bir sorum olacak;bu işlemi sayfa üzerine dışarıdan çağırılan bir swf dosyası için nasıl yapabiliriz?
loadMovie ile gelecek swfi foto movie klibinin insyance name'ine atarsınız, yukarıdakiyle aynı işlemle devam. kolay gelsin...
slm.flash da bir resimden diğer resme animasyonlu şekilde geçmeyi nasıl yapıyorsunuz,cevap lütfen.
MERHABA ÇOK GÜZEL VE ÖZEL BİR SİTENİZ VAR BANA ÇOK YARDIMCI OLDU
hocam bu kaynak dosyaları nasıl indiricez tıkladığımızda karısık bir menu geliyor onumuze yaardımcı olurmusunuz

Yukarı Git