?> Image Gallery Tutorial - photoders
Site » Flash Gallery

Image Gallery Tutorial

[ 19 Mar 2008 | 7 Yorum ]

photodersFlash çalışmamızda resim galerisi yapacağız
ilk olarak yeni bir çalışma sayfası açalım 400×500 px örnek resimdeki px değerlerde şekli oluşturalım şekli hazırladıktan sonra F8 movie klip yapalım name bg olsun
null
Çalışmada kullanacağımız resimleri hazırlayalım küçük resimler 64×56 px olsun resim adı olarak thumb-0 dan başlayarak thumb-7 kadar isim verelim.
Küçük resimleri kütüphaneye import edelim tek tek sahneye alarak movie klip yapalım name kısmına thumb0 dan başlayarak thumb0 kadar name kısmına isimleri verelim örnek resim
null
Büyük resimleri hazırlayalım 320×220 px olsun resimlere isim verelim image-0 dan başlayarak image-7 kadar sıralı olarak verelim sıralama küçük resim thumb-0 ile büyük resim image-0 aynı olmalı.
Büyük resimleri kütüphaneye import edelim her birini sahneye alarak F8 movie klip yapalım name kısımlarına image0 dan başlayarak image7 kadar sıralı olsun örnek resim

Sahnede örnek resimdeki çizimi yapalım çizimi kopyalayalım tamamlanınca seçili durumda F8 Movie klip yapalım name mask0 olsun kütüphanede mask0 üzerinde sağ klik yapalım linkage seçelimExport for Actionscript seçeneğini işaretliyelim bunu unutmayın
null
Aynı çizimi kopyalamıştık şimdi yeniden sahneye paste yapalım ters çevirelim yukarı bakan sivri uçları rotate aracı kullanarak 90 derece çevirsek mask0 karşılığı olur çevirme işlemini tamam ladıktan sonra F8 movie klip yapalım name mask1 olsun üzerinde sağ klik yapalım linkage seçelimExport for Actionscript seçeneğini işaretliyelim bunu unutmayın
null
Sahnedeki scene1 bg movie klipimizi seçili yapalım F8 movie klip yapalım name gallery olsun gallery klipin içine girelim ilk layer adı bg olsun yeni bir layer ekleyelim layer adı thumbs olsun küçük resimlerin adı thumbs layer üzerinde kütüphaneden sıra ile thumb0 klip den başlayarak yerleştirelim her yerleştirdiğimizde instance name kısmına klipin adın yazalım unutmayın resimde sıralamayıda size resim üzerinde gösterdim.
null
Yeni bir layer daha ekleyelim layer adı script olsun verdiğim kodları ekleyelim F9

order = [["0", "1", "2", "3", "4", "5", "6", "7"],
["4", "7", "5", "2", "0", "3", "6", "1"]];
for (var j = 0; j var i = this.createEmptyMovieClip("images"+j, j);
var m = this.attachMovie("mask"+j, "mask"+j, 100+j);
m._x = target0=target1=25;
m._y = 200;
i._y = 200;
i.setMask(m);
for (var k = 0; k var img = i.attachMovie("image"+order[j][k], "image"+imageCount, 1000+k);
img._x = (img._width*k);
var thumb = this["thumb"+order[j][k]];
thumb["pos"+j] = target1+(k*-img._width);
thumb.onPress = function() {
target0 = this.pos0;
target1 = this.pos1;
};
thumb.onRollOver = function() {
this._alpha = 60;
};
thumb.onRollOut = function() {
this._alpha = 100;
};
}
}
target0 = thumb4.pos0;
target1 = thumb4.pos1;
speed = 10;
this.onEnterFrame = function() {
images0._x += ((target0)-images0._x)/speed;
images1._x += ((target1)-images1._x)/speed;
};
Çalışmamızı test edebiliriz
CTRL+ENTER

 

FLA İndir

İzle

 

Etiket:

7 Yorum »

Yorum Yazın

Konuyla ilgili yorumlarınızı aşağıya yazabilir diğer okuyucularla paylaşabilirsiniz, yazıdan alıntı yapacak olursanız geribildirim yapmayı unutmayın.. Yazıdaki yorumları RSS olarak takip etmek için tıklayınız .

Yorum yazarken dikkat etmeniz gereken hususlar;

  • Spam ve reklam içerikli yorumlar silinecektir.
  • Yorumlar onay gerektirdiğinden birden fazla kez aynı yorumu yazmayınız.
  • Yorumlarınızın konu ile alakalı olmasına özen gösteriniz.
  • Küfür, hakaret etmenizin kimseye faydası olmadığını unutmayın.
  • Yorum yapmanız, onaylanacağı anlamına gelmemektedir. Buradaki hususlara dikkat etmeniz, onaylanma şansını artıracaktır.

    • Güvenlik Kodunun Resmi
    *

    Kapat
    E-posta ile paylaş