muratcdemirci
🏆Pro Tasarımcı🏆
Flash ile bir resim sunusu hazırlamak kolay bir işlemdir. Bu işlem için kullanacağınız resimler ve sunuyu çalıştırmak için birkaç actionscript kodu yeterlidir. Çalışmayı 2 safhada tamamlayacağız. Önce flash içine ekleyeceğimiz sembolleri tamamlayacak sonra da kodları ekleyeceğiz.
Şimdi sunumuzun planını oluşturalım: Yapmak istediğimiz üzerinde ileri ve geri butonları içeren bir çerçeve içinde resimlerimizi göstermektir. Fakat gösteriye görsellik kazandırmak için sahneden kaldırılacak ve eklenecek resimlerin bir solma efekti ile yer değiştirmesini düşünüyoruz. Ayrıca son resim açıldığında ileri butonunun ve ilk resim varken geri butonunun kaybolmasını da planladık. Böylece kullanıcı ilk veya son resimde olduğunu bilecektir. Bu işlem flash5 ile uzun kodlarla oluşturulabilir. Halbuki flash-mx`de butonlara örnek adı verilebildiğinden basit bir butonAdi._visible=false komutu ile buton görüntüsünü ortadan kaldırmak mümkün olmuştur.
1- Yeni bir flash sayfası açalım ve sembollerimizi oluşturalım. Dikdörtgen aracı ile dış kenarı olmayan bir dikdörtgen çizelim. Orta kısmını açmak için üzerine resimlerin sığacağı boyutta tekrar bir dikdörgen çizelim. Bu son dikdörtgeni seçerek silelim. Resim boşluğumuz oluştu. Bir tane buton hazırlayıp alt kısma yerleştirelim. Bunun bir örneğini daha diğerinin yanına koyalım. Modify-->Transform-->Flip Horizantal komutu ile 180 derece çevirelim. İleri ve geri butonlarımızda tamam.
2- CTRL+F8`e basarak sembol panelini açalım. Davranış olarak film klibini seçelim. Buraya her resim bir kareye yerleştirilecek şekilde resimlerimizi import edelim. Resimlerimiz önceden resim editörü ile boyutlamakta yarar vardır. Bu işlem flash içinde de yapılabilir fakat dosya boyutunu fazlası ile arttıracaktır. Bizim sunumuzda 4 adet resim vardır.Yani klip 4 kare içermektedir.Sahneye dönelim. Çerçeve katmanımızın alt kısmına yeni bir katman ekleyelim. Filmimizi bu katmana tam çerçevedeki boşluk hizasına yerleştirelim, örnek adı olarak resim yazalım.
Daha sonra ekleyeceğimiz kodların sürekli döngü yapabilmesi için her iki katmana da fazladan birer kare ekleyelim.
3- Sunumuz hazır. Şimdi sıra kodlarda: Sahnedeki filmimizi seçelim ve:
onClipEvent(load){
stop();
}
komutunu verelim. Bu komutla film yüklendiğinde oynamayacak ve ilk karede bekleyecektir.
4- Ana timeline`a dönelim. Buraya resimleri ileri ve geri götürme işlemi için bir fonksiyon yazacağız. En üst kısma 3. katmanı ekleyip aksiyonlar adını verin. 1.kareyi seçin şu komutları atayın:
function ilerleme(nereye){
resim.alfadegisimi=-5;
resim.hedefkare=resim._currentFrame+nereye;
}
Burası size karışık geliyorsa sık sorulan sorular bölümümüzde fonksiyonların hazırlanması kısmını inceleyin. İlerleme adı altında bir fonksiyon oluşturduk. Parametre olarak nereye ifadesi var. Solma efekti için resim klibimize atanan alfadegisimi`nin değerini -5 olarak verdik. Yani solma işlemi filmin her döngüsünde %5 oranında azalacak ve diğer gelecek filmde %5 artacaktır. Yine resim klibimize atana hedef kare değişkeninin değeri currentFrame yani o anda filmin bulunduğu kareye ait rakama (4 resim olduğundan 1 den 4 e kadar değişen bir rakam olacaktır) nereye parametresine atanacak rakamın eklenmesi ile oluşacak rakamdır. Bu işlem karışık gelebilir. Butonlara ait komutlara geçince niye böyle bir işlem yaptığımızı anlayacaksınız.
5- Şimdi ileri butonunu seçelim ve instance panelinde ileri olarak isim verelim. Bu isim ilerde butonların kaybolması için bize gerekecektir. Script panelimizi açalım ve:
on (release){
_root.ilerleme(1);
}
Komutunu verelim. Düğmeye bastığınızda az önce oluşturduğumuz ileri fonksiyonu çalışacaktır. nereye parametresine 1 değerinin verildiğine dikkat edin. Şimdi yukardaki foksiyonu niye yazdığımızı göreceksiniz. Ne yazmıştık:
resim.hedefkare=resim._currentFrame+nereye; Burada nereye değişkeninin değeri butona basıldığı anda 1 oluyor. _currentFrame o anda resim klibinin hangi karesinde olduğumuzu gösteren değer. Diyelim 2. karedeyiz. Bu durumda bu komutun değeri 2 dir . 2 ile nereye değişken değeri olan 1 rakamını toplayınca 3 oluyor. O halde butona basılınca film klibi 3. kareye geçecektir.
Şimdi geri butonuna tıklayalım, geri örnek adını verelim ve script paneline şu kodları atayalım:
on (release){
_root.ilerleme(-1);
}
Yukardaki örneği göz önüne aldığınızda geri butonuna basılınca 2-1=1 klip 1.kareye atlayacaktır.
6- Film klibimize dönelim ve sayfamlık işini halledelim. load klip olayı ile filmi ilk karede durdurmuştuk.Şimdi bir enterframe olayı ekleyeceğiz. İlk komutun hemen altına şunları ekleyin:
onClipEvent(enterFrame){
_alpha+=alfadegisimi;
if(_alpha<1){
gotoAndStop(hedefkare);
alfadegisimi=5;
}
if(_alpha>100){
alfadegisimi=0;
}
}
Niçin enterFrame kullandık. Bildiğiniz gibi bu klip olayında film herbaşa döndüğünde komutlar yeniden icra edilir. Diğer klip olaylarında ise bir kez işleme girer. EnterFrame olayı ile her komut icrasında alfa değeri %5 azalacak ve solma efekti işleme katılacaktır. Bunu yapmasa idik solma efektini oluşturamayacaktık.
_alpha+=alfadegisimi; filmin alfa değerine her tetiklenmede fonksiyonda alfadegisimi değişkenine değer olarak yazdığımız -5 azalma oluşacaktır. Bu azalma bize her tetiklenmede %5 lik bir alfa değer kaybını sağlayacak ve solma efekti oluşacaktır.Bu nereye kadar sürecek. Bir alt satırdaki if komutuna kadar . Burada şayet alfa değeri 1 den az ise fonksiyonlarda verdiğimiz hedef kare ye atlamamızı ve solma efektinin durmasını sağlar. Hemen altında alfadegisimi=5 ise yeni çıkan resmin alfa değerininde %5 lik değer artışını sağlar. Böylece yeni çıkan resimde önce soluk sonra giderek netleşen bir efekti bize verir. Değer 100 den büyük olursa alfadeğişim değeri sıfır yapılır ve 100+0= 100 olacağından resim netliği %100 alfa ile kalır.
Şu anda program çalışır. Fakat son kareye gelince hala ileri butonunun gözükmesi kullanıcıya başka bir resim olduğunu düşündürür. Bu hatayı önlemek için flash-mx nimetlerinden yararlanacağız. ileri ve geri butonlarına aynı adı taşıyan bir örnek isim vermiştik. Şimdi ana timeline`da fonksiyonumuzun olduğu kareyi seçelim ve script panelini açarak fonksiyonumuzun hemen altına şu komutları ekleyelim:
if(resim._currentFrame==4){
ileri._visible=false;
} else {
ileri._visible=true;
}
if(resim._currentFrame==1){
geri._visible=false;
} else {
geri._visible=true;
}
İfadeleri anlamak kolaydır. Filmimiz 4 kare idi. Şayet resim klibi 4. karede ise ileri butonu gösterme, değilse yani 4. kare dışında bir karede ise butonu göster anlamındadır. Aynı işlem geri butonu için 1. karede kulllanılır. Bu komutlar için flash-mx programı gereklidir.
Scriptlerimizin görüntüsü şöyle olacaktır:
resim klibi:
onClipEvent(load){
stop();
}
onClipEvent(enterFrame){
_alpha+=alfadegisimi;
if(_alpha<1){
gotoAndStop(hedefkare);
alfadegisimi=5;
}
if(_alpha>100){
alfadegisimi=0;
}
}
Timeline 1.kare:
function ilerleme(nereye){
resim.alfadegisimi=-5;
resim.hedefkare=resim._currentFrame+nereye;
}
if(resim._currentFrame==4){
ileri._visible=false;
} else {
ileri._visible=true;
}
if(resim._currentFrame==1){
geri._visible=false;
} else {
geri._visible=true;
}
ileri butonu:
on (release){
_root.ilerleme(1);
}
geri butonu:
on (release){
_root.ilerleme(-1);
}
Şimdi sunumuzun planını oluşturalım: Yapmak istediğimiz üzerinde ileri ve geri butonları içeren bir çerçeve içinde resimlerimizi göstermektir. Fakat gösteriye görsellik kazandırmak için sahneden kaldırılacak ve eklenecek resimlerin bir solma efekti ile yer değiştirmesini düşünüyoruz. Ayrıca son resim açıldığında ileri butonunun ve ilk resim varken geri butonunun kaybolmasını da planladık. Böylece kullanıcı ilk veya son resimde olduğunu bilecektir. Bu işlem flash5 ile uzun kodlarla oluşturulabilir. Halbuki flash-mx`de butonlara örnek adı verilebildiğinden basit bir butonAdi._visible=false komutu ile buton görüntüsünü ortadan kaldırmak mümkün olmuştur.
1- Yeni bir flash sayfası açalım ve sembollerimizi oluşturalım. Dikdörtgen aracı ile dış kenarı olmayan bir dikdörtgen çizelim. Orta kısmını açmak için üzerine resimlerin sığacağı boyutta tekrar bir dikdörgen çizelim. Bu son dikdörtgeni seçerek silelim. Resim boşluğumuz oluştu. Bir tane buton hazırlayıp alt kısma yerleştirelim. Bunun bir örneğini daha diğerinin yanına koyalım. Modify-->Transform-->Flip Horizantal komutu ile 180 derece çevirelim. İleri ve geri butonlarımızda tamam.
2- CTRL+F8`e basarak sembol panelini açalım. Davranış olarak film klibini seçelim. Buraya her resim bir kareye yerleştirilecek şekilde resimlerimizi import edelim. Resimlerimiz önceden resim editörü ile boyutlamakta yarar vardır. Bu işlem flash içinde de yapılabilir fakat dosya boyutunu fazlası ile arttıracaktır. Bizim sunumuzda 4 adet resim vardır.Yani klip 4 kare içermektedir.Sahneye dönelim. Çerçeve katmanımızın alt kısmına yeni bir katman ekleyelim. Filmimizi bu katmana tam çerçevedeki boşluk hizasına yerleştirelim, örnek adı olarak resim yazalım.
Daha sonra ekleyeceğimiz kodların sürekli döngü yapabilmesi için her iki katmana da fazladan birer kare ekleyelim.
3- Sunumuz hazır. Şimdi sıra kodlarda: Sahnedeki filmimizi seçelim ve:
onClipEvent(load){
stop();
}
komutunu verelim. Bu komutla film yüklendiğinde oynamayacak ve ilk karede bekleyecektir.
4- Ana timeline`a dönelim. Buraya resimleri ileri ve geri götürme işlemi için bir fonksiyon yazacağız. En üst kısma 3. katmanı ekleyip aksiyonlar adını verin. 1.kareyi seçin şu komutları atayın:
function ilerleme(nereye){
resim.alfadegisimi=-5;
resim.hedefkare=resim._currentFrame+nereye;
}
Burası size karışık geliyorsa sık sorulan sorular bölümümüzde fonksiyonların hazırlanması kısmını inceleyin. İlerleme adı altında bir fonksiyon oluşturduk. Parametre olarak nereye ifadesi var. Solma efekti için resim klibimize atanan alfadegisimi`nin değerini -5 olarak verdik. Yani solma işlemi filmin her döngüsünde %5 oranında azalacak ve diğer gelecek filmde %5 artacaktır. Yine resim klibimize atana hedef kare değişkeninin değeri currentFrame yani o anda filmin bulunduğu kareye ait rakama (4 resim olduğundan 1 den 4 e kadar değişen bir rakam olacaktır) nereye parametresine atanacak rakamın eklenmesi ile oluşacak rakamdır. Bu işlem karışık gelebilir. Butonlara ait komutlara geçince niye böyle bir işlem yaptığımızı anlayacaksınız.
5- Şimdi ileri butonunu seçelim ve instance panelinde ileri olarak isim verelim. Bu isim ilerde butonların kaybolması için bize gerekecektir. Script panelimizi açalım ve:
on (release){
_root.ilerleme(1);
}
Komutunu verelim. Düğmeye bastığınızda az önce oluşturduğumuz ileri fonksiyonu çalışacaktır. nereye parametresine 1 değerinin verildiğine dikkat edin. Şimdi yukardaki foksiyonu niye yazdığımızı göreceksiniz. Ne yazmıştık:
resim.hedefkare=resim._currentFrame+nereye; Burada nereye değişkeninin değeri butona basıldığı anda 1 oluyor. _currentFrame o anda resim klibinin hangi karesinde olduğumuzu gösteren değer. Diyelim 2. karedeyiz. Bu durumda bu komutun değeri 2 dir . 2 ile nereye değişken değeri olan 1 rakamını toplayınca 3 oluyor. O halde butona basılınca film klibi 3. kareye geçecektir.
Şimdi geri butonuna tıklayalım, geri örnek adını verelim ve script paneline şu kodları atayalım:
on (release){
_root.ilerleme(-1);
}
Yukardaki örneği göz önüne aldığınızda geri butonuna basılınca 2-1=1 klip 1.kareye atlayacaktır.
6- Film klibimize dönelim ve sayfamlık işini halledelim. load klip olayı ile filmi ilk karede durdurmuştuk.Şimdi bir enterframe olayı ekleyeceğiz. İlk komutun hemen altına şunları ekleyin:
onClipEvent(enterFrame){
_alpha+=alfadegisimi;
if(_alpha<1){
gotoAndStop(hedefkare);
alfadegisimi=5;
}
if(_alpha>100){
alfadegisimi=0;
}
}
Niçin enterFrame kullandık. Bildiğiniz gibi bu klip olayında film herbaşa döndüğünde komutlar yeniden icra edilir. Diğer klip olaylarında ise bir kez işleme girer. EnterFrame olayı ile her komut icrasında alfa değeri %5 azalacak ve solma efekti işleme katılacaktır. Bunu yapmasa idik solma efektini oluşturamayacaktık.
_alpha+=alfadegisimi; filmin alfa değerine her tetiklenmede fonksiyonda alfadegisimi değişkenine değer olarak yazdığımız -5 azalma oluşacaktır. Bu azalma bize her tetiklenmede %5 lik bir alfa değer kaybını sağlayacak ve solma efekti oluşacaktır.Bu nereye kadar sürecek. Bir alt satırdaki if komutuna kadar . Burada şayet alfa değeri 1 den az ise fonksiyonlarda verdiğimiz hedef kare ye atlamamızı ve solma efektinin durmasını sağlar. Hemen altında alfadegisimi=5 ise yeni çıkan resmin alfa değerininde %5 lik değer artışını sağlar. Böylece yeni çıkan resimde önce soluk sonra giderek netleşen bir efekti bize verir. Değer 100 den büyük olursa alfadeğişim değeri sıfır yapılır ve 100+0= 100 olacağından resim netliği %100 alfa ile kalır.
Şu anda program çalışır. Fakat son kareye gelince hala ileri butonunun gözükmesi kullanıcıya başka bir resim olduğunu düşündürür. Bu hatayı önlemek için flash-mx nimetlerinden yararlanacağız. ileri ve geri butonlarına aynı adı taşıyan bir örnek isim vermiştik. Şimdi ana timeline`da fonksiyonumuzun olduğu kareyi seçelim ve script panelini açarak fonksiyonumuzun hemen altına şu komutları ekleyelim:
if(resim._currentFrame==4){
ileri._visible=false;
} else {
ileri._visible=true;
}
if(resim._currentFrame==1){
geri._visible=false;
} else {
geri._visible=true;
}
İfadeleri anlamak kolaydır. Filmimiz 4 kare idi. Şayet resim klibi 4. karede ise ileri butonu gösterme, değilse yani 4. kare dışında bir karede ise butonu göster anlamındadır. Aynı işlem geri butonu için 1. karede kulllanılır. Bu komutlar için flash-mx programı gereklidir.
Scriptlerimizin görüntüsü şöyle olacaktır:
resim klibi:
onClipEvent(load){
stop();
}
onClipEvent(enterFrame){
_alpha+=alfadegisimi;
if(_alpha<1){
gotoAndStop(hedefkare);
alfadegisimi=5;
}
if(_alpha>100){
alfadegisimi=0;
}
}
Timeline 1.kare:
function ilerleme(nereye){
resim.alfadegisimi=-5;
resim.hedefkare=resim._currentFrame+nereye;
}
if(resim._currentFrame==4){
ileri._visible=false;
} else {
ileri._visible=true;
}
if(resim._currentFrame==1){
geri._visible=false;
} else {
geri._visible=true;
}
ileri butonu:
on (release){
_root.ilerleme(1);
}
geri butonu:
on (release){
_root.ilerleme(-1);
}
