Button Component

Hazırlanması son derece kolay olan bir paneldir.Alttaki butona tıkladığınızda bir sayfa açılması için getURL komutu kullanılmıştır. Altta göreceğiniz gibi hazırlanan bir fonksiyona ne yapmak istiyorsanız o komutları ekleyebilirsiniz.

DOSYAYI İNDİR

Buton hazırlama işlemini tamamen properties panelinden düzenleyeceğiz:

Properties paneline baktığınızda 5 eleman göreceksiniz.

Icon alanı opsiyoneldir. Bir eklenti düşünmüyorsanız boş bırakabilirsiniz. İkon ekleme işlemini accordion panelinde anlatmıştır. Bunun için boş bir filim klibi oluşturun ve ikon resminizi sahneye import edin. Uygun alana yerleşmesi için bu resmin x ve y değerlerini sıfır yapın. Bu değerleri verdiğinizde hemen buton yazısının soluna yerleşecektir.

Şayet yazıya bitişik değilde biraz daha sola lokalize olmasını isterseniz ikonu seçip klavye yön tuşu ile birkaç piksel sola alabilirsiniz. Filmi kapatın . Bu film sadece kütüphanede kalacak, sahneye eklemeyiniz. Kütüphaneyi açın ve bu klip üzerine sağ klik yapıp linkage seçeneğini tıklayın, açılan panelde Export for Actionscript alanını işaretleyip identifier adı olarak properties paneline yazacağınız ikon adını verin. Test modunda bu ikon butonunuza eklenecektir.

Label alanına buton üzerinde olmasını istediğiniz metni yazın.

labelPlacement alanı ise metnin yaslanacağı kenarı belirler biz sağ tarafı seçtik, isterseniz bu alanı tıklayarak yukarıdaki resimde de görüldüğü gibi menüyü açıp yerleşim yerini değiştirebilirsiniz.

selected ve toogle alanının varsayılan değeri false dir. False durumunda butona basılıp bırakılınca ilk haline (up durumu) gelir. Şayet heriki değeri de true yaparsanız buton ilk tıklamada basılı durumda (down durumu) kalır.Eski haline dönmesi için 2. tıklama gerekir.

Şimdi komutlarımızı ekleyelim. 1.kareye şu komutu verin:

buton.color = 0x006699;
buton.setStyle("themeColor", "haloBlue");
buton.setStyle("fontSize",14);
buton.setStyle("fontStyle","italic");
buton.setStyle("fontWeight","bold");
buton.setStyle("fontFamily ","Verdane");

komut = new Object();
komut.click = function (){
getURL("http://www.flashokulu.com/forum",_blank)
}
buton.addEventListener("click", komut);

İlk 5 dizin metnin stilini ayarlamak içindir. Gerek görmüyorsanız yazmayabilirsiniz. Burada tema olarak haloBlue seçilmiştir. haloOrange seçimini yapabilirsiniz veya bu kodu hiç eklemez ve varsayılan tema olan haloGreen`i seçebilirsiniz.

Sonraki komutlar flash`ın klasik kodlarıdır. Bir nesne oluşturulup o nesneye bir fonksiyon bağlanıyor ve bu nesneye ait özellikler tıklama durumunda butona atanıyor.

Buton componentini dinamik olarakta oluşturabilirsiniz. Buna ait örnekler ilerde uygulamalar bölümüne eklenecektir.

Button component`ini sadece kod kullanarak düzenlemek

Burada properties paneline hiç dokunmayacağız. Yukarıdaki örnek dosyayı açın. Sahnedeki butonu seçip silin, aynı işlemi kütüphaneyi açarak button componentini silerek tamamlayın. Kütüphanedeki ikon dosyası ve klibine dokunmayın.Boş olan sahneye component panelinden bir buton çekerek yerleştirin. İnstance name kısmına buton yazın. 1.karedeki komutları şu komutlarla değiştirin:

buton.label = "Forum";
buton.icon="ikon";
buton.labelPlacement="right";
buton.toggle = true;
buton.selected = true;

komut = new Object();
komut.click = function (){
getURL("http://www.flashokulu.com/forum",_blank)
}
buton.addEventListener("click", komut);

Yukarıdaki örneğin aynısı ortaya çıkacaktır.

Button Component Kodları

Button.click :

Bu kod örneğimizde kullanıldı. Butona tıklandığında oluşturulan bir fonksiyona atana kodlar çalışır. Mutlaka bir obje ve fonksiyon grubu ile çalışmanız şart değildir. Basit olarak bir on olayına atanabilir. Örnek:

on(click){
....uygulanacak kodlar...
}

Button.icon :

buton_instance_name.icon="ikon_adı"; şeklinde kullanılır . Burada ikon_adı yerine ikonu oluşturduğunuz film klibine atanan identifier adı yazılır.

Button.label :

buton_instance_name.label="Buton_metni"; Butonda görülmesini istediğiniz metni yazın.

Button.labelPlacement:

buton_instance_name.labelPlacement="right"; Bunun dışında left, top, bottom seçeneklerini kullanabilirsiniz.

Button.selected ve Button.toggle komutlarının varsayılan değeri false`dir. Şayet bu 2 değeri true yaparsanız butona tıkladığınızda basılı pozisyonda kalır.