A.S 2.0 ile Tween Sınıfı ve Örnekler

Bu Dersimizde ActionScript 2.0 ile elimizle yaptığımız animasyonları kodlarla yapacağız.Bu işlerimize kolaylık getirecek ve profesyonelleşeceğiz...

Merhaba Arkadaşlar ;
bu dersimizde ActionScript 2.0 ile Tween Sınıfını işleyeceğiz... Bilindiği gibi tween'ler flashtaki animasyonların temelidir ve bunu orta seviyeliler genelde elleriyle yaparlar ama profesyonelliğe geçişte önemli bir adım olan Tween class Flash web siteleri yapan arkadaşlarımıza önemli bir tecrübe olacak...
Şimdi dersimize geçelim

Bildiğiniz üzere diğer programlama dillerinde olduğu gibi ActionScript'te de kütüphaneler var , Tween sınıfıda bunlardan birisi
işe ilk olarak gerekli kütüphanelerimizi ekleyerek başlayalım...


import mx.transitions.Tween;
// üstte tween sınıfını ekledik

import mx.transitions.easing.*;
/* burada ise tweenlerimize estetiklik kazandıracak olan easing kütüphanesini tamamıyla ekledik */



kütüphaneler bunlar arkadaşlar oynatmak için gerekli nesneyi çizdiğinizi varsayarak animasyon için gerekli kodları yazmaya geçiyorum...


var hareket:Tween = new Tween(nesne_adi,"_özelliği",easing tipi,başlangıç değeri,bitiş değeri,animasyon süresi,true);



kodumuzu inceleyelim...
[list]
[*] nesne_adi derken kastettiğimiz oynatmak için çizdiğimiz nesnemiz bu movieclip olabilir , button olabilir...
[*] "_özelliği derken kastettiğimiz nesnenin animasyon için kullanacağımız özelliğidir... örneğin soldan sağa bir hareket düşünüyorsak "_x" özelliğini kullanırız yada opacity ile bir animasyon düşünüyorsak "_alpha" özelliğini kullanırız...
[*] easing tipi derken kastettiğimiz ise animasyonun nasıl bir hareket izleyeceğidir... yani hızlanarak mı yoksa yavaşlayarak mı olsun hatta ilk önce geri sonra ilerimi gitsin gibisinden
bu easing tipinin ise türleri vardır...
------ Strong ,
------ Back ,
------ Elastic ,
------ Bounce,
------ Regular,
------ None,
bu türlerin ise standart 4 tane hareket tipi vardır...
---------------- easeOut ( hızlıdan yavaşa doğru )
---------------- easeIn ( yavaştan hızlıya doğru )
---------------- easeInOut ( yavaştan hızlıya hızlıdan yavaşa doğru )
---------------- easeNone ( hiçbir easing değeri olmadan normal bir hızda animasyon oynar )
[*] true derken kasttetiğimiz ise animasyonun süresinin saniye cinsinden mi yoksa frame cinsinden mi gerçekleşeceğidir... Eğer true ise saniye false ise frame cinsinden değerlendirilir. Tabi True yaparsanız animasyon süresine saniye cinsinden bir değer false dersenizde frame cinsinden bir değer yazmalısınız... Örneğin "1,true" yada "24,false"... Bildiğiniz gibi 1 sn = 24 frm
[/list]

bu kodlarda animasyonumuzun iskeletini oluşturan kodlar arkadaşlar hemen bir örnek yapalım bu kodlarla ilgili... örneğimizde bir nesneyi soldan sağa 100 px kaydırmak olsun...


var sagdansola:Tween = new Tween(_root.nesnem,"_x",Back.easeOut,0,400,1,true);



bu kodlarla animasyonumu şu şekilde hareket edecek
easing tipinde Back parametresi kullanıldığından dolayı nesnemiz ilk önce biraz sola kayacak ve sonra hızlanarak sağa kayacaktır... Back yerine örnekte verdiğim diğer parametreleride kullanabilirsiniz... Örneğin "Regular.easeOut yada Strong.easeIn"...
Bir Tüyo vereyim... Bounce tipini kullanmanızı tavsiye ederim çok eğlenceli oluyor...

evet arkadaşlar şimdi ise bu Tween classın olaylarına geçelim...
Tween Class'ın 2 olayı vardır Bunlardan birincisi ;

1. Animasyon Bittiğinde olayı = onMotionFinished()
bu özelliği az önce yazdığımız animasyonumuzda kullanalım...


var sagdansola:Tween = new Tween(_root.nesnem,"_x",Back.easeOut,0,400,1,true);

sagdansola.onMotionFinished = function()
{
          trace("Animasyonumuz Bitti");
}



bu olayla animasyonun bitiş anında OutPut'ta animasyonumuz bitti yazısını göreceğiz... Bu olayla animasyonun bitiş anını istediğimiz gibi kontrol edebilir animasyonun bitiş anına yeni bir animasyon dahi yazabiliriz...

şimdi geçelim 2. ve son olayımıza

2. Animasyon değiştiğinde olayı = onMotionChanged()

bu olayı az önce yazdığımız animasyonumzda uygulayalım...


sagdansola.onMotionChanged = function()
{
    trace("Animasyon Oynuyor...");
}



bu olay animasyon oynamaya devam ederken gerçekleşen olaydır... yani animasyon başladığında başlar animasyon bittiğinde ise biter... örneğimizde ise animasyonumuz başladğından itibaren OutPut Kısmında "Animasyon Oynuyor" Yazısını göreceğiz...

evet arkadaşlar animasyonumuzun son halinin kodları ise aşağıda olduğu gibi


import mx.transitions.Tween;
import mx.transitions.easing.*;

var sagdansola:Tween = new Tween(_root.nesnem,"_x",Back.easeOut,0,400,1,true);
sagdansola.onMotionFinished = function()
{
    trace("Animasyonumuz Bitti");
}
sagdansola.onMotionChanged = function()
{
    trace("Animasyon Oynuyor...");
}

ActionScript 2.0 ile Tween Sınıfı ile ilgili bir animasyon ve geniş bir anlatımı bitirdik arkadaşlar...
Yararlı Olması dileğiyle , Kolay Gelsin...

  • Etiketler;
Yorum Yaz

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

ufkumu genişleten bir ders oldu:kirp:Eline sağlık...

Yukarı Git