RadioButton Component


Çalışmamızda bir TextArea,bir Button ve 3 RadioButton component kullanılmıştır. Seçilen RadioButon ismi TextArea bölgesine yazılmakta ve butona tıkladığınızda ilgili web sayfasına yönlenme yapılmaktadır. Karmaşık hazırlamamızın tek nedeni componentlerdeki kodların tamamını çalışmamız içine alabilmek ve anlamanızı kolaylaştırmak içindir.

DOSYAYI İNDİR

Uygulama:

1- Sahneye alt alta 3 radiobutton yerleştirin.Sırası ile radioButton1,2 ve 3 olarak adlandırın. Bir tanesini seçin ve properties paneline bakın:

label alanına panelde görülmesini istediğiniz ismi yazın.Biz arama motorlarına link vereceğimizden Altavista yazdık.labelPlacement kısmına right yazdık. Bu ismin radiobutonun neresinde oluşturmak istediğinizi belirler. Left, top, bottom seçenekleriniz de vardır. selected alanı swf dosyası açıldığında butonun seçili gelip gelmeyeceğini belirler. Şayet birinde true seçeneğini kullanırsanız swf dosyası açıldığında o buton seçili olarak gözlenir.Biz tümünde false seçeneğini kullandık. Şayet birden fazla butona true seçeneği veriseniz hepsi seçili gelmez,sadece en altta kalan seçim seçili olarak açılır. data alanı radiobutonun değerini verir. Biz bu değere bir url adını atadık, daha sonra getURL komutu ile ilgili alana yönlenme sağlayacağız. Burada groupname alanı önemlidir.Tüm radiobutonlarda aynı grup adını( butonlar ) kullandık. Bu sayede 3 buton bir grup gibi hareket eder ve biz sadece bir tanesini klip oynarken seçebiliriz. 3 lü gruplar halinde 2 ayrı radiobuton bölümü oluşturacaksanız bu üçlü grupların isimlerini farklı yazmalısınız.Örneğin ilk 3 tanesi butonlar1 diğer 3 tanesi butonlar2 gibi. Bu sayede her iki grupta ayrı ayrı seçim yapabilme şansınız olur.

2- Üste panelden bir TextArea yerleştirin ve isim olarak mesaj yazın. Properties panelinde text alanına gözükmesini istediğiniz metni yazın. Bu metin daha sonra seçilen butona göre değişecektir. Diğer seçenekleri false olarak tutun.

3- Alt kısma bir Button component yerleştirin ve buton olarak isimlendirin. label alanına butonda gözükmesini istediğiniz metni yazın.

4- Şimdi 1.kareyi seçin ve şu komutu atayın:

radioButonObject = new Object();
radioButonObject.click = function(){
secilenRadioButon = butonlar.selection;
secilenRadioButonLabel = secilenRadioButon.label;
secilenRadioButonData=secilenRadioButon.data;
mesaj.text = secilenRadioButonLabel+" arama motorunu seçtiniz";
trace(secilenRadioButon);
trace(secilenRadioButonLabel);
trace(secilenRadioButonData);
}
butonlar.addEventListener("click", radioButonObject)


butonListener = new Object();
butonListener.click = function (){
getURL(secilenRadioButonData,"_blank");
}
buton.addEventListener("click", butonListener);

Aslında bu kadar kod kullanmaya gerek yok.Ayrıca textArea yerine bir dinamik metin kutusu, button component yerine basit bir buton kullanabilirsiniz. Yazının başında da belittiğim gibi amaç bu paneldeki tüm kod grubunu görmenizdir.

İlk dizinde klasik başlangıç olarak radioButonObject isimli yeni bir nesne tanımlıyoruz.radioButonObject.click = function() la başlayarak radiobuton seçildiğinde oluşmasını istediğimiz kodları içeren fonksiyonumuzu oluşturuyoruz.

secilenRadioButon = butonlar.selection; komutu ile seçilen butonun yolu tesbit ediliyor.Alttaki trace komutuna bakarsanız filmin test modunda output penceresinde _level0.radioButton1 (2 veya 3 seçime göre) olduğunu göreceksiniz.

secilenRadioButonLabel = secilenRadioButon.label; komutu seçilen radiobutonun label yani metnini döndürür. Bunu yine test modunda output penceresinde görebilirsiniz.

secilenRadioButonData=secilenRadioButon.data;( yukardaki örnekte açılımı _level0.radioButton1.data şeklindedir) ise properties panelinde data alanına yazılan metni yani çalışmamızda bir web adresini döndürür.

Şimdi kodları yerine oturtuyoruz. mesaj.text = secilenRadioButonLabel+" arama motorunu seçtiniz"; mesaj TextArea componentinin adı. Bu alana seçilen alanın ismi yukardaki kod ile yazılıyor. Seçimi her değiştirdiğinizde bu metinde değişecektir.

trace kodları değişkenlere atanan değerleri görmeniz içindir. Silebilirsiniz.

Son olarak radiobuton grubuna ( ki biz buna butonlar adını vermiştik) butonlar.addEventListener("click", radioButonObject) komutu ile yukardaki fonksiyon atanır.

butonListener = new Object();
butonListener.click = function (){
getURL(secilenRadioButonData,"_blank");
}
buton.addEventListener("click", butonListener);
Bu kod grubu buton component içindir. Bu butonu tıkladığınızda fonksiyon içindeki getURL komutu çalışır ve secilenRadioButonData değişkeninin ( bu yukarda anlatıldığı gibi bir web adresidir) yüklendiği web adresine yönlenme sağlanır.

Şayet yönlendirme için button component değil de basit bir buton kullanmayı isterseniz butona şu komutu eklemeniz aynı fonksiyonu sağlar(1.karedeki button component kodlarını silerek):

on (release) {
getURL(secilenRadioButonData,"_blank");
}