Background pattern yapısı ile repeat özelliği

Bununla ilgili bir kaç class yazılmıştı fakat şimdi daha pratik ve daha kolay bir yol ile yapılabiliyor. Bunu yapabilmek için ilk olarak sahnede bir adet tekrarlanabilir bir görsel olması gerekiyor ardından bu görsel sprite,movieclip,shape gibi displayobjectler ile beginBitmapFill ile tekrardan çiziliyor.

init();

function init():void
{
stage.scaleMode = StageScaleMode.NO_SCALE;
stage.align = StageAlign.TOP_LEFT;

var bg:Shape = new Shape();
bg.graphics.beginBitmapFill(new PatternBgMain(),null,true,true);
bg.graphics.drawRect(0,0,Capabilities.screenResolutionX, Capabilities.screenResolutionY );
bg.graphics.endFill();
addChild(bg);

var footer:Shape = new Shape();
mc.graphics.beginBitmapFill(new footerBgMain(),null,true,true);
mc.graphics.drawRect(0,stage.stageHeight-80,Capabilities.screenResolutionY,80);
mc.graphics.endFill();
addChild(footer);
}

Ayrıca Capabilities sınıfı bizim bilgisayarımızın ekran genişlik yükselik gibi değerleri almamıza yarıyor. Daha bir çok işleme yaramaktadır. Mp3 destekliyor mu hangi grafik kartını kullanıyor gibi bilgileri verebilmektedir.
Bu sınıfı kullanabilmek için Ctrl + Space tuşuna basmanız gerekecektir.

Tweenler ile Objeleri İtelim

Araştırmalarım sonucunda buldum aslında hiç aklıma gelmezdi bu kadar basit bir yapısı olacağından. Bu olayda TweenLite yardımımıza koşacak. Bir değişken oluşturacağız bu değişken objenin height değerini saklayacak ve biz bu değeri çarparak yukarı aşağıya ittireceğiz.

import flash.events.MouseEvent;
import com.greensock.TweenLite;

mc.addEventListener(MouseEvent.ROLL_OVER,onOver);
mc.addEventListener(MouseEvent.ROLL_OUT,onOut);

function onOver(event:MouseEvent):void
{
	TweenLite.to(mc,.4,{ height: 61, onUpdate: overPushItem });
}

function onOut(event:MouseEvent):void
{
	TweenLite.to(mc,.5,{  height: 20 , onUpdate: outPushItem});
}

function overPushItem()
{
	var k:Number = 0;
	k = k + (container.height * .5);
	TweenLite.to(container,.4,{ y: k });
}

function outPushItem()
{
	var p:Number = 0;
	p = p + (container.height * .3);
	TweenLite.to(container,.3,{ y: p});
}

String veri türünü Array dizisine çevirmek

Geçenlerde araştırma yaparken FlashTr.com sitesinde böyle bir yazı buldum. Bende bi kaç değişiklik ile kendime göre birşey yaptım. Burada string olarak yazdığım veriyi Array’a çevirdim. Daha sonra çevirdiğim Array yapısını bir fora sokarak hepsini movieclip içerisine ekledim. MovieClip yapısını dinamik olarak çoğalttım ve tween vererek animasyonunu sağladım.

var str:String = "serhat sezer developer and interaction designer";
var arr:Array = str.split(" ");

for(var i:int=0; i<arr.length; i++)
{
var textmc:TextMc = new TextMc();
textmc.txt.text = arr[i];
textmc.alpha = 0;
textmc.x = (i % 2) * (textmc.width);
textmc.y = int(i / 2) * (textmc.height);
addChild(textmc);

TweenLite.to(textmc,.7,{ alpha: 1, delay: i*.3 });
}

Şeklinde bir kullanımı var. İsterseniz movieClipi küme küme sıralamak yerine normalde sıralayabilirsiniz.

textmc.x = i * (textmc.width) // yan yana dizecektir.
textmc.y = i * (textmc.height) // alt alta dizecektir.

Fonksiyonlarda değişik türden parametreler girmek

Başlık biraz uzun oldu fakat bu fonksiyon işlemi bize bir çok işi bir arada yapmamızı sağlayacaktır. Örneğin bir veri alış-veriş işleminde bu fonksiyon kullanımı işimizi oldukça iyi bir şekilde görecektir. Ayrıca bu fonksiyonun içerisinde istediğiniz türden veri girebilirsiniz. Ben kısaca , object, array, boolean,number,string gibi metodları kullandım. Burada fonksiyon içerisinde şu şekilde de yapabilirdik.

function topluislem(a:String, b:Number,c:Boolean) şeklinde bir kullanımda yapabilirdik. Fakat bu kullanımda fonksiyonu string, number ve boolean girmeye zorlardık.

function topluislem(...$objeler)
{
	// objelere ulaşmak
	var kisiBilgileri:Object = $objeler[0].isim + " " + $objeler[0].soyisim + " " + $objeler[0].yas;
	trace(kisiBilgileri, kisiBilgileri is Object );

	// array yapısına ulaşmak
	var fiyatlar:Array = $objeler[1];
	trace(fiyatlar, fiyatlar is Array );

	// boolean değerlere ulaşmak
	var aktifUye:Boolean = $objeler[2];
	trace(aktifUye,aktifUye is Boolean );

	// string değerlere ulaşmak
	var kullaniciAdi:String = $objeler[3];
	trace(kullaniciAdi,kullaniciAdi is String);

	// number değerine ulaşmak
	var kullaniciPuan:Number = $objeler[4];
	trace(kullaniciPuan,kullaniciPuan is Number);

	if (kisiBilgileri is Object && fiyatlar is Array && aktifUye is Boolean && kullaniciAdi is String && kullaniciPuan is Number)
	{
		trace("bütün bilgiler doğru şekilde girilmiştir.");
	}
	else
	{
		trace("bilgilerde eksiklik var.");
	}
}

// bu fonksiyonda, bütün özellikleri kullanabilirsiniz.
// aşağıda kullanılan yapılar:  object, array, boolean, string, number, function
topluislem({isim:"Serhat",soyisim:"Sezer",yas:"18"}, [10,20,30,40,50], true, "serhat",10);

Array Dizisine Object Eklemek

Nerede işe yaracağını bilmiyorum ama buda farklı bir metod. Dizinin içerisine obje ekliyorsunuz ve aynı xml yapısındaki gibi ulaşabiliyorsunuz. İlk olarak bir dizi nesnesi oluşturmak gerekiyor. İster global isterse statik şekilde object nesnesi oluşturuyoruz. Object nesnesini oluşturabilmek için new Object() yada {} şeklinde belirtmemiz gerekiyor. Array için ise new Array ya da [] şeklinde belirtiyoruz.

var carsArr:Array = new Array();

viewCarList();

function viewCarList():void
{
carsArr.push(   {  isim: "Serhat",   soyisim: "Sezer"   }  ,  {  arabaModeli: "Mustang" , yil: "1960"  ,  fiyat: "Paha biçilemez."  }   );
}

Yukarıda array’ın içersine iki adet object oluşturduk bunu yaparken {} (süslü parantezler) kullandık. Objeleri ayırmak içinse , (virgül) operatörünü kullandık. Bu şekilde iki adet object koyduk. Eğer carsArr dizisinin içerisinden bir elemana ulaşmak istersek bunu;

1. Elemanlara ulaşmak

carsArr[0].isim // Serhat çıktısını verdi.
carsArr[0].soyisim // Sezer çıktısını verdi.

2. Elemanlara ulaşmak

carsArr[1].arabaModeli // Mustangçıktısını verdi.
carsArr[1].yil // 1960 çıktısını verdi.
carsArr[1].fiyat // Paha biçilemez. çıktısını verdi.

bu şekilde objectlerin çıktısını alabilirsiniz. Aynı zamanda XML ve for döngüsü ile de bağlayıp daha mantıklı bir programlama yapabilirsiniz. 0,1 değerlerini vermemizin sebebi objeleri virgül operatörü ile bağladığımız için bu şekilde almamız gerekti için 0 ve 1 değerlerini verdik. Eğer birden fazla obje ekliyorsak onlarıda 0,1,2,3 şeklinde id numaralarına ulaşabilirsiniz.

onComplete & delayedCall kullanımı (Tween işlemleri)

Tweenler bizim interaktif projelerde olmassa olmaz frameworklerdir. Hangi interaktif yazılım dilini kullanırsanız kullanın tween ile işlem yapmanız gerekecektir. Bu yüzden tween seçimlerini doğru şekilde kullanmanız performans açısından artı bir yol kazandıracaktır. Ben bu yazıda Greensock TweenLite frameworkünün onComplete yerin delayedCall metodunun kullanımından bahsedeceğim. Tabii ki ikisininde farklı kullanım yerleri ve amaçları var fakat bu yöntem benim çok işime yaradı.

onComplete : Bu parametre bizim tweenimizin bittikten hemen sonra devreye girecek olan metodumuz. Yani biz bir animasyonu sağdan sola hareket ettirdik hareketlerin bittikten sonra bu objemizi easeli bir şekilde alphasını kısmak ve yok etmek istiyoruz bunun için onComplete kullanmamız gerekiyor.

onComplete : Function(); onComplete bir adet fonksiyon kabul etmektedir. İsteğe göre onCompleteParams: [] ile Array şeklinde verileri gönderebiliriz. Unutmamak gerekirki bu sadece parametredir. Yani biz onComplete yapısını kullanabilmek için şu şekilde bir Tween uygulamamız gerekecektir.

TweenLite.to(obje_mc,1,{ x: 200, onComplete: animasyonBitti_f  });
function animasyonBitti_f():void
{
trace(“animasyon bitti”);
}

Bu şekilde animasyonumuzun işlemleri bittikten sonra yapması gereken şeyleri onComplete içinde toplayabiliriz.

delayedCall : Bu metodu javascript ve actionScriptteki setInterval() gibi düşünebilirsiniz. setInterval metodu belirttiğimiz bir süre içerisinde belirlediğimiz bir fonksiyonu çalıştırır. delayedCallın setInterval den farkıda içerisinde obje taşımasıdır. Kullanımı ise şu şekildedir.

TweenLite.delayedCall(1.5, removeAll_f, [mc]);
function removeAll_f(gelenObje:MovieClip):void
{
//işlemler burada gerçekleşiyor 1.5 saniye sonra.
trace(“işlemleri gerçekleştir….”);
}

Buradaki mantık ise 1.5 saniye geçtikten sonra belirlediğimiz metodu çalıştırması ve içerisinde bir obje belirtmesidir. Bir Örnek yapmak gerekirse.

TweenMax.killTweensOf(); Özelliği : Bu özellik bizim hedef nesnemizdeki istediğimiz herhangi bir özelliğin silinmesini sağlıyor. Örneğin sahnede buton_mc adında bir movieclip olduğunu düşünürsek bu buton_mc ye de tweenmax ile animasyon “x” ve “alpha” değerleriyle bir animasyon verdiğimizi düşünelim buradan biz “x” özelliğini silmek istiyoruz. O zaman killTweensOf işimize yarayabilir.

TweenLite.killTweensOf(buton_mc, false, {alpha:false, x:true});

Örnek için gerekli objeler

Sahnede 5 tane kare olsun instance name önemli değil sadece 5 tane movieclip olsun. Daha sonra kod kısmına geçerek şu kodları yazın.

import com.greensock.TweenLite;
import flash.display.MovieClip;
import com.greensock.easing.*;

var mc:MovieClip = new MovieClip();

for(var i:Number=0; i<numChildren; i++)
{
	mc = MovieClip(getChildAt(i));

	TweenLite.from(mc,.8,{ alpha: 0, delay: i*0.05, ease: Expo.easeOut});
	TweenLite.delayedCall(1.5, removeAll_f, [mc]);
}

function removeAll_f($mc):void
{
	TweenLite.to($mc,.5,{ scaleX: 0 , ease: Expo.easeOut});
}

Bu animasyonda ilk olarak TweenLite.from() ile 0 – 1 arası bir alpha sağlanacak. Daha sonr aradan 1.5 saniye geçikten sonra sahnedeki mc ler scaleX ile birbirini delaylı bir şekilde kapanacak.

As3 basit bir paralo sorgulama

Pek nadirde olsa as3 ile admin panelleri yapılmıyor. Yavaştan ben de bir kaç uygulamamda böyle şeyleri denemeyi düşünüyorum. Tek başına As3 ile admin paneli yapmak mümkün değil. Serverside dilleri de kullanmamız gerekiyor. En basitinden Bir login ekranı için aşağıdaki algoritmayı izleyebiliriz.

Admin paralo bilgisini kutucuğa yazar ve buton kanalıyla gerekli fonksiyona tetikletilir. Bu tekiklenen fonksiyonda kısa bir if-else koşulu ile (true,false) değerleri alınır. Yine aynı fonksiyonda kontrol sağlanır. Eğer benim girdiğim kullanıcı adı veritabanı, ya da kodların içerisinde hazırladığım bir değişkende(pek güvenli değil) sorgulanır. Sonuç (tru,false) olarak geri gönderilir. Eğer kullanıcı doğru bir şekilde giriş yapmış ise kullanıcıyı gerekli gere gönderilir.

Sahnemde bir adet buton, bir adet input box , bir adet de 2 framelik bir movieclip bulunur. Bunlar admine login ile ilgili bilgi vermek için hazırlanır. Sırayla;
Butonun adı : btn
Paraloyı saklayacağım alan : login_status
Paraloyı gireceğim alan : pass_txt
Uyarı vereceğim movieclip : loginPanel_mc

kodlar ise şu şekilde olmalıdır.

var login_status:String = "serhat";
var sonuc:Boolean;
loginPanel_mc.stop();
pass_txt.stage.focus = pass_txt;

btn.addEventListener(MouseEvent.CLICK,onLoginStatus);
stage.addEventListener(KeyboardEvent.KEY_DOWN,onKeyDownLoginPanel);

function onLoginStatus(event:MouseEvent):void
{
	sonuc = ((login_status == (pass_txt.text)) ? true : false);

	if (sonuc)
	{
		loginPanel_mc.gotoAndStop(2);
	}
	else
	{
		loginPanel_mc.gotoAndStop(1);
	}
}

function onKeyDownLoginPanel(event:KeyboardEvent):void
{
	if (event.keyCode == Keyboard.ENTER)
	{
		onLoginStatus(null);
	}
}

Yukarıdaki mantık şu şekilde ilerlemektedir. sonuc = ((login_status == (pass_txt.text)) ? true : false) bu alanda ben kullanıcı girdisiyle login_status (paralomı sakladığım değer) leri karşılaştırıyorum. yani login_status == (pass_txt.text) değerlerini birbirlerine karşılaştırıp kısa bir if-else koşulu ile doğru ise true , yanlış ise false değerini geri gönderiyorum. Aynı fonksiyon içerisinde bir if-else koşulu daha sağlayıp burada da eğer sonuçtan bana gelen değer true ise loginPanel_mc de kullanıcıya doğru girdiğine dair bilgi veriyorum eğer başka bir sonuç varsa yanlış girmişse else ile uyarı veriyorum. Daha sonrasında kullanıcının “Enter” klavye kombinasyonunu kullanmasını sağlıyorum. onLoginStatus(null); ile yeniden değerleri kontrol etmesi için gönderiyorum fonksiyon içinde (null) bunu yapmamın nedeni fonksiyonumun bir eventi olmasıydı bu şekilde event den ayırıp normal bir fonksiyonmuş gibi davranmasını sağlıyorum.

as3 ile FTP bağlantısı ve Socket

Aşağıdaki yapıda actionscriptin socket classı kullanılarak ftpnin içerisindeki dizinlere göz atabiliyoruz. Aşağıdaki kod çok açık olduğu için açıklama gereği duymuyorum. writeUTFBytes parametresi içerisine ftpye bağlanabilmek için gerekli bilgileri istiyor bizden. daha sonrasında SOCKET_DATA ile bağlantılarımızı sağlayacak fonksiyonlara gönderiyoruz. IO_ERROR ise bize bağlantıda herhangi bir sorun yaşadığımızda o sorunu bize bildirecek fonksiyon oluyor.
import flash.net.Socket;
import flash.events.ProgressEvent;
import flash.events.IOErrorEvent;

var socketFTP:Socket = new Socket("ftp.siteadi.com",21);
var ftpResponse:String = "";

socketFTP.addEventListener(ProgressEvent.SOCKET_DATA,receiveReply);
socketFTP.addEventListener(IOErrorEvent.IO_ERROR,socketIoError);

socketFTP.writeUTFBytes("kullanıcıadı");  // kullanıcı adı
socketFTP.writeUTFBytes("sifre");  // kullanıcı şifre
socketFTP.writeUTFBytes("CWD /\n");
socketFTP.writeUTFBytes("PWD\n");
socketFTP.writeUTFBytes("PASV\n");
socketFTP.writeUTFBytes("LIST\n");
socketFTP.flush();

function receiveReply(event:ProgressEvent):void
{
ftpResponse = socketFTP.readUTFBytes(socketFTP.bytesAvailable);
trace(ftpResponse);
}

function socketIoError(event:IOErrorEvent):void
{
trace(event.errorID);
}