Preloader – Ön Yükleyici

Haziran 24, 2008 at 1:01 pm (Ders) (, , , , , , , , , , , , , , , , , )

ActionScript 3 de ön yükleyici yapalım. Önce ilk frame’de sahneye alt ve ust adında preloader’ın alt ve üst çubuğunu temsil edecek iki movieClip ekleyelim ve ikinci frame’e de bir resim ekleryip daha sonra şu kodları ilk frame’e yazalım;

stop()
loaderInfo.addEventListener(ProgressEvent.PROGRESS, yukle);
function yukle(event:ProgressEvent){
ust.width=alt.width*event.bytesLoaded/event.bytesTotal
if(event.bytesLoaded==event.bytesTotal){gotoAndStop(2)}
}

Bu kodda loaderInfo sınıfına ProgressEvent.PROGRESS yükleme anında yaplacaklar için atandı daha sonra yukle fonksiyonu bu anda çağırılmak için belirtildi. Yükle fonksiyonunda ilk satırda ust’ün genişliği eşittir alt’ın genişliği çarpı yüklenen byte bölü toplam byte işlemini gerçekleştirdik ve sonra eğer yüklenen byte toplam byte’a eşit olursa ikinci frame’e git dedik… Şimdi de bunun tamamını kodla yapalım yani sahneye bişey eklemeden kodla şekil çizelim;

stop()
var onyukleyici:Sprite=new Sprite();
addChild(onyukleyici)
var gen:uint=200; var yuk:uint=10
onyukleyici.x=stage.stageWidth/2-gen/2;
onyukleyici.y=stage.stageHeight/2-yuk/2
 
var alt:Shape=new Shape()
alt.graphics.beginFill(0X009900);
alt.graphics.drawRect(0,0,gen,yuk)
alt.graphics.endFill();
onyukleyici.addChild(alt);
 
var ust:Shape=new Shape()
ust.graphics.beginFill(0X00CC00);
ust.graphics.drawRect(0,0,1,yuk)
ust.graphics.endFill();
onyukleyici.addChild(ust);
 
loaderInfo.addEventListener(ProgressEvent.PROGRESS, yukle);
function yukle(event:ProgressEvent){
ust.width=alt.width*event.bytesLoaded/event.bytesTotal
if(event.bytesLoaded==event.bytesTotal){
gotoAndStop(2); removeChild(onyukleyici)}
}

Burada farklı olarak alt ve ust cubuğu kod ile çizdik ve bu iki çizimi onyukleyici sprite’ının içine yerleştirdik onyukleyici’yi de sahnenin ortasına konumlandırdık ve yükleme bitince removeChild ile onyukleyici’yi kaldırdık… Şimdi bu yüklenen yüzdelik dilimini yazıyla sahneye aktaralım, sahneye yuzde isimli bir dynamic text ekleyin ve yukarıdaki yukle fonksiyonunun içine şu kodları yazın;

yuzde.text="%"+Math.round(event.bytesLoaded/event.bytesTotal*100)

Bu kodda text’e yazılmasını istediğimiz şeyi belirttik yani yüklenen byte’ı toplam byte’a bölüp 100 ile çarparsak yüklenen byte yüzdesini buluruz, virgüllü sayı almamak için de bunu Math.round içine aldık. Eğer bunu da kodla yapmak istiyorsak ikinci verdiğimiz kodu şu şekilde değiştirmemiz gerekecek;

stop()
var onyukleyici:Sprite=new Sprite();
addChild(onyukleyici)
var gen:uint=200; var yuk:uint=10
onyukleyici.x=stage.stageWidth/2-gen/2
onyukleyici.y=stage.stageHeight/2-yuk/2
 
var alt:Shape=new Shape()
alt.graphics.beginFill(0X009900);
alt.graphics.drawRect(0,0,gen,yuk)
alt.graphics.endFill();
onyukleyici.addChild(alt);
 
var ust:Shape=new Shape()
ust.graphics.beginFill(0X00CC00);
ust.graphics.drawRect(0,0,1,yuk)
ust.graphics.endFill();
onyukleyici.addChild(ust);
 
var yuzde:TextField = new TextField();
var format:TextFormat = new TextFormat();
format.color = 0X006600; format.size = 15;
yuzde.defaultTextFormat = format;
yuzde.width=40; yuzde.height=20
yuzde.x=gen/2-yuzde.width/2; yuzde.y=10
yuzde.selectable = false
onyukleyici.addChild(yuzde)
 
loaderInfo.addEventListener(ProgressEvent.PROGRESS, yukle);
function yukle(event:ProgressEvent){
yuzde.text="%"+Math.round(event.bytesLoaded/event.bytesTotal*100)
ust.width=alt.width*event.bytesLoaded/event.bytesTotal
if(event.bytesLoaded==event.bytesTotal){
gotoAndStop(2); removeChild(onyukleyici)}
}

Bu kodda son anlattığımızdan farklı olarak yuzde isminde bir TextField oluşturduk sonra bunun yazıtipi için format adında bir TextFormat oluşturduk, formatın özelliklerini belirtip defaultTextFormat ile formatı yazıya yükledik daha sonra yuzde yazısının konum ve durumunu belirtip yine onyukleyici sprite’ının içine ekledik. Hepsi bu kadar… Bu arada preloader’ın yanında text sınıfından da bişeyler öğrendik 8) Ayrıca bu son kodu ilk frame’e eklerseniz hiçbişey yapmadan beleşten süper ötesi bir önyükleyiciye sahip olursunuz artık bundan sonra sırtınız yere gelmez… :D

Yorum yapın

Fill in your details below or click an icon to log in:

WordPress.com Logo

You are commenting using your WordPress.com account. Log Out / Değiştir )

Twitter picture

You are commenting using your Twitter account. Log Out / Değiştir )

Facebook photo

You are commenting using your Facebook account. Log Out / Değiştir )

Connecting to %s

Follow

Get every new post delivered to your Inbox.