Flash ve XML

Jesse Stratford tarafından http://www.actionscript.org/ adlı sitede yayınlanan tutorial’dan yararlanılmıştır.
Anlatmaya başlamadan şunu söyleyeyim ki XML odukça geniş bir konudur. Ben bu tutorial’da sizi bu okyanusta boğmadan sadece çok kısıtlı bir konuyu yani flash ile XML arasında nasıl bir köprü kurulur onu anlatacağım.
Bu tutorial’ımın seviyesini “intermediate” olarak belirledim dolayısı ile okuyucuların belirli bir Flash ve A.S. bilgisine sahip olduklarını varsayıyorum. Biraz usun bir tutorial ama harcadığınız zamana değecek bir tutorial olacak.

Bu XML de ne ki?
Şu kadarını söyleyeyim..kesinlikle atla deve değil. Eğer A.S.’yi kıvırdıysanız, XML size çocuk oyuncağı gibi gelecektir. İşin jargonundan başlayalım. XML, eXtensible Markup Language kelimelerinin kısaltmasıdır ve bu dilin temel amacı verinin yapılandırılması, ve organize edilmesidir. XML’in en önemli özelliklerinden bir tanesi kendine göre bilgiyi yapılandırması ve bu bilgilerin insanlar tarafından kolaylıkla okunabilmesidir.
İşe bildiğinizi varsaydığım HTML ile başlayacağım. Alın size HTML dilinden basit bir örnek:
<b>Kalun kaçmasın haaa!</b>
HTML dilinde başta ve sonra kullandığımız tagler, içlerindeki stringleri nasıl format ile sunacağını söylerler. XML dilinde de bunu andıran bir yapı vardır. XML’de veriler için başta ve sonda birer tag kullanır ama HTML’den farklı olarak bunu verinin formatını belirlemek için değil veriyi yapılandırmak ve sınıflamak için kullanılır. Gruplandırılmış her bir bilgi parçasına “node” adı verilir. Hemen bir örnek verelim:
<yazar_adi>William Gibson</yazar_adi>
Yukarıdaki örnekte “yazar_adi” adlı bir node tanımlandı ve içine “William Gibson” string değeri yerleştirildi. Tabi hayat ve elimizdeki veriler bu kadar basit değil. Elimizdeki karışık yapıdaki veriler için XML hiyerarşik bir yapıya sahiptir. Tıpkı A.S.’de olduğu gibi burada da bir tane _root node ve bu rotu takip eden childnode’lar vardır. Elimizdeki örneği biraz daha geliştirelim ve XML ile bir kitap girişi yapalım.
<kitap>
<kitap_adı>Neuromancer</ kitap_adı>
<yazar_adi>William Gibson</yazar_adi>
<kitap_kodu>SF012-32</ kitap_kodu>
</kitap>
İlk önce bir kitap nodu açtık. Bu node içine üç ayrı childnode açtık ve her bir childnode’a ayrı ayrı string değerler yükledik.
Bu arada şunu hemen belirteyim HTML’in aksine XML dili kesinlikle yazım hatasını affetmez. Mesela HTML ile <b>Kalun kaçmasın haaa!</B> yazdığınızda herhangi bir hata ile karşılamasanız. Ancak XML key-sensitive bir dildir ve açtığınız tagi aynen kapatmanız gerekmektedir. Bununla birlikte içi içe geçmiş bir node yapısına sahip iseniz, en son açtığınız tagi ilk önce kapatmalısınız. Yani <kitap><kitap_adi></kitap_adi></kitap> şeklinde bir hiyerarşi olmalıdır. Tutup da Yani <kitap><kitap_adi></kitap></kitap_adi> derseniz, ki HTML buna da ses çıkarmaz, patlarsınız sonra on saat nerde yanlışım var diye çıldırırsınız. Benden söylemesi!!
Nerde ve niçin XML kullanmalıyım?
Size karşı dürüst olacağım: Ben de tam olarak bunun cevabını bilmiyorum. Şöyle cevap verelim mi: Microsoft buna el attığına göre ve B2B ve B2C ortamlarında XML standart haline geldiğine göre ögrenmekte yarar var. Hehe.
Şu bir gerçek ki XML veritabanı olarak kullanıldığında PHP ve ASP kadar hızlı bir dil değil ve MB’lık veritabanınızı XML ortamında tutmak ve bunu işlemeye kalmak hiçde akıllı bir hareket değil. Çünkü XML client-based bir dil yani işleyeceği tüm XML dosyasını hart diye bilgisayarınıza yüklüyor ondan sonra veriyi işleyeme başlıyor. Her halde bir banka olansız, tüm tüm veri bankanızı 14 yaşındaki bir veledin bilgisayarında görmek istemezsiniz. Demek ki XML secure bir dil de değil.
O zaman niye bu tutorial ile vakit olduruyorsunuz? Ne demiştik? XML değişik platformlar arasındaki iletişim sağlamak için kurulmuş bir dildir. Bu şu demek arkadaşlar..Flash programınız ile Amazon.com’un Oracla database’ini konuşturabilir yahut Flash içinden Google motoruna arama emri yolabilirsiniz. Yetmedi mi? Anlık borsa, hava, döviz, rezervasyon bilgilerini flash ekranınıza çağırabilirsiniz. Hem de bilgiyi istediğiniz ortamın ne olduğunu umursamadan…Ha bu arada ufak veritabanı uygulamalarını da PHP ya da ASP’ye bulaşmadan, ki PHP de çok basit bir uygulama ögrenile tez vakit, aradan XML ile çıkartabilirsiniz.
Flash’a XML Yüklemek
Flash’ları açıp ve ilk XML verimizi yükleyelim mi? İlk olarak yükleyecek bir XML dosyası yaratalım. Bunun için notepad programı yeterli olacaktır. Şimdi notepad’a aşağıdaki sadece tek bir node içeren XML bilgisini girin.
<kitap_adı>Neuromancer</ kitap_adı>
Bunu author.xml olarak kaydedin. Dikkat notepad’in default save formatı .txt’dir. Dosyanız her an author.xml.txt olarak kaydolabilir. Unutmadan flash dosyasını da xml dosyasını kaydettiğiniz yerde açın. Aksi taktirde flash xml dosyasını bulmakta problem yaşayabilir.
myTutorial_xml=new XML();
Bilerek veri ismini uzattım ve sonunda _xml ibaresi ekledim. Flash, xml ibaresini gördüğü anda bunun bir xml objesi olduğunu var sayar ve bir dropdown liste ile xml objesi ile yapılabilecek aksiyon ve metotların bir listesini çıkartır.
Flash MX versiyonu ile XML kendine has, ayrı bir obje haline geldi. Yukarıdaki a.s. kodu ile işte bir bir xml objesi yarattık. Şimdi yaratılan bu objenin içine önceden notepad ile yarattığımız objeyi depolayacağız.
myTutorial_xml.load(“author.xml”);
Herhangi bir adresleme yapmadan direk dosya ismini verdim çünkü xml ve flash dosyasını aynı yere kaydetmiştik.
A.S.’nin guzel taraflarından bir tanesinde kodlamaya getirdiği onLoad güzelliğidir. Sürekli olarak verilerim Bu event ile verilerimizin sürekli olarak yüklenip yüklenmediklerini kontrol etmekten mecburiyetinde bırakmaz.
myTutorial_xml.onLoad = function (success) {
if (success) {
trace(’Author.xml loaded. Contents are: ‘+this.toString());
}
};
Yukarıdaki kod, XML dosyamız yüklendiği zaman tetiklenir ve onLoad event’ine has bir fonksiyon devreye girer ve yüklemenin sonucuna göre success değeri 1 ya da 0 değeri alır. Yükleme başarı ile gerçekleştiyse, success=true değerini alır ve trace satırı devreye girer. Eğer sizde de her şey yolunda gittiyse output ekranınızda aşağıdaki ibare yer almalıdır:
Author.xml loaded. Contents are: <author>William Gibson</author>
Bir not daha; onLoad fonksiyonunun XML objesini tanıttıktan sonra ve yükleme komutu vermeden önce koymak adettendir ve en doğru uygulamadır.
Sırada xml dosyasını karmaşık bir yapıda kurmak var. Buna geçmeden önce önemli bir bilgi vermek istiyorum. Yukarıda verdiğim karmaşık xml dosyasındaki kolay okunabilirliği sağlamak için yapılmış formatlama bir bakın. Bilgisayarlar bu biçimlendirmeye ihtiyaç duymaz, bu tamamen sizlerin veriyi kolayca okuyabilmeniz için yapılmıştır. Dolayısı biçimlendirme için kullanılan space, enter, tab, vb. gibi karakterler bilgisayarların kafasını karşıtırır. Bunu basitçe önlemek için flash’ın getirdiği ignoreWhite özelliğini kullanacağız.
myTutorial_xml.ignoreWhite=true;
Böylece kodumuzun en son hali aşağıdaki gibi olacaktır:
myTutorial_xml=new XML();
myTutorial_xml.ignoreWhite=true;
myTutorial_xml.onLoad = function (success) {
if (success) {
trace(’Author.xml loaded. Contents are: ‘+this.toString());
}
};
myTutorial_xml.load(“author.xml”);
Yüklemek buzdağının sadece üstte kalan kısmı..Asıl muhabbet şimdi başlıyor. Devam içim tıklayınız…
XML 102
XML dosyasını yükletmek ile dertlerimiz sona ermiyor çünkü Flash içine yüklenen XML verisi string veya array değil karmakarışık bir objedir. Bu objeyi dallı budaklı ağaca benzetebiliriz. Bize lazım olan değerler ise o ağacın dallarındaki yani node’lardaki değerlerdir. Bu değerlere ulaşmak için yüklenen XML objesini “parse” etmeliyiz yani birbir ugraşla bir yapıya büründürdüğümüz veriyi tekrardan parçalara ayırmalıyız. Başlamadan önce söyleyeyim birazdan ilk defa duyacağınız terimler ile karşılaşacaksınız. Ama paniklemeyin sakın! Biraz dikkat ile bu ders sonunda XML’e taklalar attıracaksınız.
İlk olarak basit bir XML verisi ile başlayalım:

myXML, myXML = new XML() kodu ile tanıtılan yeni bir XML objesidir ve içine myXML.load(“…”) ile yukarıdaki çerçeve içindeki tüm bilgileri yüklenmiştir.
Verinin ana gövdesi, yani root’u “kitap” nodu’dur. İşte bu node myXML objesinin ilk çocuğudur yani “myXML.firstChild”.
Kitap node’u içinde ise başka bir XML objesi gömülüdür. Nasıl kitap node’u XML objesinin ilk çocuğu ise kitap_adi node’u da kitap objesinin ilk çocuğudur diğer bir değişle myXML.firstChild.firstChild’dır.
Son olarak da “Neuromancer” kitap_adi node’a ait bir değerdir yani myXML.firstChild.firstChild. firstChild
Yukarıdaki açıklamaları bir fla dosyasında görmek istiyorsanız xml_102_1.zip dosyasına bakabilirsiniz.
Peki verimiz yine aşağıdaki olsaydı ancak ilk kitap yerine ikinci kitap adına yani “Mona Lisa Overdrive” ismine ulaşmak isteseydik n’olacaktı?
<kitap>
<kitap_adi>Neuromancer</kitap_adi>
</kitap>
<kitap>
<kitap_adi>Mona Lisa Overdrive</kitap_adi>
</kitap>
Kafanızı fazla yormayın çünkü firstChild’i kullanarak buna yapamazsınız. firstChild aslında childNodes’ların ilkidir. Diğer bir değişle firstChild, childNodes[0]’dır. Bu durumda ikinci kitaba şu şekilde ulaşırız:
myXML.firstChild.childNodes[1].firstChild.firstChild
veya
myXML.childNodes[0].childNodes[1].childNodes[0].childNodes[0]

Yukarıdaki örneği bir fla dosyasında görmek istiyorsanız XML_102_2.zip dosyasına bakabilirsiniz.
Biraz daha uzun bir XML listesinde tün kitapları bir array’in içine yüklemeye ne dersiniz? Aşağıda çalışacağımız XML verisi bulunmaktadır ve bizden istenen myFavBooks adlı bir array verisi içine sıra ile sadece kitap isimlerini girmek…
<kitap>
<kitap_adi>Neuromancer</kitap_adi>
</kitap>

<kitap>
<kitap_adi>Mona Lisa Overdrive</kitap_adi>
</kitap>
<kitap>
<kitap_adi>Idoru</kitap_adi>
</kitap>
<kitap>
<kitap_adi>Pattern Recognition</kitap_adi>
</kitap>
<kitap>
<kitap_adi>Count Zero</kitap_adi>
</kitap>
İşin içinde XML verisi olduğu sürece for-next döngüleri sizin en büyük yardımcılarınız olacak. Kodlamaya başlıyorum.
Toplam 5 kitabım ve benim döngü için gereken bu rakamı bir şekilde elimde saymadan kodlama ile Flash’a anlatabilmem gerekiyor. Tıpkı array verileri gibi XML nodelarınında sahip oldukları uzunluk değeri yani length property’si vardır ve bizim aradığımız 5 değerini bu length property’sinden bulacağız. myXML.childNodes.length kodu bize 5 rakamını verecektir.
Burada dikkatinizi childNodes komutuna çekmek istiyorum. ChildNodes, bulunduğumuz referans node’nun bir alt-nodelarının tamamını kapsar. myXML.childNodes dersem; myXML objesi yüklü tüm verilerden oluştuğu için ilk gelen alt-node’lar olan <kitap> nodelarını belirtir. Eğer myXML.firstChild.childNodes demiş olsaydım firstChild ile anlatılan <kitap> node’undan sonra gelen <kitap_adi> node’unu kastetmiş olacaktım.
Bize gerekli olan aşağıdaki gibidir.
myFavBooks= []
For(i=0;i<myXML.childNodes.length;i++){
myFavBooks[i]=myXML.childNodes[i].firstChild.firstChild;
}
Yukarıdaki örneği bir fla dosyasında görmek istiyorsanız XML_102_3.zip dosyasına bakabilirsiniz.
Nasıl, iyi gidiyor muyuz? Umarım zip dosyalarım olaydan kopmamanızı sağlıyordur…Ha gayret, ister inanın ister inanmayın yolu baya bi yarıladık. Şimdi biraz dikkat daha diyorum ve bu tutorial’in son konusu olan “attributes” ile olayı bu seferlik noktalıyorum…lazoid ustamdan gelen bir soru sanırım bu konuyu anlatmak için çok güzel bir örnek olacak..
Soru aynen söyle idi..Bir mesajı istediğimiz font biçimlendirmesi ile XML ile nasıl yollarız..Yani lazoid sadece merhaba demek istemiyor XML ile, olayı aşıp “MERHABA” demek istiyor..bunu hemen şu şekilde yapabilirdik değil mi?
<msg>
<font>courier</font>
<font_size>10</font_size>
<font_color>red</font_color>
<font_weight>bold</font_weight>
<content>merhaba</content>
</msg>
Yukarıdaki kod ile bunu bir sefere mahsus olmak üzere yapabilirsiniz ancak ya mesajda farklı birkaç tane içerik olsaydı nolacaktı. Bu sefer <content> node’u altında birçok <font><font_size><font_color> gibi alt-node’lar açacaktınız ve iş uzadıkça uzayacaktı. İşte bu tip “veriyi tanımlayan veriler” için XML’e attributes kavramını getirmişler. Bakın yukarıdaki kod’u attributes’lar kullanarak nasıl kısalyor ve anlaşılması kolay hale getiriyorum.
<msg>
<content font=”courier” font_size=”10” font_color=”red” font-weight=”bold”>merhaba</content>
</msg>
Sanırım hepinizin aklına CSS (cascading style sheets)’deki stil tanımları geldi. Tıpkısının aynısı!!! Gelin şimdi yukarıdaki mesajı flash’a aktaralım. Bu tanımlayıcı verileri XML içindenı parse etmek yani parçalayabilmek için childNodes yerine attributes terimini kullanacağız.
Font verisine ulaşmak için kullanacağımız kod myXML.firstChild.attributes.font’dur. işte arkadaşlar önünüzde dağ gibi duran XML’in gerçek yüzü. Bu kadar basit…aşağıda bir email mesajınınXML ile kodlanmış hali ve bunun parse etmek için kullanılan Flash kodlarını gösteriyorum.
<email>
<from address=”lazoid@softhome.net”>lazoid </from>
<to address=”kann@ghostmail.net”>kann</to>
<subject>XML hakkında<subject>
<date>01-7-2003</date>
<content font=”courier” font_size=”10”>kann baba, sen bilirsin bu işleri..benim bir derdim var…</content>
</email>
System.useCodePage = true;
//turkce karakterlerin flash tarafından okunmasını saglar!
myXML = new XML();
myXML.ignoreWhite = true;
myXML.onLoad = function(success) {
if (success) {
//trace(”load successful!”);
from = myXML.firstChild.childNodes[0].firstChild;
to = myXML.firstChild.childNodes[1].firstChild;
subject = myXML.firstChild.childNodes[2].firstChild;
content.text = myXML.firstChild.childNodes[4].firstChild;
//attribute’lar geliyor…
font = myXML.firstChild.childNodes[4].attributes.font;
font_size = myXML.firstChild.childNodes[4].attributes.font_size;
//
myFormat = new TextFormat();
myFormat.font = font;
myFormat.size = Number(font_size);
content.setTextFormat(myFormat);
} else {
trace(”xml dosyası yüklenemedi!!”);
}
};
myXML.load(”xml_102_4.xml”);
font ve font_size adlı değerler XML objesindeki <content> adlı alt-nodun, myXML.firstChild.childNodes[4], attribute’ları olan font ve font_size’ın değerleri almaktadır ve bu değerler text biçimlendirme için devam denen satırlarda kullanılmaktadır.
Yukarıdaki örneği bir fla dosyasında görmek istiyorsanız XML_102_4.zip dosyasına bakabilirsiniz.
İşte arkadaşlar XML budur! Tabi XML’i server’a kaydetmek ve geri veri almak, XML socket’lerine sahip sunucular ile çalışmak gibi ileri konular mevcut ancak her iki tutorial’da anlatılanlar ile artık XML konusuna hakim şekilde çalışmalarınızı sürdürebilirsiniz.