XML İLE MP3 ÇALMAK
Flash içinde birçok yaralı araç yapabilirsiniz. Kimileri basit kimileri karışık kimileri pratik ve gayet dinamiktir. Eğer AS3 kullanıyorsanız ve pratik bir uygulama yapmak istiyorsanız XML kullanmalı ve uygulamalarınızı ona göre kodlamalısınız. Tabi benim işim acele diyorsanız, 2 resimi ve mp3 dosyasını flashınızın kütüphanesine atıp bir iki basit yöntemle işinizi halledebilirsiniz. Bu fikre katılanlar sizinle işimiz buraya kadar, diğer arkadaşlar (daha pratik, daha profesyonel, daha dinamik, daha daha olanlar) okumaya devam edin.
Yapmak istediğimiz şey bir albüm bir müzik çalar, bir haber gösterici vs. Ama öyle yapmalıyız ki ikide bir flashı açıp içinde düzenleme yapmamıza gerek kalmamalı. Bu yüzden XML dosyalarını kullanarak müzik, resim, bilgi vs gibi verileri flashın içine yükleyebiliriz.
Kullanımı basit, yapmanız gereken tek şey kodu kopyalayıp yapıştırın.
XML MİMARİSİNİ ANLAMAK
kitap.xml dosyasının içinde mp3 parçalarına ait bilgiler var. Öncelikle <playlist> isminde ana bir dizin açılır. ve tüm alt öğeler bu iki tag içine yazılır.
<playlist>...</playlist>
Her müzik dosyası için <track></track> taglarını kullanıyoruz. bu taglar türkçe karakter barındırmayan boşluğu olmayan metinler olabilirler. <ahmet></ahmet> <neayaksin></neayaksin> gibi.
Her track'in içinde de mp3 lere ait bilgiler var. Aşağıda gördüğünüz xml dosyasının içinde 3 adet müzik dosyası var. Ve içlerinde bu müzik dosyalarına ait albüm title band ve file bilgileri tutuluyor.
<playlist>
<track>
<album>Signs of Life</album>
<title>Carnival Of Rust</title>
<band>Poets of the Fall</band>
<file>Carnival_Of_Rust.mp3</file>
</track>
<track>
<album>Signs of Life</album>
<title>Late Goodbye</title>
<band>Poets of the Fall</band>
<file>Late_Goodbye.mp3</file>
</track>
<track>
<album>Signs of Life</album>
<title>Stay</title>
<band>Poets of the Fall</band>
<file>Stay.mp3</file>
</track>
</playlist>
Biraz sonra bu XML yapısını flash içine yükleyip mp3ler hakkında bilgileri ekrana yazdıracağız. Sizde 3 adet mp3 alın her bir track'in <file></file> tagları arasındaki dosya isimlerini kendi mp3lerinizin isimleri ile değiştirin. Flash belgenizi mp3lerin yanına kaydetmeyi unutmayın.
Eğer müzik dosyalarınız bir klasörün içinde ise mesela mp3 isimli bir klasörünüz var ve müzikler onun içinde o zaman xml dosyanızdaki <file> kısımlarına tam yollarını yazmanız gerekecektir mp3/Stay.mp3 gibi. Yazmazsanız debelenip durursunuz.
FLASH ACTIONSCRIPT 3.0 KODLAMA
Gelelim kod kısmına.
var xmlLoader:URLLoader = new URLLoader();
xmlLoader.load(new URLRequest("kitap.xml"));
bu 2 satır kod xml dosyanızın flashınıza yüklenmesini sağlayacak. Böylece mp3lerle alakalı bilgileri flash içinden okuyabileceğiz ve o müziği çal diyebileceğiz.
İlk satır xmlLoader isminde bir yükleyici tanımlıyor. Ardından bu yükleyiciye load komutu ile yeni bir yükleme dosyası atanıyor. Ve yüklüyor.
Yükleme işlemi tamamlandığında (ki xml dosyanız belki çok büyüktür yüklenmesi zaman alabilir) içindeki bilgileri kullanmaya başlayabiliriz. Tamamlanmadan bir işlem yapmaya çalışırsak hata ile karşılaşırız bu yüzden yükleme işlemleri için her zaman tamamlanıp tamamlanmadığını kontrol etmeliyiz.
xmlLoader.addEventListener(Event.COMPLETE, showXML);
function showXML(e:Event):void
{
//KODLAR
trace("yükleme tamamlandı");
}
Yukardaki kodu kullanarak
xmlLoader ile yapılan yüklemenin COMPLETE yani tamamlandığının kontrolü yapılıyor. Ve tamamlandıysa
showXML isimli fonksiyon çalıştırılacak. Ki bizde tamamlanma işleminden sonra mp3leri çalmayı düşünüyoruz. Yani kodları bu kısıma yani fonksiyonun içine yazacağız. Kodu yazıp çalıştırdığınızda output(F2) penceresine yükleme tamamlandı yazmalı.
Şimdi Sahnemizi oluşturalım;
Sahneye oynat ve Durdur butonu ve müziğin başlığını gösterecek bir dinamik text alanı yerleştirin. Butonların isimleri oynat ve durdur metin alanının ismi ise parca olsun. Kod yazacaksanız her nesneye isim vermelisiniz. (Metin alanının özelliklerinde AntiAlias kısmını açıp Use Device Font'u seçin. Bu mp3 player için gerekli bir ayar değil metin alanında kullanılan font ile alakalı bir işlemdir. Fontu standart bi font kullanacağız ondan onu seçin.) Kodumuzun eklemelerle son hali şu şekilde.
var xmlLoader:URLLoader = new URLLoader();
xmlLoader.load(new URLRequest("kitap.xml"));
xmlLoader.addEventListener(Event.COMPLETE, showXML);
function showXML(e:Event):void
{
XML.ignoreWhitespace = true;
var songs = new XML(e.target.data);
// Signs of Life - Locking Up The Sun
parca.text = songs.track[0].album.text() +" - "+songs.track[0].title.text();
}
Bi aksilik olmaması lazım. Eğer hatalarla karşılaşıyorsanız xml dosyanız ile fla dosyanızın aynı klasörde olduğuna dikkat edin.
Peki fonksiyonun içindeki kodlar nedir?
XML.ignoreWhitespace = true;
İle xml dosyanızın içie yazdığınız verilerin önünde ve sonunda boşluk varsa onları kaldırır.
var songs = new XML(e.target.data);
En önemli kısım burası, songs isminde bir değişken tanımlanıyor ve XML'den gelen veriler bu değişkene aktarılıyor. ve bu dğeişkeni kullanarak XML içinde bulunan alanlara ki bunlar trackler, titlelar, album ve file taglarıdır. Yanı bu alanlara artık erişebiliriz.
parca.text = songs.track[0].album.text() +" - "+songs.track[0].title.text();
Bu kod ile de sahnemizde bulunan parca isimli yazı alanına
ilk trackte (track[0] yani) bulunan parçanın album ve title metinlerini aralarına - işareti koyarak yazdırıyoruz. Böylelikle şu anki parça gözüküyor. Oynatma işlemi yapmadık sadece xmlden veri çekiyoruz.
Oynatmayı yapmadan önce ileri ve geri butonlarınıda ekleyin. İsimleride ileri ve geri olsun. Kodların son ali şu şekildedir.
var xmlLoader:URLLoader = new URLLoader();
xmlLoader.load(new URLRequest("kitap.xml"));
var songs; //xml verilerini içinde bulunduran değişken
var hangiMuzik=0; //hangi parçada olduğumuzu tutan sayı başlangıçta 0 ileri butonuna basıldıkça arttırılıyor
var muzik:SoundChannel; //ses çalmlak için değişken
var s:Sound; //sesi atayacağımız değişken
xmlLoader.addEventListener(Event.COMPLETE, showXML);
function showXML(e:Event):void
{
XML.ignoreWhitespace = true;
songs = new XML(e.target.data);
parca.text = songs.track[hangiMuzik].album.text() +" - "+songs.track[hangiMuzik].title.text();
}
oynat.addEventListener(MouseEvent.CLICK, cal);
function cal(event:MouseEvent):void
{
s = new Sound();
s.load(new URLRequest(songs.track[hangiMuzik].file.text()));
muzik = s.play();
}
durdur.addEventListener(MouseEvent.CLICK, dur);
function dur(event:MouseEvent):void
{
muzik.stop();
}
ileri.addEventListener(MouseEvent.CLICK, sonraki);
function sonraki(event:MouseEvent):void
{
hangiMuzik++;
parca.text = songs.track[hangiMuzik].album.text() +" - "+songs.track[hangiMuzik].title.text();
muzik.stop();
}
geri.addEventListener(MouseEvent.CLICK, onceki);
function onceki(event:MouseEvent):void
{
hangiMuzik--;
parca.text = songs.track[hangiMuzik].album.text() +" - "+songs.track[hangiMuzik].title.text();
muzik.stop();
}
Yukardaki turuncu renkli alanlar bizim için önemli, oynat durdur ileri ve geri isimli butonlar için tıklama fonksiyonları yazılmıştır. yukarıda da
hangiMuzik: ileri geri tıkladığımızdaki sıradaki müziğin hangisi olduğunu tutacağıız bir interger değerdir. İleri ve geri butonlarının içlerine bakarsanız hangiMuzik++ ve -- kodları ile 1er 1er arttırılıp azaltılmaktadır bu sayı.
muzik: Flash içinde ses çıkışı sağlanabilecek bir ses kanalı tanımlanması gerekiyor. Bunu en yukarıda yapıyoruz ki olurda diğer fonksiyonar içinde kullanamız gerekebilir.
s: Bu da bizim ses dosyamızı atayacağımız değişken. Bu atama işlemini Oynat butonu içinde yapıyoruz.
songs.track[hangiMuzik].file.text()
Bu komut bize mp3 dosyasının yolunu veriyordu, hangiMuzik değişkeni ise hiç arttırılmamış ise yani ileri veya geri butouna basılmamış ise 0 durumda en yukarda tanıtılmıştı. Eğer 0 ise ilk parça, 1 ise 2. , 2 ise 3. trackteki parçanın dosya yolunu almamızı sağlıyor.
muzik.stop();
Durdur butonunda ise müzik kanalını durdurarak seslerin birbirine girmesini engellioruz. Aynı şekilde iler geri butonlarına da koydum ne olur ne olmaz.
Ayrıca ileri geri butonlarına
parca.text = songs.track[hangiMuzik].album.text() +" - "+songs.track[hangiMuzik].title.text();
komutunuda yerleştiriseniz her bir parça değişiminde sıradaki parçayı yazı alanında görebilirsiniz.
bu player daha da detaylandırılabilir. Progress bar koyulabilir, parçalar yüklenmişmi yüklenmemişmi, veya parçanın kaldığı yerden devam etmesi gibi özellikler kazandırılabilir. Ses açma kapama özelliği eklenebilir.
yer = muzik.position ile o an çalan parçanın milisaniye cinsinden yeri tespit edilebilir.
ve yine muzik.play(yer) ile kalındığı yerden çalınmaya başlanabilir.
var my_transform = new SoundTransform();
my_transform.volume = 1;
gibi kodlarla da ses ayarlamaları eklenebilir. Zamanımız oldukça burada paylaşacağım. Kolay gelsin.
