Yaklaşık 1 Dakikada Preloader Oluşturmak

1 dakikada preloader nasıl oluşturulur diyorsanız, çok kolay bir yöntemi sizlerle paylaşmak istedim.

www.ajaxload.info/ Burada pek çok preloader örneği mevcut, onlardan beğendiğiniz birisini bilgisayarınıza kaydetmeniz gerekiyor.

İlk olarak www.ajaxload.info/buradan GIF animasyonlu preloader'imizi yaratıyoruz. Binlerce renk ve form olarak preloader animasyonu oluşturmak mümkün.

Yalnız birşeyi gözden uzak tutmamak gerekir: Arkaplan ve yapılacak olan preloader'un renklerinin seçilebilir olması lazım.

Ajaxload.info sitesinden yukarıdaki resimde belirtildiği gibi hazırlıyoruz.

Indicator Type: yazan açılır menüden tercihimizi yapıyoruz. Preloader'umuzun şeklini belirliyoruz. Daha sonra arkaplan rengini ayarlıyoruz. "Generate it!"e basıyoruz ve aşağısında "Download it!" yazan yere basıyoruz. GIF'imizi bu sayede tamamlamış oluyoruz yani, buradan masaüstünde boş bir dosyaya alıyoruz. Daha sonra Flash'ta yapmamız gereken işlemlere başlıyoruz.

Menu başlığında Insert > New Symbol diyoruz gelen pencerenin içine preloader yazıyoruz.

Dışarıda dosya içine aldığımız Ajax-loader'umuzu File > Import > Import Stage diyerek açılan hazırladığımız boş preloader (yani az önce hazırladığımız Insert > New Symbol preloader) içine (stage) import ediyoruz. Preloader resimleri sıralı olarak frame içerisinde yerlerini alacaklardır.

Ana sahneye dönüyoruz kütüphaneden Preloader movie klibini sahneye alıyoruz, bar kısmında preloader ve text'imiz yer almakta.

Sonra text için "Dynamic Text" yapıyoruz ve Instance Name olarak Ttext yazıyoruz. Aşağıdaki resme bakıp yapabilirsiniz.

Daha sonra resim layerımızda 1. frame boş, 2'nci frame'mize dışardan kütüphaneye resim alıp onu 2. framede sahneye koyuyoruz.

Actions layer'ının 1. frame'ine tıklıyoruz aşağıdaki kodları oraya yapıştırıyoruz.

onEnterFrame = function () {
    var preloader = this.getBytesLoaded();
    var total = this.getBytesTotal();
    var yuzde = preloader/total;
    Ttext.text = Math.round(yuzde*100)+"%";
    if (preloader>=total && total>4) {
        this.gotoAndStop(2);
        delete onEnterFrame;
    }
};

Hepsi bu. Kolay gelsin.