ScrollPane Component

Scrollpane dinamik resim veya swf dosyalarını yükleme amacı ile kullanılır.İsterseniz bir metin dosyasını da harici olarak yükleyebilirsiniz. Buna ait bir örnek sayfanın sonunda verilecektir.Örneğimiz dışardan bir jpg dosyası yüklenmesi için hazırlanmıştır

Önemli not: Açıkcası Flash-MX 2004 şimdiye kadar hiçbir versiyonda rastlanmadığı kadar bug içermektedir.İlk yüklenmede scrollPane`ye ait scrolllar görülmüyor.Sayfayı yeniden yüklediğinizde scrollar gözlenecektir.Yine ikinci çalışmadaki scrollPane`de preloading çalışmıyor.Halbuki dosyayı indirip test modunda View-->Simulate Download kısmını tıklarsanız çalışmanın kusursuz işlediğini göreceksiniz.Aynı hatalar media panellerinde, accordion ,loader ve progressbar panellerinde de mevcut.Ayrıca stil kodları hemen tüm panellerde düzenli çalışmıyor.

Özetle web çalışmanızda şu haliyle component uygulaması, hem hataları hem de yüksek dosya boyutları nedeni ile pek mantıklı gözükmüyor. Ama lokal çalışmalarda kullanılacak özelliklere sahipler.

DOSYAYI İNDİR

Uygulama:

1- Sahneye bir scrollPane component yerleştirin.

2- Paneli seçip properties alanına baktığınızda alttaki görüntüyü izleyeceksiniz.bunları sırası ile açıklayalım.

contentPath:
Bu alana harici olarak yüklenecek swf veya jpg dosyasının yolunu yazmalısınız.Swf dosyası ile resim dosyası aynı dizinde ise sadece ismini yazmanız yeterli olur. Şayet kütüphaneden bir film klibini scrollpane içine almayı düşünüyorsanız bu klibe atanan identifier adını eklemeniz yeterli olacaktır. Hatırlayacağınız gibi bir klibe identifier adı verebilmek için kütüphanede klip üzerine sağ klik yapıp linkage seçeneğini tıklamanız gerekecektir.

hLineScrollSize:
Horizontal scrollbarın butonlarına tıklandığında hareketin kaç piksel olacağını ayarlar.Varsayılan değer 5`dir.

hPageScrollSize:
Horizontal scrollbarın track`ına tıklandığında kaç piksellik kayma olacağını belirler.Varsayılan değer 20`dir.

hScrollPolicy:
Horizontal scroll`un bulunma şeklini ayarlar.auto seçeneği gerekli olduğunda görülmesini sağlar.on veya off seçeneklerini kullanabilirsiniz.

scrollDrag:
Varsayılan değer false`dir.Bu seçeneği true yaparsanız panel içindeki resmi fare ile sürükleyerek hareket ettirebilirsiniz. Yani scrollların işlevinin aynısını fare ile oluşturabilirsiniz.

vLineScrollSize, vLineScrollSize, vPageScrollSize:
Yukardaki işlemlerin aynısını vertikal scroll için oluşturur.

3- Tüm çalışma bu kadar filmi test edebilirsiniz.

Şimdi aynı çalışmayı tamamen dinamik yöntemle oluşturalım

Bu çalışmada sahneye hiçbirşey eklenmeyecektir. Tüm çalışma sadece actionscript kodları ile oluşturulacaktır. Bu çalışmanın amacı scrollPane kodlarını bir örnek içinde görüp daha kolay değerlendirmeniz içindir.

Çalışmamızda yine dinamik yöntemle oluşturulan bir peloader mevcuttur.Şimdi alttaki butonu tıklayınız.

DOSYAYI İNDİR

Uygulama:

1- Sahnede 1.kareye alttaki komutları atayın:

createClassObject(mx.containers.ScrollPane, "scrollPane", 0);
scrollPane.setStyle("themeColor", "haloOrange");
scrollPane.scrollDrag=true;
scrollPane.setSize(175, 200);
scrollPane._x=1;
scrollPane._y=1;
createTextField("kutu",1,50,80,100,40);
kutu.type="dynamic";
kutu.textColor=0xCC0000;
yukleme = new Object();
yukleme.progress = function(eventObj){
var total=scrollPane.getBytesTotal();
var yuklenen=scrollPane.getBytesLoaded();
oran=Math.floor((yuklenen/total)*100)
_root.kutu.text="% "+oran + " yüklendi";
}
scrollPane.addEventListener("progress", yukleme);
scrollPane.contentPath = "kedi.jpg";
yukleme.complete = function(eventObj){
_root.kutu._visible=false;
}
scrollPane.addEventListener("complete", yukleme);

2- Filmi test edin.Panelin ve preloaderın kusursuz çalıştığını göreceksiniz. (Yüklenecek resim ile swf dosyası aynı dizinde olmalıdır. Şimdi kodları açıklayalım.

createClassObject(mx.containers.ScrollPane, "scrollPane", 0);

//Burada instance name scrollPane atanmış ve level0`a dinamik olarak yerleştirilen bir panel oluşturulmaktadır. Bu yöntemle diğer panelleri de oluşturabilirsiniz.Örnek:

createClassObject(mx.controls.Button,"button2",0,{label:"Test Buton"});

gibi.Burada ek olarak label ekleme şansı da verilmiştir.Class`lar actionscript kodları bölümünde ayrıca anlatılacaktır.

scrollPane.setStyle("themeColor", "haloOrange");

//Panelin rengi orange olarak ayarlanmıştır.

scrollPane.scrollDrag=true;
scrollPane.setSize(175, 200);
scrollPane._x=1;
scrollPane._y=1;

//Panele drag özelliği , en ve boy ebadları,sahnedeki x ve y koordinatları atanıyor.

createTextField("kutu",1,50,80,100,40);
kutu.type="dynamic";
kutu.textColor=0xCC0000;

// Metin kutusu, türü ve font rengi dinamik olarak oluşturuluyor.
Değerler("instance_name",seviye,x_koordinatı,y_koordinatı,en,boy) şeklinde sıralanır.

yukleme = new Object();
yukleme.progress = function(eventObj){
var total=scrollPane.getBytesTotal();
var yuklenen=scrollPane.getBytesLoaded();
oran=Math.floor((yuklenen/total)*100)
_root.kutu.text="% "+oran + " yüklendi";
}
scrollPane.addEventListener("progress", yukleme);

// Burada klasik bir event object kodları oluşturuluyor.Bu kodları tüm panellerde görebilirsiniz.Teknik hep aynıdır.Önce yeni bir nesne oluşturulur ve ona planlanan olay oluştuğunda(buradaki gibi bir progress olayı olabileceği gibi click,complete olayı da olabilir) yapılacak bir fonksiyon atanır.

Yukarıda scrollPane içine yüklenecek nesne için preloader kodları oluşturulmuştur.Bu bilinen preloader kodları gibidir ve güncel yükleme oranını gösterecek değer dinamik olarak oluşturduğumuz metin kutusuna atanır. İsterseniz burada yine dinamik yöntemle oluşturulan bir film klibi barı gerçekleştirebilirsiniz.

scrollPane.contentPath = "kedi.jpg";

//scrolPane içine yerleştirilecek nesnenin yolunu bu alana yazıyoruz.İsterseniz bir swf dosyası da yerleştirebilirsiniz.

yukleme.complete = function(eventObj){
_root.kutu._visible=false;
}
scrollPane.addEventListener("complete", yukleme);

// Yine bir event object kod grubunu görüyorsunuz. Burada yükleme tamamlandığında tetiklenecek kod grubu yazılmıştır. Resim yüklendiğinde metin kutusunun ortadan kalkması sağlanır.

Yukarıdaki 2 çalışmada scrollPane`lerde kullanılan kod gruplarının hemen tamamına değinildiğinden bu panele ait actionscript kodlarını tek tek incelemeye gerek kalmamıştır. Bu nedenle diğer panellerdeki kod açıklamasına bu bölümde yer verilmedi.

ScrollPane içine metin dosyası yüklemek

Bu çalışma Ultrashock sayfasından alınmış ve örnek amaçlı sayfamıza yerleştirilmiştir.Bu nedenle anlatım yapılmayacaktır.

DOSYAYI İNDİR