XML dosyaları hemen her programlama ve script teknolojileri ile kullanılabilen veri dosyalarıdır. Bu dosyaların flash için önemi ise oldukça büyüktür. Zîra flash ile yapılan hemen her projede XML dosyalarından yararlanılır. Dolayısı ile XML dosyalarının flash ile birlikte kullanımı konusu oldukça yaygındır. Bu yazımda flash ile XML kullanımı konusunun temllerini anlatmaya çalışacağım.

Tabi ki öncelikle elimizde içerisindeki veriyi kullanacağımız bir XML dosyası olmalı. XML dosyaları oldukça esnek bir yapıya sahiptir.XML dosyası içerisinde kullanılan etiketler (istisnalar vardır) tamamen sizin belirleyeceğiniz Türkçe karakter içermeyen metinler olacaktır.

Örneğin;

<?xml version="1.0" encoding="utf-8"?>
      <kullanicilar>
        <kullanici id="1">
            <ad>Ahmet</ad>
            <soyad>Baştutar</soyad>
        </kullanici>
        <kullanici id="2">
            <ad>Cemil</ad>
            <soyad>Demirsalyangoz</soyad>
        </kullanici>
        <kullanici id="3">
            <ad>Esin</ad>
            <soyad>Fırıldak</soyad>
        </kullanici>
        <kullanici id="4">
            <ad>Guraşa</ad>
            <soyad>Herzaman</soyad>
        </kullanici>
      </kullanicilar>

Burada gördüğünüz üzere XML içerisindeki bütün etiketleri kendimiz belirleyebiliyoruz. En üstteki;

kodu ise bu dosyanın türünün (XML), versiyonunun (1.0) ve içeriğindeki karakterlerin kodlama standardının (UTF-8) olduğunu bildirir. Bu etiketi kafamıza göre değişteremeyiz. Ancak bunun dışında kalanlar bize bağlıdır. Daha XML için anlatılacak çok şey var ancak konumuzun XML olmaması hasebiyle burada kesiyorum.

Kabaca XML hakkında temel bilgileri anlattığımıza göre Flash içerisindeki kullanımına geçebiliriz.

Flash içerisinde kullanmaya başlamamız için bilmemiz gereken ilk şey, XML dosyamızın SWF dosyamıza dolayısı ile FLA dosyamıza göre konumudur. XML dosyamızı kullanırken bunu belirtmek durumundayız.

Benim örneğimde bu konum tam olarak şu şekilde;

Dosya konumunu belirlediğimize göre Flash içerisinde yazacağımız Actionscript kodumuza geçebiliriz.

İlk olarak bir "URLRequest" nesne örneği oluşturarak XML dosyamızın konumunu bu nesneye bildirmeliyiz.

var xmlReq:URLRequest = new URLRequest ("kullanicilar.xml");

Eğer XML dosyamız SWF dosyamızın yanında bir klasörün içerisinde olsaydı dosya adından önce bu klasörü belirtmemiz gerekecekti. Şu şekilde;

var xmlReq:URLRequest = new URLRequest ("XMLDosyalari/kullanicilar.xml");

Peki ya bir üst klasörde olsaydı. O da şu şekilde;

var xmlReq:URLRequest = new URLRequest ("../kullanicilar.xml");

Bir üst seviyedeki dosyaya ulaşmak için gerekli olan kullanım "../" şeklindedir. Bu ifadenin her kullanımı sizi klasörlerde bir üst seviyeye çıkarır. İki üst seviyeye çıkmak için "../../" şeklinde bir ifade kullanmak gerekir.

Dosyamızı nesnemize aktardıktan sonra artık URLLoader nesnemizi oluşturabiliriz.

var xmlReq:URLRequest = new URLRequest ("kullanicilar.xml");
var xmlLoader:URLLoader = new URLLoader(xmlReq);

Bu işlemden sonra xmlLoader değişkenimiz bizim gösterdiğimiz XML dosyası içerisindeki bilgileri yüklemeye başlar. Yükleme bittiğinde ise bu bilgileri kendi içerisinde saklar.

Peki yüklemenin bittiğini nasıl anlayacağız? Yüklemenin tamamlandığını anlayabilmek için Actionscript'in Event.COMPLETE olay takipçisini kullanacağız. Bu durumda tanımladığımız bir fonksiyon XML yüklendiği anda çalışacak. Bu fonksiyona istediğimizi yaptırabiliriz. Örneğimizde OUTPUT panele XML in yüklendiğine dair bir mesaj yazdırmasını istiyorum.

Örneğimize bakalım;

var xmlReq:URLRequest = new URLRequest ("kullanicilar.xml");
var xmlLoader:URLLoader = new URLLoader(xmlReq);

function xmlYuklendi(evt:Event):void
{
    trace("XML dosyası başarılı olarak yüklendi.");
}
xmlLoader.addEventListener(Event.COMPLETE, xmlYuklendi);

Bu ifade ile XML dosyasının SWF dosyamızın içerisine yüklendiğini bildiren bir mesaj alıyoruz. Henüz XML dosyamızın içerisindeki hiçbir bilgiye ulaşmış değiliz.

Artık XML dosyamızın içerisindeki bilgilere erişebilir ve istediğimiz şekilde bu bilgileri kullanabiliriz. Örneğimizde bu bilgileri kullanarak, XML dosyamızdaki isim ve soyisimler stage'e yani çalışma alanına yazdıralım.

Bunun için öncelikle XML'in yükleme işlemi bittiğinde çalışan fonksiyonumuzda biraz değişiklik yapalım. "xmlLoader" nesnesine atadığımız COMPLETE eventinin gerçekleşmesi ile tetiklenen fonksiyonumuza aynı zamanda "xmlLoader" nesnemizin içerdiği bilgileride aslında aktarmış oluyoruz. Bu bilgilere ulaşmak için kullanacağımız deyim ise "evt.target.data" dır. Ancak bu deyimin içerdiği bilgiler henüz ham haldedir. Bu nedenle önce onları XML olarak biçimlendirmemiz gerekiyor. Örneğimiz üzerinden devam edelim;

var xmlReq:URLRequest = new URLRequest("kullanicilar.xml");
var xmlLoader:URLLoader = new URLLoader(xmlReq);
var xmlNesne:XML = new XML();

function xmlYuklendi(evt:Event):void
{
    xmlNesne = XML(evt.target.data);
}
xmlLoader.addEventListener(Event.COMPLETE, xmlYuklendi);

Üçüncü satırda kullandığımız deyim yeni bir XML nesnesi oluşturmak için kullanılır. XML dosyamızdan gelen formatsız bilgileri XML formatına dönüştürerek bu XML nesnemize aktarıyoruz. Bu noktada çok fazla XML geçtiğinin farkındayım. Bir benzetme yaparsak sanırım daha kolay anlaşılacak. Elinizde bir paket makarna var, mutfağınızda bir adet içi su ile dolu tencere var ve onları yan yana koyup karşısına geçerek bakıyorsunuz. Bu durumda makarna XML dosyamızdan gelen verileri, su dolu tencere XML formatına dönüştürme işlemini, sizde oluşturduğumuz XML nesnesini temsil ediyorsunuz. Yapacağımız işlem ise karnımızı doyurmak. :) Yani XML verilerini yenilebilir hale getirmek.

Burdan sonra işimiz daha kolay. Çünkü yapmamız gereken tek şey "xmlNesne" içerisindeki verileri alarak işlemek. Bunun için "xmlNesne" içerisindeki bilgilere ulaşma yolunu inceleyelim.

"xmlNesne" içerisinde bu örneğimiz için iki tür veri vardır. Birincisi etiketler (Flash içerisinde kullanılırken node ya da childnode da denir.) içerisindeki veriler. İkincisi ise attributes de denilen özellikler. XML dosyamızı inceleyecek olursanız etiketlerinin içerisinde 'id' özelliği (attribute) vardır. 'id' özelliğine de Actionscript ile ulaşabilir ve dilediğimiz gibi kullanabiliriz. Attribute'leri kullanmadan önce etiketler içerisindeki verileri nasıl alacağımızı görelim.

var xmlReq:URLRequest = new URLRequest("kullanicilar.xml");
var xmlLoader:URLLoader = new URLLoader(xmlReq);
var xmlNesne:XML = new XML();

function xmlYuklendi(evt:Event):void
{
xmlNesne = XML(evt.target.data);
var yaziAlani:TextField = new TextField();
yaziAlani.text = xmlNesne.kullanici.ad[0];
addChild(yaziAlani);
}
xmlLoader.addEventListener(Event.COMPLETE, xmlYuklendi);

Bu kodu açıklayalım. "var yaziAlani:TextField = new TextField();" ifadesiyle Actionscript kullanarak yeni bir yazı alanı oluşturduk. Bu yazı alanının Flash arayüzünde Text Tool ile oluşturulan dinamik yazı alanından bir farkı yoktur. Arayüzden yapabileceğimiz herşeyi actionscript ile de yapabiliriz. Yazı alanımızın içerisindeki metni değiştirmek için ise "yaziAlani" nesnemizin "text" özelliğini kullanıyoruz.

"xmlNesne" içerisindeki verilere en dıştaki "node"dan başlayıp içe doğru giderek ulaşabiliriz. Kodumuz üzerinde konuşacak olursak; xmlNesne -> XML dosyamızın içerisindeki "kullanicilar" etiketine (node) ve içerisindekilere karşılık gelir. xmlNesne.kullanici -> "kullanicilar" içerisindeki "kullanici" etiketlerine ve arasındaki etiketlere karşılık gelir. xmlNesne.kullanici[0] -> "kullanicilar" içerisindeki ilk "kullanici" etiketine ve arasındaki etiketlere karşılık gelir. xmlNesne.kullanici[0].ad -> "kullanici" içerisindeki "ad" etiketine ve içerisindeki veriye karşılık gelir.

Yani "xmlNesne.kullanici.ad[0]" ifadesi bizi "Ahmet" verisine ulaştıracaktır. Daha iyi anlayabilmek için bu ifade yerine ne yazarsak hangi sonuçları verecek görelim.

Yalnızca xmlNesne yazdığımızda;

      <kullanicilar>
        <kullanici id="1">
          <ad>Ahmet</ad>
          <soyad>Baştutar</soyad>
        </kullanici>

        <kullanici id="2">
          <ad>Cemil</ad>
          <soyad>Demirsalyangoz</soyad>
        </kullanici>
        <kullanici id="3">
          <ad>Esin</ad>
          <soyad>Fırıldak</soyad>
        </kullanici>
        <kullanici id="4">
          <ad>Guraşa</ad>
          <soyad>Herzaman</soyad>
        </kullanici>
      </kullanicilar>

"xmlNesne.kullanici" yazdığımızda;

      <kullanici id="1">
        <ad>Ahmet</ad>
        <soyad>Baştutar</soyad>
      </kullanici>
      <kullanici id="2">
        <ad>Cemil</ad>
        <soyad>Demirsalyangoz</soyad>
      </kullanici>
      <kullanici id="3">
        <ad>Esin</ad>
        <soyad>Fırıldak</soyad>
      </kullanici>
      <kullanici id="4">
        <ad>Guraşa</ad>
        <soyad>Herzaman</soyad>
      </kullanici>

"xmlNesne.kullanici[0]" yazdığımızda;

      <kullanici id="1">
        <ad>Ahmet</ad>
        <soyad>Baştutar</soyad>
      </kullanici>

"xmlNesne.kullanici[0].ad" yazdığımızda ise;

Ahmet

Bilgilerine ulaşırız.

Bu şekilde istediğimiz veriye ulaştıktan sonra addChild(); metodu ile yazı alanımızı çalışma alanımıza yerleştirebiliriz.

Attribute'leri kullanmak daha farklı değildir. Yalnızca içerisindeki veriyi almak istediğimiz atrribute'un başına "@" eklememiz gerekmektedir. Yani eğer "kullanici" içerisindeki "id" özelliğine ulaşmak istiyorsak, biraz önceki deyimimizi "xmlNesne.kullanici.@id" şeklinde değiştirmeliyiz.

Artık örneğimize son halini vererek, XML dosyamız içerisindeki bütün kullanıcı bilgilerini çalışma alanımıza yerleştirelim.

      var xmlReq:URLRequest = new URLRequest("kullanicilar.xml");
      var xmlLoader:URLLoader = new URLLoader(xmlReq);
      var xmlNesne:XML = new XML();

      function xmlYuklendi(evt:Event):void
      {
       var i:int = new int();
       xmlNesne = XML(evt.target.data);
       for (i=0;i<xmlNesne.kullanici.length();i++)
       {
        var yaziAlani:TextField = new TextField();
        yaziAlani.width = 200;
        yaziAlani.y = i*20;
        yaziAlani.x = 50;
        yaziAlani.textColor = 0xff0000;
        yaziAlani.text = xmlNesne.kullanici.@id[i];
        yaziAlani.appendText("-"+xmlNesne.kullanici.ad[i]);
        yaziAlani.appendText(" "+xmlNesne.kullanici.soyad[i]);
        addChild(yaziAlani);
       }
      }
      xmlLoader.addEventListener(Event.COMPLETE, xmlYuklendi);

Kalabalık görünebilir ancak korkulacak birşey yok. Öncekilerden farklı olarak eklediğim kodların neredeyse tamamı çalışma alanımıza ekleyeceğimiz veriyi biçimlendirmek içindir. Açıklamaya başlayalım. Bir "for" döngüsü ile "xmlNesne" içerisinden almak istediğimiz bütün verileri alıyoruz ve her bir veri için bir yazı alanı oluşturulmasını sağlıyoruz. For döngüsünden sonraki 4 satır (12. satırdan başlayarak 16.satıra kadar olan kısım. 16 dahil değildir.) sırasıyla yazıl alanının genişliğini (width), Y koordinatındaki yerini, X koordinatındaki yerini ve rengini belirlemek içindir. Y koordinatını belirlerken kullandığımız "i*20" ifadesi ise her bir yazı alanının kendisinden önceki yazı alanına göre 20 piksel aşağı kaydırmasını sağlıyor. "yaziAlani.text = xmlNesne.kullanici.@id[i];" ifadesi daha önce de açıkladığımız üzere yazı alanımızın text özelliğine aldığımız veriyi aktarıyor. Burada "kullanici etiketinin içerisindeki "id" özelliğini alıyoruz. Sonraki iki satırda ise yazı alanımıza aldığımız veriye (id) diğer verileri (ad ve soyad) ekliyoruz. Son olarak addChild() metodu ile yazı alanımızı çalışma alanımıza eklemiş oluyoruz.

Son çıktımız ise şu şekilde;

Örnek Dosyaları: flashwithxml.rar

Eğer varsa eksik ve yanlışlarım için şimdiden özür dilerim.

İyi çalışmalar...