Actionscript 3 ve Display List

09 Kasım 2007 – 22:51

Actionscript 3 yapılan her uygulamada görüntülenen görsel elementler  display list adındaki bir hiyerarşide toplanıyor.Yani bütün görsel öğeler display list te toplanıyor.Bu hiyerarşide yer alan objeler z-sıralama sistemine göre pozisyon alıyor.Bu makalede display list’e  nasıl movie clip, shape, sprite, text area vb objeleri  ekleyip çıkarabileceğinizi, ekrandaki öğelerin z-sıralamasını nasıl yapabileceğinizi, ayrıca actionscript 2 de sıkça kullanılan attach movie, createMovieClip, duplicateMovieClip, gibi artık kullanılmayan komutlara da değineceğim.Kaynak kodların tamamını sayfanın  en altından ulşabilirsiniz.

addChild() ve new() metodları
Actionscript 3 te yeni bir obje oluşturma için new metodu kullanılır.Bu metodla sadece movie clip değil  ses, video, componentler vb birçok öğeyi oluşturabilirsiniz, hatta kütüphanenizde duran bir öğeye linkage id vererek o objeyi bile kütüphaneden çağırabilirsiniz.Ama önce bir örnekle yeni bir movie clibi  nasıl oluşturabileceğimize  bir bakalım.

  1. var my_mc:MovieClip = new MovieClip();


Kodda da açıkça görüldüğü gibi çok basit. Yeni bir movie clip oluşturmak çok basit  ama biz sadece movie clibi oluşturduk bu movie clibi ekrana yani display list’imize eklemek için ise addChild metodunu kullanmamız gerekiyor.

  1. addChild(my_mc);

Şimdi kütüphanede yer alan bir movie clibi nasıl kullanabileceğimize bakalım. İlk olarak kütüphaneden ekrana eklemek istediğiniz movie clibin üzerine sag tıklayın ve Linkage i seçin.

Linkage

 

Önünüze gelen pencerede Export for ActionScript seçeneğini seçin.

Linkage 2

Daha sonra Class bölümüne movie clibinize vermek istediğiniz class adını seçin, ve OK tuşuna basın.

Linkage 3

 Önünüze gelen hata mesajı, verdiğiniz movie clibe ait bir class yapısının olmadığı için hata veriyor.OK  derseniz bu class ait bir class yapısını flash oluşturacaktır, bu bölümü atlayıp OK tuşuna basıyoruz.

Linkage Warning

Şimdi timeline daki ilk boş frame tıklayıp actionscript panelini açın ve aşağıdaki kodu yazın

  1. var p1_mc:pickman = new pickman();
  2. p1_mc.x=150;
  3. p1_mc.y=150;
  4. addChild(p1_mc);

Buradaki mantık aslında çok basit kütüphanenizde yer alan bir öğeye var olan bir class gibi davranıyorsunuz. Kulağa zor geliyor ama o kadar zor değil.

Sprite()
Sprite’ları timeline’ları olmayan movieclipler gibi düşünebilirsiniz, avantajı ise vector grafikler gibi objeler için daha az yer kaplamasıdır.Kullanımı ise MovieClip ile aynı;

  1. var my_sprite:Sprite = new Sprite();
  2. addChild(my_sprite);

Kütüphanedeki bir movieClip öğesine Sprite şeklinde davranmak istiyorsanız yapmanız gereken linkage identifer bölümünden class ın altındaki  Base Class  bölümünde ;

MovieClip To Sprite

flash.display.MovieClip base clasını flash.display.Sprite yapmanız.Burada kütüphanedeki obje için temel class seçiyorsunuz, bu da seçtiğiniz classın özelliklerini taşıyacaktır demektir.
 

addChildAt();
Bu metod ile ekrana eklemek istediğiniz objenin index numarasına belirterek objeyi ekrana ekliyorsunuz .

  1. addChildAt(my_mc, 3);

contains();
Contains metodu bir objenin başka bir objenin içinde olup olmadığını kontrol eder.Eğer içindeyse true değilse false değerini verir.

  1. var mc1:MovieClip = new MovieClip ();
  2. var mc2:MovieClip = new MovieClip ();
  3. var mc3:MovieClip = new MovieClip ();
  4. mc1.addChild(mc2);
  5. trace(mc1.contains(mc2)); // true
  6. trace(mc1.contains(mc3)); // false

getChildAt ()
Şahsen bu metodu ilk okuduğumda pek işime yaramayacağını düşünmüştüm ama hayat kurtarabiliyor.getChildAt metodu belirtilen index numarasındaki objenin instance bilgisini  geri dönderiyor.Şöyle izah edim ekrana bir movie clibin birden fazla kopyasını attığınızda, movie cliplere index numarası ile movie clipin instance name’ini alabilirisiniz, yada seçtiğiniz movie clibin x ve y koordinatlarını değiştirebilirsiniz ve daha birçok özelliğe ulaşıp buradan değiştirebilirsiniz.

  1. var main_mc:MovieClip = new MovieClip();
  2. addChild(main_mc);
  3. var mc1:MovieClip = new MovieClip();
  4. main_mc.addChild(mc1);
  5. mc1.x=50;
  6. trace(main_mc.getChildAt(0).x); //50

getChildByName ();
getChildAt metodundan farkı display list’teki index numarası yerine instancename kullanıyor, yani kullandığınız objenin instance name’i ile işlem yapıyorsunuz.

  1. var main_mc:MovieClip = new MovieClip();
  2. addChild(main_mc);
  3. var mc1:MovieClip = new MovieClip();
  4. main_mc.addChild(mc1);
  5. mc1.x=50;
  6. mc1.name = "test_mc";
  7. trace(main_mc.getChildByName("test_mc").x);//50

getChildIndex ()
Objenin display list’deki index numarasını veriyor.

  1. var main_mc:MovieClip = new MovieClip();
  2. addChild(main_mc);
  3. var mc1:MovieClip = new MovieClip();
  4. main_mc.addChild(mc1);
  5. mc1.x=50;
  6. mc1.name = "test_mc";
  7. trace(main_mc.getChildIndex(mc1));//0

removeChild ()
Adından da rahatça anlaşılacağı gibi display list’teki objeyi display list’ten kaldırmak için, tabii bu da seçilen objenin ekrandan kaldırılması demek oluyor.

  1. var main_mc:MovieClip = new MovieClip();
  2. addChild(main_mc);
  3. removeChild(main_mc);

removeChildAt ()
removeChild metodundan tek farkı index numarası ile objeyi ekrandan kaldırabilmeniz.

  1. var main_mc:MovieClip = new MovieClip();
  2. addChild(main_mc);
  3. removeChildAt (0)

setChildIndex ()
Ekranda bulunan objelerin görüntüleme sırasını değiştiriyor.Kısacası index numarasını değiştiriyor.Sıralama sistemi ise klasik sıralama sistemi, index numarası küçük olan en altta index numarası büyük olan en üstte.

  1. setChildIndex(getChildAt(2), 0);

swapChildren ()
swapchildren ekranda bulunan objelerin index numarasını değiştiriyor.setChild index teki farkı ise set childindex metodunda bir objenin index numarasını değiştirince diğer index numaralrı otomatikmen değişiyor.SwapChildren da ise iki objenin index  numaraları birbiri ile değişiyor ve ekrandaki diğer index numaraları sabit kalıyor.

  1. swapChildren(circle_blue, circle_red);

swapChildrenAt ()
swapChildren metodundan tek farkı index numarası ile index değiştirme işlemini yapıyor.

  1. swapChildrenAt(0, 2);

numChildren()
DisplayListcontainer sınıfının bu özelliği ile bir objenin içindeki toplam index numarasını yani toplam obje sayısını görüntüleyebiliyorsunuz.

  1. trace(my_mc.numChildren);

mouseChildren()
İlk bakışta biraz garip ve kafa karıştırıcı bulduğum ama sonradan çok işime yarayacağını öğrendiğim bir özellik.Bir objenin içindeki başka bir objenin mouse enabled olup olmayacağını true false değeri ile belirtiyorsunuz.Eğer obje mouse enabled ise kullanıcı objenin özelliklerini kullanabilir ve etkileşimi geçebilir.Default değeri true.

  1. my_mc.mouseChildren =false;

Bu biraz karışık bir örnek olduğu için kodların tamamını yazmayacağım, kaynak dosyaları indirip kontrol edebilirsiniz.

textSnapshot();
Dynamic text box lardan veri okumak yeni birşey değil ama şu anda statik textboxlardan da veriyi okuyabiliyorsunuz.Ekrana static text  box içerisine  birşeyler yazın ve test edin.

  1. trace(this.textSnapshot.getText(0, this.textSnapshot.charCount));

Hepsi bu kadar.Aslında değil ama en azından en çok kullanılan ve işinize ençok yarıyabilecek olanlar bunlar.
Kaynak Kodlar
Kolay Gelsin
Engin!

Bu makale ile ilgili olabilecek yazılar



  1. 11 Responses to “Actionscript 3 ve Display List”

  2. hocam ellerinize sağlık gerçekten as3′e geçişte temel kaynak olacak niteliktekiş bu bilgiler için çok teşekkür ederim…

    By mustafa dokuyan on Mar 12, 2008

  3. Gerçekten çok faydalı bir yazı olmuş.
    teşekürler.

    By engin gven on Mar 15, 2008

  4. engin hocam öncelikle eline sağlık..

    mc1.contains(mcN) burda problem yok,
    peki contains() root için nasıl kullanılır?
    yani herhangi bir mc içinde olmayan bir mcnin o anda sahnede var olup olmadığının kontrolü?

    By omerf on May 25, 2008

  5. Merhaba Ömer
    Ana sahne için aşağıdaki ifadeyi kullanabilirsin.

    this.stage.contains(mc1)

    Kolay Gelsin
    Engin!

    By Engin Yöyen on May 25, 2008

  6. contains tamamdır, çok teşekkürler..

    başka bir soru daha o zaman,

    farklı frame´lerde addchild ile eklediğim movieclip´ler var,
    şöyleki, butona tıklandığında frame3e gidiyor ve frame3ün action´ında libraryden bir movieclip çağrılıyor.
    işte bu mc yi frame3 haricinde diğer framelerden kontrol etmek istediğimde hata alıyorum,

    TypeError: Error #2007: Parameter child must be non-null.
    at flash.display::DisplayObjectContainer/contains()
    at index_fla::MainTimeline/index_fla::frame3()

    yani anaframe deyken btn1 e tıklandıysa 2inci frame gidip bir mc oluştur, btn2 ye tıklandıysa önceden oluşturulmuş bir mc varsa sil ve başka bir mc oluştur şeklinde özetleyebilirim yapmak istediğimi..

    actionscript3 de oldukça yeniyim, yardımlarınızı bekliyorum..

    By omerf on May 25, 2008

  7. Merhaba Ömer
    Tahminime göre sorunun sistemi tam olarak dinamik kuramaman, yani sen objeleri kutuphaneden çağırıyosun ama bu objeleri goruntu listesine eklemeden kaldırmaya çalıştığından sorun çıkıyor olabilir.

    Çözüm için ise kütüphaneden alacağın tüm movie clipleri ilk frame de al, mesela ;

    var myMc:KutuphanedekiMC: = new KutuphanedekiMC();
    var myMc2:KutuphanedekiMC: = new KutuphanedekiMC();

    Daha sona 2 nci frame e geçince kodu yine cağır ve baska bir movie clibe ekle;

    myMc = new KutuphanedekiMC();
    holder.addChild(myMc);

    üçüncüye gittiğinde ise illk olarak holder içindeki objeyi kaldır ve myMc2 yi ekle;

    holder.removeChildAt(0);
    myMc2 = new KutuphanedekiMC();
    holder.addChild(myMc2);

    Eğer sorunu yanlış anlamadıysam bu şekilde çözebilirsini.

    Ayrıca actionscript 3.0 da yeni olduğunu yazmışssın, sitenin girşinde görmüşsündür, ücretsiz bir eğitim serisi düzenliyoruz. Aşağıdaki linkten bilgi alabilirsin.

    http://enginyoyen.com/blog/tr/index.php/actionscript-30-egitim-seminerleri/

    Kolay Gelsin

    By Engin Yöyen on May 25, 2008

  8. merhaba öncelikle böyle bir site hazırladığınız için teşekkürler, bir sorum olacaktı.
    var p1_mc:pickman = new pickman();
    p1_mc.x=150;
    p1_mc.y=150;
    addChild(p1_mc);
    pickman movie clibi içinden 10 frame gitmek istiyorum nasıl yapacağım ?
    teşekkürler

    By metin aslan on Kas 3, 2008

  9. Merhaba Metin,
    sorun tam net değil.Eğer ilk frameden başlayıp 10.frame’e gitmek istiyorsan yapman gereken;

    p1_mc.gotoAndPlay(2);

    Tabii 10. framede bir de dur komutu olması gerekiyor;
    stop();

    Eğer sadece 10.frame e gidip orada durmasını istiyorsan aşağıdaki kod yeterli olacaktır;

    p1_mc.gotoAndStop(10);

    By Engin Yöyen on Kas 3, 2008

  10. Engin hocam çok teşekkürler. küçük bir sorum daha olacak

    var p1_mc:pickman = new pickman();
    var my_mc:MovieClip = new MovieClip();
    addChild(my_mc);
    my_mc.addChild(p1_mc);
    my_mc.x=150;
    my_mc.y=150;

    p1_mc.gotoAndPlay(2);

    çalışıyor fakat
    my_mc.gotoAndPlay(2);
    yazdığımda çalışmıyor. farklı addChild da farklı framelere gitmesi gibi bir durum olabilir mi ?

    By metin aslan on Kas 3, 2008

  11. İlk olarak eğer kodu şu şekilde yazıyorsan;
    var my_mc:MovieClip = new MovieClip()
    bu kod ile bir yere gidemezsin.Sebebi ise movie clibin içerisinde boyle bir frame olmamaması.Bence senhatayı hangi timeline da nereye gideceginde yapıyorsun. Eğer pickman adlı movie clibini içerisinde 10 frame varsa aşağıdaki kodu kullanabilirsin;
    p1_mc.gotoAndPlay(2);

    Ama yoksa senin zaten bunu kullanma gibi bir sansın olamaz,çünkü gidecek bir yeri yok.

    Bence kontrolleri tekrar yap.

    By Engin Yöyen on Kas 3, 2008

  12. çok teşekkürler hocam. şimdi oldu yaptığım hatayı anladım sayende.

    By metin aslan on Kas 3, 2008

Yorum Ekleyin


Creative Commons License İçerik Hakkı Engin Yöyen'e ait olup sitedeki makaleler Creative Commons Attribution-Noncommercial 3.0 Unported lisansı ile lisanslanmıştır.