Alert Component


Aşağıdaki swf dosyasında sadece Dosyayı İndir butonunu görüyorsunuz. Bu çalışmamızda alert componentini bir uyarı mesajı vermesi için planladık. Dosyadaki butona bastığınızda bir uyarı penceresi çıkacaktır. Burada dosyanın boyutu bildirilip indirme komutunun onaylanması istenecektir. Evet butonuna basarsanız ilgili örneği indirebileceksiniz.

Not= Bu deneme çalışması değildir. Şayet bu dosyayı indirip incelemek istiyorsanız Evet butonuna basınız. Her iki butona da bastığınızda animasyonun yenilenmesi için başka bir kareye atlar. Bu kare örneği tekrar görmeniz için eklenmiştir. Siz bu kareyi silebilirsiniz.

 

Uygulama:

1- Sahneye bir alert component sürükleyin ve sonra bunu seçip silerek sahneyi boşaltın. Sahnede copmonent bulunmamasına rağmen kütüphaneye eklenmiş olacaktır. Bunu kodlarla çağırarak kullanacağız. Sahneye dosyayı indir yazan bir buton ekleyin ve bu butona şu komutu verin:

on (release) {
nextFrame();
}

Bu komutla film asıl kodların bulunduğu bir sonraki kareye geçecektir.

Panele atayacağımız ikonu oluşturmak için CTRL+F8 tuşlarına basın açılan panelden film klibi seçeneğini işaretleyin ve filminizin içine ikon resminizi import edin. Klip içine yerleştirilmiş filmin x ve y değerini properties panelinden sıfır olarak atayın. Şayet çalışmanızı değerlendirirken ikonun yerleşim yerini beğenmezseniz bu film klibi içindeki ikon resminin yerleşim yerini birkaç piksel değiştirebilirsiniz. Bu klip sadece kütüphanede olacaktır. Anasahneye yerleştirilmeyecektir. Kütüphaneyi açın ve ikon klibine sağ klik yapın. Linkage seçeneğini işaretleyin. Açılan paneldeki Export for Actionscript kutusunu işaretleyin ve ID alanına ikon kimlik adını verin. Bu klip daha sonra kodlarla panele tuturulacaktır.

2- 2. kareye blank keyframe atayın. Yani 2. karede sahne boş kalacaktır. Buraya sadece kodları ekleyerek alert componentin ortaya çıkmasını sağlayacağız. 2. kareye şu kodları ekleyin:

import mx.controls.Alert
baslat = function (evt){
if (evt.detail == Alert.OK){
getURL("alert.zip")
nextFrame();
} else if (evt.detail == Alert.NO) {
nextFrame();
}
}
Alert.okLabel = "Evet";
Alert.noLabel = "Hayır";
Alert.show("Dosya boyutu 145Kb`dır. İndirmek istiyormusunuz?", "Uyarı Paneli", Alert.OK | Alert.NO, this, Baslat, "ikon", Alert.NO);

İlk dizin alert componenti kütüphaneden sahneye almayı sağlar. Alttaki fonksiyon bir Alert.click komutudur.En alt dizindeki Alert.show komutu ile sahneye eklenen butonlar tıklandığında ne yapacağını anlatır. Bu nedenle açıklamaya alttan başlayalım. Alert.show komutu sahneye eklenecek elemanların düzenlenmesini sağlar.

Alert.show(Mesaj,Başlık,Eklenenecek_buton_isimleri,Panel_lokalizasyonu,Çalıştırılacak_fonksiyon,İkon,Aktif_buton);

şeklinde yazılır. İlk 2 alana yazmak istediğiniz mesaj ve başlık metninin girin. Eklenecek butonlar ise 4 tip olabilir. OK, Cancel, Yes ve No butonları. Bunun dışında buton ekleyemezsiniz ama örnekte görüldüğü gibi üzerindeki metinleri düzenleyebilirsiniz. Şayet birden fazla buton eklemek istiyorsanız yine örnekte gördüğünüz gibi herbirini " | " işareti ile birbirinden ayırmalısınız. Açılacak uyarı penceresi daima merkeze lokalizedir. Bu Panel lokalizasyonunu _parent, _root veya this olarak ayarlayabilirsiniz. Örneğimizde kullandığımız baslat fonksiyonunda olduğu gibi fonksiyon adını çalıştırılacak_fonksiyonlar alanına yazmalısınız. Aktif buton kısmına panel ilk açıldığında hangi butonun aktif ve seçili gelmesini isterseniz o butonun adını yazmalısınız. Biz hayır butonunu tercih ettik.

Şayet butonlardaki varsayılan metni düzenlemek isterseniz tek tek ama az evvel anlattığımız koddan önce tanımlamalısınız. Alert.okLabel = "Evet"; ve Alert.noLabel = "Hayır"; şeklinde.

Şimdi uyarı mesajı oluştuğuna göre butonlara basıldığında yapılacak işlemleri (Alert.click) tanımlayalım:

baslat = function (evt){
if (evt.detail == Alert.OK){
getURL("alert.zip")
nextFrame();
} else if (evt.detail == Alert.NO) {
nextFrame();
}
}

Burada evt bir parametredir Başka bir isimde yazabilirsiniz. detail ise hangi butona basıldığını denetler. Her 4 butondan biri tıklandığında flash ona sayısal bir değer verir. Bu değer Yes için 1, No için 2, Ok için 4, Cancel için 8`dir. Yani siz kodu evt.detail == Alert.OK değilde evt.detail == 4 yazarsanız fonksiyon yine çalışacaktır. Burada tanımlanan şayet OK(Biz onu evet olarak değiştirdik) butonuna basılırsa yükleme başlayacak ve bir sonraki kareye geçiş yapılacak, No(hayır) butonuna basarsanız bir yükleme olmaz ve bir sonraki kareye geçiş olur. Bu son kareyi örneğin kaybolmaması için yaptık. Normalde butonlara tıklandığında mevcut uyarı penceresi kalkar ve sahne boş gözlenir. Şimdi kodlara geçelim. Diğer örneklerde de anlatıldığı gibi actionscript panelinde aşağıda yazılan kodlar gerçek componentin kodlarıdır. Diğer kodlar tüm paneller için geçerli olduğundan burada tanımlanmayacaktır.

Alert Component Kodları


Alert.buttonHeight:

Componente eklenen butonların yüksekliğini ayarlar. Alert.buttonHeight=bir-değer; şekinde kullanılır. Örneğimizde 1.karedeki kodlarda Alert.show komutundan hemen önce Alert.buttonHeight=100; yazarak bir deneme yapabilirsiniz. Alert.show komutundan sonra yazarsanız buton özelliklerinin tanımı tamamlanmış ve gösterilmiş olacağından bu kod değerlendirmeye alınmayacaktır. Tanımlamadan önce bu kodu yazmalısınız.

Alert.buttonWidth:

Butonların enini ayarlar. Alert.buttonWidth=bir_değer; şeklinde kullanılır.

Alert.click:

Butonlara tıklandığında bir fonksiyona atanan kod grubunun çalışmasını sağlar. Örneğimizde baslat fonksiyonu ile kullanılmıştır.

Alert.cancelLabel:

Cancel butonunun metnini değiştirmek için kullanılır. Alert.cancelLabel= "İptal" gibi kullanılır. Buton metinlerini değiştiren veya buton özelliklerini değiştiren tüm komutlar mutlaka Alert.show komutundan önce yazılmalıdır. Bu kod altına yazılırsa değerlendirmeye alınmazlar.

Alert.noLabel:

No buton adını değiştirmek için kullanılır.

Alert.okLabel:

OK buton metnini değiştirmek için kullanılır.

Alert.yesLabel:

Yes buton metnini değiştirmek için kullanılır.

Alert.show():

Alert panelinin asıl özellikleri bu komut ile atanır. Örneğimizde nasıl kullanılacağı detaylı olarak anlatılmıştır.