ProgressBar Component

ÖNEMLİ UYARI: Flash MX2004 versiyonunda özellikle componentlerde gerek kod gerekse panellerde oldukça fazla bug mevcut. Alttaki örnek usulüne uygun hazırlanmasına rağmen webde preloading işlemi çalışmamaktadır.Yalnız dosyayı indirip test moduna geçtikten sonra View-->Simulate Download alanını tıkladığınızda önyükleme çubuğunun sonderece düzgün çalıştığını görebilirsiniz.Umarız bu hatalar daha sonra düzeltilir.Webde çalışmamasına rağmen genel prensipler örnekte anlatılmıştır.

Yine webde çalışmanın transparan özelliği ve scale işlemi de ilk yüklemede gözlenmemektedir. Sayfa açılıp resim yüklendikten sonra browserdan yenile tuşuna basınız.Bu durumda problem çözümlenmektedir.

Progressbar component`i ile Loader component`i birbiri ile son derece uyumlu çalışırlar.Örneğimizde bu iki component birarada kullanılacaktır.Çalışmayı hazırlamanın en pratik yolu hem properties panelini kullanmaktır.

DOSYAYI İNDİR

Uygulama:

1- Sahneye bir loader componenti yerleştirelim ve instance name kısmına loader yazalım. Üst kısma yeni bir layer ekleyelim ve bu layerın 1.karesi seçili iken loader componentinin tam ortasına bir progressbar componenti yerleştirelim. İsim olarak preload adını properties paneline ekleyelim.

2- Önce preload nesnemizin ayarlarını yapalım:

source= Bu alana loader componentinin ismi yazılır.Çünkü resmin yükleneceği kaynak alan burasıdır.

mode= Event,polled ve manuel olmak üzere 3 mod vardır. Bara içeriğin yüklenme modunu gösterir.Varsayılan değer event`tır.Şayet barı elle ayarlamak isterseniz manuel modu seçmelisiniz.

labelPlacement= Yükleniyor metninin barın neresinde bulunmasını istiyorsanız bu alandan ayarlayabilirsiniz. Left,right,top,bottom olmak üzere 4 seçenek vardır. Bu seçenekleri kullanmak için labelPlacement yazan alana bir kez tıklayın ve sütunun hemen sağındaki açılır menüden değişikliği uygulayın.

label= Bu alandaki verileri değiştirmeyin. Gördüğünüz %3%% bu değer yüklenen veri ile yüklenecek veri arasındaki oranın güncellenen yüzdesini gösterir.Bu string size garip gözükebilir. Aslında bu stringin gerçek yazılımı %3%2%1şeklindedir.%3 alanı yüklenen veri ile yüklenecek verinin güncel yüzde oranını gösterir. %2 alanı yüklenecek verinin ( yani resim dosyasının ) total miktarını gösterir. %1 alanı ise o an yüklenen güncel byte miktarını gösterir. Şayet bu alana %3%2%1 yazarsanız barda sol tarafta yüklenen güncel yüzde oranını, ortada sabit duran dosya boyutunun byte değerini ve sağda devamlı güncellenen o anlık yüklenen byte miktarını görürsünüz.1,2 ve 3 rakamlarından hangisini yazmaz ve alanı % şeklinde bırakırsanız bunun temsil ettiği değerler çalışmada gözlenmezler.

direction= Varsayılan değer right`tır. Bu şekilde bırakırsanız bar soldan sağa doğru ilerler.isterseniz ters değer olan left seçeneğini kullanabilirsiniz.

conversion= Varsayılan değer 1`dir Bu rakam mevcut ve yüklenecek byte oranını ayarlayan bir dönüşüm değeridir.Kilobyte üzerinden byte değerini 1024 olarak da düzenleyebilirsiniz. Bunun için alana 1024 yazmanız yeterli olur.

3- Şimdi loader nesne ayarlarına geçelim:

Bu kodların detaylarını kendi bölümünde anlatacağız.Kısaca:

autoLoad= Bu alana true yazarsanız yükleme otomatik olarak sağlanır. False değerlerde ise yükleme için loader.load() komutu ile çağrılmayı bekler.

contentPath= Bu alana yüklenecek resmin veya swf dosyasının tamyolunu yazmalısınız.

scaleContent= Yüklenen dosya loader componenti içine sığacak şekilde ölçeklenir. false değerlerde ise yüklenme gerçek dosya ebadları ile olur.

3- Anasahnede 1.kareye şu komutları atayalım:

preload.setStyle("themeColor", "haloBlue");
preload.color = 0x006699;
listenerObject = new Object();
listenerObject.complete = function(eventObject){
preload._visible=false
}
loader.addEventListener("complete", listenerObject)

İlk 2 dizin stil ayarı içindir. Son komuttaki amacımız resim dosyası tam olarak loader componentine yüklendiğinde bar görüntüsünün sahnede gözükmemesi içindir.

ProgressBar Component Kodları

ProgressBar.setProgress():

Şayet ProgressBar.mode özelliğini "manuel" olarak ayarlarsanız bu kod grubunu kullanabilirsiniz. Barın ilerleme özelliğini ayarlayabilirsiniz.

pBarInstance.setProgress(completed, total); şeklinde kullanılır. Burada completed barın ilerleme miktarını total ise %100 değerini aldığı durumu gösterir. örneğin ana sahnede flash oynatma kafasının hareketi alttaki kodla gösterilir:

pBar.setProgress(_currentFrame, _totalFrames);

ProgressBar.complete :

Yüklenme tamamlandığında oluşturulmuş bir nesneye atanan tüm işlemler veya uygulamalar devreye girer.Örneğin:

listener = new Object();
listener.complete = function(eventObject){
trace("Yükleme tamamlandığında burada oluşturulan işlemler çalışır");
}
pBar_instance_name.addEventListener("complete", listener);

Progressbar modu bu işlem için event olarak ayarlanmış olmalıdır.

Progressbar.progress:

Progressbar modu "manuel" veya "polled" şeklinde ayarlanmışsa kullanılabilen bir kod grubudur. progressbar tetiklendiği anda bir nesneye atanan kodlar devreye girer.

listener=new Object();
listener.progress = function(eventObj){
trace("progressbar tetiklendiğinde burada oluşturulan işlemler çalışır"););
}
pBar_instance_name.addEventListener("progress", listener);

Progressbar.conversion:

Varsayılan değer 1`dir Bu rakam mevcut ve yüklenecek byte oranını ayarlayan bir dönüşüm değeridir.Kilobyte üzerinden byte değerini 1024 olarak da düzenleyebilirsiniz. Bunun için:

pBar.conversion = 1024; yazmanız yeterli olur.

Progressbar.direction:

Varsayılan değer right`tır. Bu şekilde bırakırsanız bar soldan sağa doğru ilerler.isterseniz ters değer olan left seçeneğini kullanabilirsiniz.

pBar.direction = "left";

ProgressBar.indeterminate:

pBar.indeterminate = true; yazdığınızda barda yüklenen veri miktarını gösteren solid yapı yerine sarmal görünümlü hareketli bir bar gözlenir. Yüklenen veri miktarının gösterilmediği durumlar için kullanabilirsiniz.

ProgressBar.label:

Yukarıda anlatılan label alanını okuyunuz.

ProgressBar.labelPlacement:

Yükleniyor metninin barın neresinde bulunmasını istiyorsanız bu alandan ayarlayabilirsiniz. Left,right,top,bottom olmak üzere 4 seçenek vardır.

pBar.labelPlacement = "top";

ProgressBar.maximum:

ProgressBar modunu "manuel" olarak ayarlama kaydı ile barın yükleneceği en büyük değeri verir.

pBar.maximum = _totalframes; bu kodlar en yüksek değeri yüklenen flash uygulamasının total frame sayısına ayarlar.

ProgressBar.minimum:

Yine manuel modunda barın alacağı minimal değeri atar.

pBar.minimum = 0;

ProgressBar.mode:

Event,polled ve manuel olmak üzere 3 mod vardır. Bara içeriğin yüklenme modunu gösterir.Varsayılan değer event`tır.Şayet barı elle ayarlamak isterseniz manuel modu seçmelisiniz. Bir loader componenti ile beraber kullanıldığı durumlarda event moduna geçmek şarttır. Bir film klibi yüklerken getBytesLoaded() ve getBytesTotal() özelliklerini kullanacaksanız polled modu uygun olacaktır.

pBar.mode = "event";

ProgressBar.percentComplete:

Verilerin yüklenme yüzdesini gösterir.

ProgressBar.source:

Verilerin yükleneceği alanın instance name`ini içerir. örneğin bizim yukarıdaki örneğimizde veriler loader isimli componente yüklendiğinden kodumuz:

preload.source = loader; şeklinde yazılır.Progressbar modu event veya polled şeklinde ayarlanmış olmalıdır.

ProgressBar.value:

ProgressBar.minimum ve ProgressBar.maximum arsındaki bir değerdir.varsayılan değer sıfırdır.