Flash CS3 kullanarak AIR uygulamaları geliştirmek
25 Ekim 2007 – 01:45Bundan birkaç ay öncesine kadar Flash ile AIR uygulamaları geliştirmek mümkün değildi. Flex kullanarak AIR uygulamaları geliştirebilirdiniz, ama haliyle öncelikle Flex öğrenmeniz gerekirdi.Flex programlama yönünden iyi bir program ama tasarım yönünden Flash la kıyaslanırsa çok eksiği var.
Tabii bunun da bir çözümü var, Adobe Flash CS3 için AIR eklentisini yayınladı, bu eklenti ile AIR uygulamalarını Flash içerisinde rahatça yapabilirisiniz.Tabii unutmamak gerekir AIR Player’ında bilgisayarınızda yüklü olması gerekir.
Şu anda şu adresten
http://labs.adobe.com/wiki/index.php/AIR:Flash_CS3_Professional_Update
AIR Player ise aşağıdaki adresten indirebilirsiniz
http://labs.adobe.com/wiki/index.php/AIR#Downloads
Öncelikle AIR player ve Flash Cs3 için AIR eklentisini sorunsuz bir şekilde indirip kurduğunuzu ve tabii ki eklentiyi kurarken Flash’ı kapalı olduğunu varsayıyorum.
Flash’ı tekrar açtığınızda karşınıza çıkan “Hoşgeldiniz Ekranı(Welcome Screen)”ndan üçüncü sırada “Flash File(Adobe AIR)” seçeneğinizi göreceksiniz.Eğer karşınıza hoş geldin ekranı çıkmadıysa Edit >Prereference (Ctrl+U) tıklayarak Category bölümünden “General” seçerek sağ taraftaki “On lunch” kısmından “Welcome Screen” seçerek hoş geldiniz ekranına ulaşabilirsiniz veya yeni bir AS3 dokümanı oluşturup “Settings” bölümünden “Flash Player” versiyonunu Adobe Air 1,0 yapabilirisiniz.
Bunu anlatmamın sebebi AIR hala beta sürümü olduğu için “File > New” sekmesinden AIR uygulaması seçemememiz.
Şimdi yeni bir AIR uygulaması oluşturarak, test edelim.Uygulamamızda bir daire ekran da çember etrafında dönecek.Altındaki “Slider” dan ise frame rate i değiştirebileceğiz.Buradaki amaç AS3 te projeyi bitirdikten sonra frame hızını nasıl değiştiğini görmek.Öncelikle aşağıdaki kodu kopyalayıp ilk frame yapıştırın.
-
//import edilen sınıfların kullandığımız özelliklere ait sınıflar.
-
import fl.controls.Slider;
-
import fl.events.SliderEvent;
-
import fl.controls.Label;
-
stage.frameRate = 30;
-
/*———< LABEL >———–*/
-
//Yeni bir label oluşturuyoruz
-
var frameLabel:Label = new Label();
-
//Label ait genişliği ayarlıyoruz
-
frameLabel.width =200;
-
//X pozisyonunu belirliyoruz
-
frameLabel.x = 75;
-
//Y pozisyonunu belirliyoruz
-
frameLabel.y =375;
-
//Label Şu anki frame hızını yazdırıyoruz
-
frameLabel.text= "Şu anki frame hızı 30"
-
;
-
//AS 2 de objeleri sahnede görüntülemek için yada öndemi arakdamı duracagını ayarlamak için
-
//depth özelligini kullanılırdır.ör(this.getNextHighestDepth).AS3 te ise ekran da bir objeyi
-
//görüntülemek için addChild özelliğini kullanıyoruz.
-
addChild(frameLabel);
-
/*———< LABEL / >———–*/
-
/*———< SLIDER >———–*/
-
var frameSlider:Slider = new Slider();
-
frameSlider.width =400;
-
frameSlider.x = 75;
-
frameSlider.y =355;
-
frameSlider.maximum = 500;
-
addChild(frameSlider);
-
/*———< SLIDER / >———–*/
-
//Slider da yapılan herhangi bir değişikliği dinlemesi için
-
//eventListener Metodunu kullanıyoruz
-
frameSlider.addEventListener(SliderEvent.CHANGE, changeHandler);
-
//Slider da yapılan değişiklik algılandıgında çalışacak olan fonksiyon
-
function changeHandler(event:SliderEvent):void {
-
//hız değişkenini numara olarak tanımlayıp
-
//slider kaydırıldıgında
-
var hiz:Number = event.value;
-
stage.frameRate = hiz;
-
var degiskeninYeniDegeri:String = new String(hiz);
-
frameLabel.text= "Şu anki frame hızı "+degiskeninYeniDegeri;
-
}
-
//Derece tanımlanıyor daha sonra derece her seferinde 5 eklenecek
-
//Bir nevi kat ettigi yolun üzerine 5 ekleyerek devam edecek
-
var derece:Number = 0;
-
// çemberin radyanı
-
var radyan:Number = 120;
-
//cemberin etrafında dönecek olan uydunun radyanı
-
var uyduRadyani:Number =10;
-
//Bir sprite oluşturup buna cember adını verıyoruz
-
var cember:Sprite = new Sprite();
-
//Cember bulunacagı yerı belirliyoruz.
-
//Sahnenin ortası
-
cember.x = stage.stageWidth / 2;
-
cember.y = stage.stageHeight / 2;
-
addChild(cember);
-
//Bir shape oluşturup adına grafik diyoruz
-
var uydu:Shape = new Shape();
-
cember.addChild(uydu);
-
//Enter frame için olay dinleyicisi ekliyoruz
-
//Yani bu frame calısıtrıldıgında ıtıbaren fonksıyonumuz devreye girecek
-
addEventListener(Event.ENTER_FRAME, herFrameDevamEt);
-
function herFrameDevamEt(event:Event):void {
-
//dereceye 5 ekliyoruz Bu sekilde uydunun her seferinde
-
// ne kadar ilerliyeceğini hesaplıyoruz.
-
derece +=5;
-
//yeni bir değişken tanımlıyoruz ve değerini fonksiyona eşit tutuyoruz.
-
var radyanlar:Number = radyaniHesapla(derece);
-
//uydunun x ve y koorninatı hesaplanıyor
-
var posX:Number = Math.sin(radyanlar) * radyan;
-
var posY:Number = Math.cos(radyanlar) * radyan;
-
//uydu olarak cızılen bır oncekı gorontu temizleniyor
-
//Aslında burda yapılan her seferinde eski çemberi silerek yeni bir cember yaratıp
-
//eski bulundugu noktadan 5 derece uzaklastırmak.
-
//Böylece daireyi dönmüş olacak
-
uydu.graphics.clear();
-
//uydunun rengini veriyoruz
-
uydu.graphics.beginFill(0×000000);
-
//uydununn pozisyonunu ve radyanını verıyoruz
-
uydu.graphics.drawCircle(posX, posY, uyduRadyani);
-
}function radyaniHesapla(dereceler:Number):Number {
-
return dereceler * Math.PI / 180;
-
}
Daha sonra Components penceresinden User Interface bölümünün altından “Slider” ve “Label” componentlerini kütüphanenize kopyalayın yada componentlerini sahnenin üzerine sürükleyip bırakın ve daha sonra bunları sahneden silin.Sahneden sildiğiniz halde kütüphanenizde otomatik olarak yer alacaktır.
Daha sonra üst taraftaki Command butonuna tıklarsanız Command paneline AIR- başlıklı iki yeni butonun eklendiğini göreceksiniz.Bunların ilki AIR-Application and Installer Settings bu butonda export etmek istediğiniz AIR dosyasının ayarlarını yapıyorsunuz.İkinci de ise “AIR-Create AIR File“ eğer herhangi bir ayar yapmıyorsanız ikinciye basıp hemen export edebilirsinizSırada ise çalışmanın ayarları var. Command butonuna basıp oradan da “AIR-Application and Installer Settings” butonuna basınız.
En üstten alta doğru gidersek
File Name - Çalışmanıza vermek istediğiniz ad- Bu ad AIR dosyanızın adı ve yüklemeden sonra masa üzerinde dosyanın alacağı ad, tabii her masaüstü programı gibi buda değişebilir.
Name - Buraya yazacağınız isim bir nevi tanım, yani buradaki dosyanızın gerçek ismi diyebiliriz.Programı yüklerken açılacak klasörler bu isim adı altında açılıp toplanacak.
ID – Dosya verdiğiniz tekil ID. Bu ID yardımıyla daha önce buna benzer bir dosya olup olmadığını kontrol ediyor. İstediğiniz takdirde bu default olarak yaratılan ID yi değiştirebilirisiniz. Dikkat etmeniz gerek nokta ise sadece latin karakterler, sayı, nokta ve kısa çizgi kullanabilirsiniz.
Version – Dosyanın versiyonu. Bu tamamen size kalmış. Ama 1.0.0.0 dan dan başlamak güzel bir şey olsa gerek.
Description – Burası program hakkındaki açıklamalar için.
Copyrigth –Telif hakkı bilgisi.
Window Style – Burada programınızın hangi pencerede açılmak istediğini belirliyorsunuz.
3 Seçeneğiniz var
1-System – Normal Windows penceresi
2- Custom Chromo (opaque)- Burada programınız bir pencere içinde değil de kendi boyutlarıyla, penceresiz geliyor.
3- Custom Chromo (Transparent)-Bunu seveceğinizden eminim. Bunda ise flash ekranında yaptığınız her şeyi arka plan olmadan görebiliyorsunuz. yani zemin yok. Çok büyük avantajlar sağlayacağından eminim. Mesela çalışmanız Fanus resmi olan bir png eklediniz ve bu png dosyası ana sahneye koyup bütün işlemleri bu fanusun üzerinde yapıyorsunuz. Klasik olarak bu çalışmanın etrafını doldurmanız gerekiyor eğer exe olarak kullanacaksanız. Ama isterseniz çalışmayı yaptıktan sonra 3 seçeneği seçerek masaüstünde çalışmanızı penceresiz yapabilirsiniz.
(Not: Bu çalışma için 3. seçeneğin seçilmesi gerekiyor)
Icon- çalışmanız için seçebileceğiniz ikonlar.
Use custom application descriptor file –Yaptığınız ayarlar bir xml dosyasına kaydediliyor.Eğer daha önceden yaptığınız ayarları kullanmak istiyorsanız bu şıkkı işaretleyip xml adresini belirtebilirisiniz. Bu sayede ayarları tekrar tekrar yapmış zorunda kalmazsınız.
Destination folder – Çalışmanızı kaydetmek istediğiniz hedef dosyayı buradan belirtebilirisiniz.
Dijital Signature – Tüm Adobe AIR uygulamaları başka bilgisayarlara yüklenmesi için dijital olarak imzalanması gerekmektedir.Yeni bir Dijital İmza yapmak için Change > Create butonlarına basınız. Karşınıza gelen penceredeki tüm seçenekleri doldurunuz(Publisher name, Organizational unit, Organizational name, Email, Country, Password, and Confirm Password.)Type kısmında ise 1024 –RSA ve 2048 – RSA diye iki seçenek var.Bu seçenekler güvenlik seçenekleri. 1024 –RSA 1024 bit-key kullanıyor 2048 RSA ise 2048 bit-key kullanıyor, 2048 daha güvenli yani.
Daha sonra Dijital imzanızı herhangi bir dosyaya kaydedin.Bir önceki pencereden Browse tuşuna basarak sertifikayı kayıt ettiğiniz dosyayı açın “mycert.pfx” adlı dosyayı seçin.
Alt kısmındaki Password bölümü sertifikaya girdiğiniz şifreyi giriniz.ve Ok tuşuna basın.
Eğer sertfikayı daha sonra yüklemek isteyorsanız “Prepare an AIR Intermediare (AIRI) file that will be signed later” seçeneğini işaretleyebilirsiniz.
Ama her halükarda bir sertifika yüklemek zorundasınız.
Dijital imza hakkında daha fazli bilgi almak için;
http://tr.wikipedia.org/wiki/Say%C4%B1sal_imza
Program menu folder – Programınız içinde bulunduğu dosya adı.Yani Başlat>Programlar da gözükecek dosya adı.Program ise bu dosyanın altında olacaktır.
Destination – AIR uygulamanızın yer alacağı klasör.Default olarak fla dosyasının bulunduğu klasörün içerisinde yer alıyor.Değiştirmek size kalmış.
Included Files/Folders–Burada çalışmaya dahil edilen dosyaların listesi yer almakta. Mesela bir uygulamada xml kullandınız, kullandığınız xml i dâhil etmeniz gerekiyor.
Default olarak ana swf ve application descriptor xml dosyası ve eğer icon eklemişseniz ikonları AIR paketinin içine dâhil ediyor, harici dosyaları sizin dahil etmeniz gerekiyor.
Şu anda tek yapmanız gereken “Publish AIR File” butonuna basarak çalışmanızı export etmek.
Şu andan itibaren Flash CS3 te yapacağınız herhangi bir uygulamayı masaüstü programı olarak çalıştırabilirsiniz.
Kolay Gelsin
Engin!
