Örnek Adına Göre Sürükle-Bırak Eylemi


Hazır sürükle-bırak ile ilgili örneklere başlamışken bir tane daha eklemek istedim. Bu örnekteki sürükle-bırak eylemi sembollere verdiğimiz Instance Name (Örnek adı) karakterlerine göre işlem yapıyor. Avantajının ne olduğunu merak eden olabilir. Hemen söyleyeyim. Sahne üzerinde çok sayıda nesne var ve bunlardan bazılarına sürükle-bırak eylemi uygulanarak doğru yere gidip gitmediğini kontrol ettireceğiz. Doğru yere gittiğinde belli bir noktada kalacak, gitmediyse başlangıç noktasına geri dönecek. Açıklamasını yazarken bile yoruldum ki kodlarını yazmaya çalıştığımızda hepsine tek tek olay dinleyici eklemek oldukça zor olacaktır.

Yapacağımız örnekte ise sadece iki olay dinleyici kullanıp, 3 tane değişken tanımlayacağız. Yani işin kodlama tarafını minimuma indireceğiz. Güzel tarafı ise sonrasında sahne üzerine nesne eklediğimizde ek kod yazmaya ya da tam tersi nesne sayısını eksilttiğimizde kod eksiltmeye gerek kalmaması.

Yapacağımız işlemin mantığınına gelecek olursak, sahne üzerinde 10 tane sürükle-bırak eylemi uygulanacak nesne ve bu nesnelerin 10 tane de karşılığı olsun. Toplamda sahne üzerinde 20 nesnemiz olacak. Örneğimizde nesnelere verdiğimiz örnek isimlere göre işlem yapacağımıza göre sürükle-bırak eyleminin uygulanacağı nesnelere Instance Name (Örnek Adı) olarak a01, a02, a03 … isimlerini verelim. İsimlerin sonlarına _mc ekini kullanmaya gerek yok. En azından yazacağımız kodda biraz daha tasaruf edelim. Bu nesnelerin karşıklarını da b01, b02, b03 … olarak adlandıralım. Yalnız isimlendirmeleri yaparken a01 nesnesinin doğru karşılığı b01 nesnesi olsun ki herhangi bir karışıklığa sebebiyet vemeyelim. Evet sahne üzerinde yapacaklarımız bu kadar. Gerisini ActionScript ile halledeceğiz.

startDrag metodunu uygulayacağımız nesneleri seçeerken substr metodunu kullanacağız. substr metodunun çalışma şekli şu şekildedir: substr(başlangıç indeksi:Number =0, uzunluk:Number = 3):String. Örnekte nesnenin ismini kontol ettiğimizi varsayarsak ilk karakterden başlayarak 3 karakteri alıp değeri String olarak geri döndürecektir(Saymaya 0(sıfır)’dan başladığı için birinci karakterin karşılığı sıfırdır. Kodu kullanırken parantez içerisine gireceğimiz değerlerin ilki kaçıncı karakterden kontrol etmeye başlayacağını, ikincisi ise kaç karakter kontrol edeceğini belirtiyor. Yani oluşturulan dizenin alt bizim belirlediğimiz alt dizesini geri döndürür. Yapacağımız örnekte ilk olarak nesneler verdiğimiz isimlerin ilk karakterini kontrol ederek startDrag metodunu uygulayacak, stopDrag eylemini uyguladığında ise nesnenin karşılığını bulup bulmadığını son 2 karakteri kontrol ettirerek bulacağız.

İlk bakıldığında yukarıda anlattıklarım biraz karışık gelmiş olabilir. Fakat bir kaç örnek üzerinde uyguladıktan sonra mantığını çözmek o kadar da zor değil. Evet sözü fazla uzatmadan çalışmamızda yeni bir katman oluşturup adını Action olarak değiştirelim ve Actions panelini açarak aşağıdaki kodları yazmaya başlayalım.

//nesneler sürüklenmeye başladığında başlangıçtaki x ve y konumlarını almak için
//iki değişken tanımlıyoruz.
var xKonum,yKonum:Number;
//Instance Name kısmına yazdığımız isimlerin son 2 karakterini almak için
//bir değişken tanımlıyoruz.
var numara:String;

//olay dinleyiciyi sahneye atıyoruz.
stage.addEventListener(MouseEvent.MOUSE_DOWN,surukle);
function surukle(e:MouseEvent) {
    //Nesnenin x konumunu xKonum değişkenine, y konumununun değerini
    //yKonum değişkenine değer olarak atıyoruz
    xKonum=e.target.x;
    yKonum=e.target.y;
    //setChildIndex metodu ile olayın gerçekleştiği nesneyi sahne üzerindeki
    //sıralamada en üste taşıyoruz.
    setChildIndex(MovieClip(e.target),numChildren-1);
    //eğer olayın gerçekleştiği nesnenin Örnek Adının ilk karakterinin a olup olmadığını
    //kontrol ediyoruz ve String veri türüne dönüştürüyoruz.
    if (String(e.target.name).substr(0,1)=="a") {
        //numara değişkenine de olayın gerçekleştiği nesnenin örnek adının
        //2. ve 3. karakterlerini değer olarak atıyoruz.
        numara = (String(e.target.name).substr(1,2));
        //e.target metodu ile olayın gerçekleştiği nesneyi sürüklemeye başlıyoruz.
        e.target.startDrag();
        trace(numara);
    }
}

stage.addEventListener(MouseEvent.MOUSE_UP,birak);
function birak(e:MouseEvent) {
    //nesneyi bırakıyoruz.
    e.target.stopDrag();
    //sürüklenen nesnenin doğru yere temas edip etmeğini kontrol ediyoruz.
    //kontrol ederken hitTestObject metodunu kullanıyoruz.
    //parantez içerisindeki parametreye temas edeceği nesnenin örnek adını yazıyoruz.
    //root ile anadizine çıkıyoruz ve nesnenin örnek adının ilk karakterini tırmak işaretleri
    //içerisine yazıyoyoruz ve + operatörü ile de numara değişkeninin değerini ekliyoruz.
    //sonuç olarak geriye dönen değer b01, b02, b03 vb. oluyor. Yani sahne üzerindeki nesnelerimizin
    //örnek adlarına karşılık geliyor.
    if (e.target.hitTestObject(root["b"+numara])) {
        //sürüklenen nesne doğru yere geldiği için x ve y konumlarını temas ettiği nesnenin
        //x ve y konumuna eşitliyoruz.
        e.target.x=root["b"+numara].x;
        e.target.y=root["b"+numara].y;
        //x ve y konumları eşitlendikten sonra nesnenin tekrar sürüklenmesi için
        //dare işlevlerini iptal ediyoruz.
        e.target.mouseEnabled=false;
        //eğer nesne doğru yere temas etmezse çalışacak kod bloğunu yazıyoruz.
        //olumlu koşuldan tek farkı baştaki ! operatörüdür. Koşulun başına ! operatörü
        //eklendiği takdirde koşul olumsuza çevrilmiş olur.
    } else if (! e.target.hitTestObject(root["b"+numara])) {
        //nesneyi x ve y ekseninde, başlangıç noktasına geri döndürmek için
        //oluşturduğumuz değişkenleri kullanıyoruz.
        e.target.x=xKonum;
        e.target.y=yKonum;
    }
}
Örnek çalışma dosyasını indirebilmek için siteye üye olmanız gerekmektedir. Siteye üye olmak için tıklayın.

, , ,

  1. #1 by Barış on 17 Ekim 2010 - 20:01

    Hocam mükkemmel anlatmışsınız.Çok aradığım bir dersti.Yeni çalışmalarınızı dört gözle beklicem

  2. #2 by Barış on 17 Ekim 2010 - 20:24

    Hocam bende birebir kod ve örnek isimleri yazdım ancak taşıdığım nesne altta kalıyor bunu nasıl önleyebilirim

  3. #3 by Barış on 17 Ekim 2010 - 20:31

    Barış :Hocam bende birebir kod ve örnek isimleri yazdım ancak taşıdığım nesne altta kalıyor bunu nasıl önleyebilirim
    [Tercüme etmek]

    tamam olayı çözdüm alttaki nesnelerin içini dolgusunu silince haloldu

  4. #4 by Gökhan on 17 Şubat 2011 - 20:56

    Hocam aynı nesneden adet olarak birden fazla olursa hangi yolu izleyeceğiz.

  5. #5 by Erol Demirer on 17 Şubat 2011 - 23:53

    Aynı nesneden birden fazla olması durumunda hatalı bir uygulama olur. Nesnelere verdiğiniz isimlerin sadece o nesneye özel olması gerekir. Başka bir nesneye aynı ismi vermemelisiniz. Böyle bir durumda en mantıklısı nesnelerin isimlerini değiştirmek olacaktır. Eğer nesne sayısı çok fazla ise örnek kodlardaki numara = (String(e.target.name).substr(1,2)); satırında en sondaki 2 yerine e.target.name.length ifadesini kullanabilirsiniz.

(yayınlanmayacak)

Login with Facebook:
 

Additional comments powered by BackType