WaTcHFuL
EVERYWHERE
- Katılım
- 10 Kas 2005
- Mesajlar
- 10,456
- Reaction score
- 0
- Puanları
- 0
Mouse trailers (fare efektleri) hazırlama zannedildiği kadar zor bir işlem değildir. Genelde kullanılan iki yöntem mevcuttur. Bu yöntemlerin prensipleri kavrandığında geliştirilmeye fazlası ile açıktır. İlk yöntemde fare ve klibin x ve y koordinatları ayarlanarak işlem tamamlanmakta, ikinci yöntemde ise startDrag komutu kullanılmaktadır. Aslında bu tür bir ayırım mevcut değildir ve başka yöntemlerle de fare efekti hazırlanabilir. Bu tür bir ayırımı yapmamızın tek nedeni anlatımı kolaylaştırmak içindir.
Koordinat ayarlaması ile fare efekti hazırlama
Bu yöntemde önce 3 işlemi oluşturmalısınız:
1- Fareyi takip edecek bir film klibi hazırlamak
2- İkinci bir film klibi oluşturmak.Bu film klibi boş olacaktır. İçinde sadece asıl film klibini yönlendirecek actionscript kodları bulunacaktır.
3- Boş film klibi içindeki kodları kullanabilmek için bu film klibini asıl film klibi içine yerleştirdikten sonra sahneye almak
Animasyonu izlerken fareyi takip eden şeklin fareye yaklaştıkça hızının azaldığına , uzak iken daha hızla yaklaştığına dikkat edin. Şimdi açıklamalara başlayalım:
1- Önce sahneye hiçbirşey eklemeyin. Doğrudan ctrl+F8`e basıp bir film klibi oluşturun. Bu klip fareyi takip eden animasyonu taşıyacaktır. Buraya bir resim veya örnekte olduğu gibi bir hareket animasyonu ekleyin.
2- İşiniz bittiğinde tekrar CTRL+F8`e basıp yeni bir film klibi oluşturun. Bu klip boş kalacak ve sadece kodları içerecektir. Kod yazılan tek yer de burasıdır. Zaman çizgisine 2 keyframe daha ekleyin, böylece
3 keyframe`e sahip olacaksınız. 1.kareyi seçin ve şu kodları ekleyin:
x=_parent._x;
y=_parent._y;
hedefx=0;
hedefy=0;
Bu boş klip animasyonlu klip içine yerleştirileceğinden _parent ifadesi kullanılmıştır. _parent bir üstündeki film klibini yani animasyonlu film klibini hedefler.
x=_parent._x;
y=_parent._y;
İlk 2 dizideki bu komutlarla animasyonlu klibin x ve y koordinatları bu x ve y değişkenine değer olarak atanır.Burada amaç boş film klibi ile animasyonlu klibin x ve y koordinatlarını eşitlemektir.
hedefx=0;
hedefy=0;
Hedefimiz nedir? Animasyonlu film klibimizi farenin hareketlerine eşlemektir.Neden? Bu belli. Fareyi her hareket ettirdiğimizde şeklinde imleçe yaklaşması için. O zaman farenin x ve y koordinatlarını bulmalıyız. Ama önce bu koordinatları sıfırdan başlatmak gereklidir. Bu koordinatlara hedefx ve hedefy değişken adını verelim ve yukarda gördüğünüz gibi sıfıra eşleyelim.
3- Zaman çizgisinde 2.kareyi seçip şu komutları atayın:
hedefx=_root._xmouse;
hedefy=_root._ymouse;
mesafex=hedefx-x;
mesafey=hedefy-y;
x=Math.round(x+(mesafex/20));
y=Math.round(y+(mesafey/20));
_parent._x=x;
_parent._y=y;
Açıklayalım:
hedefx=_root._xmouse;
hedefy=_root._ymouse;
Fare koordinatlarını sıfırdan başlattıktan sonra yukardaki komutla hedefx ve y değerini farenin o anda sahnede bulunduğu x ve y koordinatlarına atayalım. Şimdiye kadar şunları yaptık. Animasyonlu klibin x ve y değerini, ayrıca imleçin x ve y değerlerini bir değişkene atadık. Sıra geldi, animasyonlu klip ile fare arasındaki mesafe farkına:
mesafex=hedefx-x;
mesafey=hedefy-y;
Yukardaki komutları anlamak kolay. Fare ile klip arasındaki o andaki mesafe farkını bulmak için x ve y değerlerini birbirinden çıkartıyoruz.
x=Math.round(x+(mesafex/20));
y=Math.round(y+(mesafey/20));
Bizim istediğimiz animasyonun daha güzel gözükmesi için klip imlece yaklaştıkça hızında azalma olmasıdır. O zaman yapılacak tek şey klibin x ve y değerlerine rakamsal eklenti yapmak. Ne yaptık? x değerine klip ile imleç arasındaki mesafe farkının 20 ye bölümüyle elde edilen rakamı ekledik ve onu x değişkenine atadık. math.round eklentisi sonucun küsüratını kaldırarak komutların daha hızlı çalışması içindir.Aradaki mesafe 100 piksel ise 100/20=5 piksel imleçe yaklaşacaktır. Mesafe 60 piksele indiğinde 60/20=3 piksel hız kazanacaktır. Böylece imlece yaklaşınca klibin hızı azalmış olacaktır. 20 rakamı büyüdükçe klibin yaklaşma hızı azalır. Bu rakamı istediğiniz gibi değiştirebilirsiniz.
_parent._x=x;
_parent._y=y;
Herşey hazır. Son olarak imleç hareketsiz kaldığında x ve y değerlerini sabitlemek için yukardaki komutları ekliyoruz.
4- Zaman çizgisinde 3.kareyi seçip şu komutu ekleyin:
gotoAndPlay(2);
Burada açıklanacak birşey yok. Amaç komutların devamlı çalışması için flash oynatma kafasını 2.kareye göndermektir.
5- Yerleştirmeye başlayalım. Hala sahnede hiçbirşey yapılmadı ve boş gözükmekte. Elimizde bir animasyonlu bir de sadece kodları içeren boş film klibi var. Kütüphanede animasyonlu klibe çift tıkla
yarak açalım. Yine kütüphaneden boş ve kodları içeren klibi çekerek animasyonlu klibin içine yerleştirelim. Yerleşim konumunun önemi yoktur, klip içinde olsun yeter .
6- Ana sahneye dönelim. Kütüphaneden içine boş klibi yerleştirdiğimiz animasyonlu klibi çekerek sahnenin ortasına bırakalım. CTRL+Enter`a basıp filmimizi izleyebiliriz.
startDrag komutu ile fare efekti hazırlamak
Kabaca görülenler şunlardır. bir damla hareketi imleçi takip ediyor ve rastgele tesbit edilen alanlarda çoğaltılmış örnekleri izleniyor. Burada mutlaka hareketli bir animasyon kullanmak zorunda değilsiniz. Çizeceğiniz bir daire de işinizi görecektir. Şimdi animasyonu oluşturalım:
1- Yeni bir sahne açalım ve zaman çizgisine toplam 3 keyframe atayalım. Bunlar kodlar için kullanılacaktır. Katmana aksiyonlar adını verelim.
2- Bu katmanın üstüne yeni bir katman ekleyelim. fareyi takip edecek film klibimizi kütüphaneden sahneye çekelim. Biz damlanın akışını simgeleyen bir film klibi oluşturduk. Örnek adı olarak damla adını verdik.
3- Aksiyonlar katmanındaki 1.kareyi seçelim ve şu komutu atayalım:
startDrag("damla", true);
Bu komutla damla örnek adlı klibimizi çekmeye başladık.
4- İkinci kareyi seçelim:
kopya_sayisi = kopya_sayisi+1;
if (kopya_sayisi>10) {
kopya_sayisi = 1;
}
duplicateMovieClip("damla", "damla"+kopya_sayisi, kopya_sayisi);
setProperty("damla" +kopya_sayisi, _x, getProperty ( "damla" +kopya_sayisi, _x) + random (30) - 15);
setProperty("damla" +kopya_sayisi, _y, getProperty ( "damla" +kopya_sayisi, _y) + random (30) - 15);
Açıklamaya başlayalım:
kopya_sayisi = kopya_sayisi+1;
if (kopya_sayisi>10) {
kopya_sayisi = 1;
}
Tek bir klip etkili bir görsellik oluşturmayacağından klip sayısını arttırma işlemi uyguluyoruz. İlk dizinde klip sayısını birer birer arttırmaya başlıyoruz. Bu arttırma işlemini if komutu ile 10 da sınırlıyoruz. Klip sayısı 10 değerine ulaştığında değeri tekrar bir olarak düzeltiyoruz.
kopya_sayisi = kopya_sayisi+1; komutunda bıraksa idik sonsuz klip oluşacağından oldukça kötü bir görüntü gözlenecekti.
duplicateMovieClip("damla", "damla"+kopya_sayisi, kopya_sayisi);
Bu komutla filmimizi çoğaltmaya başlıyoruz. Bildiğiniz gibi çoğaltılan her klibin adı ve derinlik düzeyi farklı olmalıdır. Burada damla film klibi çoğaltılıyor , kopya kliplerin adları "damla"+kopya_sayisi(yani damla1, damla2,.....damla9) olarak atanıyor, derinlik düzeyi de 1 den 9`a kadar değişiyor. Çünkü biz kopya sayısını daha önceden birer birer arttırdık ve artıma 9 sayısına kadar izin verdik.
setProperty("damla" +kopya_sayisi, _x, getProperty ( "damla" +kopya_sayisi, _x) + random (30) - 15);
setProperty("damla" +kopya_sayisi, _y, getProperty ( "damla" +kopya_sayisi, _y) + random (30) - 15);
Yine bildiğiniz gibi kopya klipler tam orjinalinin üzerinde oluşur, bu nedenle onları görmek için setProperty komutu ile x ve y düzlemindeki yerlerini değiştirmemiz gerekir. Buradaki "damla" +kopya_sayisi(yani damla1,damla2...damla9) x özelliği değişecek klibin adını , getProperty ( "damla" +kopya_sayisi, _x) + random (30) - 15) ise klibin yeni x düzlemini ifade etmektedir. getProperty ile damla klipler grubunun x değerini alıp farklı yerlerde oluşması için randomize bir sayı ile çarpıyoruz. 30 ve 15 değerleri özel bir amaç taşımıyor, deneme ve yanılma yoluyla en iyi görüntünün bu rakamlarla verildiğine inandığımız için kullanılmıştır. Siz bunu değiştirebilirsiniz. Aynı işlemi y düzlemi içinde uygulayın.
5- 3. kareyi seçin ve animasyonun devamı için şu komutu verin:
gotoAndPlay(2);
6- CTRL+Enter`a basarak filminizi test edin.
Koordinat ayarlaması ile fare efekti hazırlama
Bu yöntemde önce 3 işlemi oluşturmalısınız:
1- Fareyi takip edecek bir film klibi hazırlamak
2- İkinci bir film klibi oluşturmak.Bu film klibi boş olacaktır. İçinde sadece asıl film klibini yönlendirecek actionscript kodları bulunacaktır.
3- Boş film klibi içindeki kodları kullanabilmek için bu film klibini asıl film klibi içine yerleştirdikten sonra sahneye almak
Animasyonu izlerken fareyi takip eden şeklin fareye yaklaştıkça hızının azaldığına , uzak iken daha hızla yaklaştığına dikkat edin. Şimdi açıklamalara başlayalım:
1- Önce sahneye hiçbirşey eklemeyin. Doğrudan ctrl+F8`e basıp bir film klibi oluşturun. Bu klip fareyi takip eden animasyonu taşıyacaktır. Buraya bir resim veya örnekte olduğu gibi bir hareket animasyonu ekleyin.
2- İşiniz bittiğinde tekrar CTRL+F8`e basıp yeni bir film klibi oluşturun. Bu klip boş kalacak ve sadece kodları içerecektir. Kod yazılan tek yer de burasıdır. Zaman çizgisine 2 keyframe daha ekleyin, böylece
3 keyframe`e sahip olacaksınız. 1.kareyi seçin ve şu kodları ekleyin:
x=_parent._x;
y=_parent._y;
hedefx=0;
hedefy=0;
Bu boş klip animasyonlu klip içine yerleştirileceğinden _parent ifadesi kullanılmıştır. _parent bir üstündeki film klibini yani animasyonlu film klibini hedefler.
x=_parent._x;
y=_parent._y;
İlk 2 dizideki bu komutlarla animasyonlu klibin x ve y koordinatları bu x ve y değişkenine değer olarak atanır.Burada amaç boş film klibi ile animasyonlu klibin x ve y koordinatlarını eşitlemektir.
hedefx=0;
hedefy=0;
Hedefimiz nedir? Animasyonlu film klibimizi farenin hareketlerine eşlemektir.Neden? Bu belli. Fareyi her hareket ettirdiğimizde şeklinde imleçe yaklaşması için. O zaman farenin x ve y koordinatlarını bulmalıyız. Ama önce bu koordinatları sıfırdan başlatmak gereklidir. Bu koordinatlara hedefx ve hedefy değişken adını verelim ve yukarda gördüğünüz gibi sıfıra eşleyelim.
3- Zaman çizgisinde 2.kareyi seçip şu komutları atayın:
hedefx=_root._xmouse;
hedefy=_root._ymouse;
mesafex=hedefx-x;
mesafey=hedefy-y;
x=Math.round(x+(mesafex/20));
y=Math.round(y+(mesafey/20));
_parent._x=x;
_parent._y=y;
Açıklayalım:
hedefx=_root._xmouse;
hedefy=_root._ymouse;
Fare koordinatlarını sıfırdan başlattıktan sonra yukardaki komutla hedefx ve y değerini farenin o anda sahnede bulunduğu x ve y koordinatlarına atayalım. Şimdiye kadar şunları yaptık. Animasyonlu klibin x ve y değerini, ayrıca imleçin x ve y değerlerini bir değişkene atadık. Sıra geldi, animasyonlu klip ile fare arasındaki mesafe farkına:
mesafex=hedefx-x;
mesafey=hedefy-y;
Yukardaki komutları anlamak kolay. Fare ile klip arasındaki o andaki mesafe farkını bulmak için x ve y değerlerini birbirinden çıkartıyoruz.
x=Math.round(x+(mesafex/20));
y=Math.round(y+(mesafey/20));
Bizim istediğimiz animasyonun daha güzel gözükmesi için klip imlece yaklaştıkça hızında azalma olmasıdır. O zaman yapılacak tek şey klibin x ve y değerlerine rakamsal eklenti yapmak. Ne yaptık? x değerine klip ile imleç arasındaki mesafe farkının 20 ye bölümüyle elde edilen rakamı ekledik ve onu x değişkenine atadık. math.round eklentisi sonucun küsüratını kaldırarak komutların daha hızlı çalışması içindir.Aradaki mesafe 100 piksel ise 100/20=5 piksel imleçe yaklaşacaktır. Mesafe 60 piksele indiğinde 60/20=3 piksel hız kazanacaktır. Böylece imlece yaklaşınca klibin hızı azalmış olacaktır. 20 rakamı büyüdükçe klibin yaklaşma hızı azalır. Bu rakamı istediğiniz gibi değiştirebilirsiniz.
_parent._x=x;
_parent._y=y;
Herşey hazır. Son olarak imleç hareketsiz kaldığında x ve y değerlerini sabitlemek için yukardaki komutları ekliyoruz.
4- Zaman çizgisinde 3.kareyi seçip şu komutu ekleyin:
gotoAndPlay(2);
Burada açıklanacak birşey yok. Amaç komutların devamlı çalışması için flash oynatma kafasını 2.kareye göndermektir.
5- Yerleştirmeye başlayalım. Hala sahnede hiçbirşey yapılmadı ve boş gözükmekte. Elimizde bir animasyonlu bir de sadece kodları içeren boş film klibi var. Kütüphanede animasyonlu klibe çift tıkla
yarak açalım. Yine kütüphaneden boş ve kodları içeren klibi çekerek animasyonlu klibin içine yerleştirelim. Yerleşim konumunun önemi yoktur, klip içinde olsun yeter .
6- Ana sahneye dönelim. Kütüphaneden içine boş klibi yerleştirdiğimiz animasyonlu klibi çekerek sahnenin ortasına bırakalım. CTRL+Enter`a basıp filmimizi izleyebiliriz.
startDrag komutu ile fare efekti hazırlamak
Kabaca görülenler şunlardır. bir damla hareketi imleçi takip ediyor ve rastgele tesbit edilen alanlarda çoğaltılmış örnekleri izleniyor. Burada mutlaka hareketli bir animasyon kullanmak zorunda değilsiniz. Çizeceğiniz bir daire de işinizi görecektir. Şimdi animasyonu oluşturalım:
1- Yeni bir sahne açalım ve zaman çizgisine toplam 3 keyframe atayalım. Bunlar kodlar için kullanılacaktır. Katmana aksiyonlar adını verelim.
2- Bu katmanın üstüne yeni bir katman ekleyelim. fareyi takip edecek film klibimizi kütüphaneden sahneye çekelim. Biz damlanın akışını simgeleyen bir film klibi oluşturduk. Örnek adı olarak damla adını verdik.
3- Aksiyonlar katmanındaki 1.kareyi seçelim ve şu komutu atayalım:
startDrag("damla", true);
Bu komutla damla örnek adlı klibimizi çekmeye başladık.
4- İkinci kareyi seçelim:
kopya_sayisi = kopya_sayisi+1;
if (kopya_sayisi>10) {
kopya_sayisi = 1;
}
duplicateMovieClip("damla", "damla"+kopya_sayisi, kopya_sayisi);
setProperty("damla" +kopya_sayisi, _x, getProperty ( "damla" +kopya_sayisi, _x) + random (30) - 15);
setProperty("damla" +kopya_sayisi, _y, getProperty ( "damla" +kopya_sayisi, _y) + random (30) - 15);
Açıklamaya başlayalım:
kopya_sayisi = kopya_sayisi+1;
if (kopya_sayisi>10) {
kopya_sayisi = 1;
}
Tek bir klip etkili bir görsellik oluşturmayacağından klip sayısını arttırma işlemi uyguluyoruz. İlk dizinde klip sayısını birer birer arttırmaya başlıyoruz. Bu arttırma işlemini if komutu ile 10 da sınırlıyoruz. Klip sayısı 10 değerine ulaştığında değeri tekrar bir olarak düzeltiyoruz.
kopya_sayisi = kopya_sayisi+1; komutunda bıraksa idik sonsuz klip oluşacağından oldukça kötü bir görüntü gözlenecekti.
duplicateMovieClip("damla", "damla"+kopya_sayisi, kopya_sayisi);
Bu komutla filmimizi çoğaltmaya başlıyoruz. Bildiğiniz gibi çoğaltılan her klibin adı ve derinlik düzeyi farklı olmalıdır. Burada damla film klibi çoğaltılıyor , kopya kliplerin adları "damla"+kopya_sayisi(yani damla1, damla2,.....damla9) olarak atanıyor, derinlik düzeyi de 1 den 9`a kadar değişiyor. Çünkü biz kopya sayısını daha önceden birer birer arttırdık ve artıma 9 sayısına kadar izin verdik.
setProperty("damla" +kopya_sayisi, _x, getProperty ( "damla" +kopya_sayisi, _x) + random (30) - 15);
setProperty("damla" +kopya_sayisi, _y, getProperty ( "damla" +kopya_sayisi, _y) + random (30) - 15);
Yine bildiğiniz gibi kopya klipler tam orjinalinin üzerinde oluşur, bu nedenle onları görmek için setProperty komutu ile x ve y düzlemindeki yerlerini değiştirmemiz gerekir. Buradaki "damla" +kopya_sayisi(yani damla1,damla2...damla9) x özelliği değişecek klibin adını , getProperty ( "damla" +kopya_sayisi, _x) + random (30) - 15) ise klibin yeni x düzlemini ifade etmektedir. getProperty ile damla klipler grubunun x değerini alıp farklı yerlerde oluşması için randomize bir sayı ile çarpıyoruz. 30 ve 15 değerleri özel bir amaç taşımıyor, deneme ve yanılma yoluyla en iyi görüntünün bu rakamlarla verildiğine inandığımız için kullanılmıştır. Siz bunu değiştirebilirsiniz. Aynı işlemi y düzlemi içinde uygulayın.
5- 3. kareyi seçin ve animasyonun devamı için şu komutu verin:
gotoAndPlay(2);
6- CTRL+Enter`a basarak filminizi test edin.