Paylaşılan Fonksiyon Oluşturma

Bir fonksiyonu birçok classda kullanmak isteyebilirsiniz. Bunun için yapılması gereken tek şey bir public function oluşturmak ve daha sonra bu fonksiyonu diğer classlarda istediğimiz gibi kullanabiliriz. İstersek grafik çizdiririz istersekte resize , complete, proccess gibi işlemleri gerçekleştirebilirsiniz. Bunun için yapılması gerekenler;

package 
{
	public class BgPattern 
	{
		public var drawBg:Function;

		public function BgPattern()
		{
			if (drawBg != null) 
				drawBg();
			else
			        drawBg();
		}
	}
}

Çağırırken şu şekilde çağırıyoruz.

package 
{
	public class Main 
	{		
		public function Main()
		{
			BgPattern.drawBg = newBgFunction;
		}

		private function newBgFunction()
		{
			with (graphics) 
			{
				clear();
				beginFill(0xFFCC00);
				drawRect(0,0,100,100);
				endFill();
			}
		}
	}
}
Advertisements

as3 Mouse Lock (Fare Kilidi)

Flash Player ürün yöneticileri flash player’ın asıl sorunu olan performans ve 32 bit olayını hala çözememişken kelalaka bir eklentiyi duyurdu. Bu eklenti mouse’un sağ – sol – orta tekerlek alanlarını kitlemeye yarıyor. Bu eklentiyi genellikle oyun programlarken kullanılabilir. Fakat ben hala performans olayına feci şekilde kafayı takmış durumdayım. Her neyse MouseLock eklentisi hakkında ;

Fare kilitlemeyi kullanabilmek için bağzı kriterler & kurallar var bunlar;

  • Bu özellik yalnızca tam ekran modunda ayarlanabilir.
  • Bu bir çalışma zamanı istisna gönderir, non-tam ekran modunda denir.
  • Mobil ayarlarını bu özelliği her zaman bir istisna atar. Nedeni basit: Bu özellik yalnızca bir fare typeof cihazları ve mobil cihazlar böyle bir şey yoksa çalıştıramazsınız.
  • Özelliği olmayan tam ekran modunda okunabilir. Bu fare kilitleme, bazı nedenlerden dolayı dışarıdan devre dışı bırakılırsa, geliştiriciler alternatif giriş yöntemlerini kolayca gönderme sağlar.
  • Tam ekran modu Stage.mouseLock çıkarken otomatik olarak false olarak ayarlanır. Diğer görüntüleme nesnelerinin bağlı sahnede gönderilir tam ekran olmadan modunda fare olay dinleyicileri bu süre unutmayın (Listeners).
  • MouseLock sahne için farenizi olay dinleyicileri eklemek gerekir aktif iken, diğer bir deyişle fare deltalar ve başka herhangi bir fare olayı almak için olay dinleyicileri eklemeniz gerekbilir.

Fare koordinantlarına bağlı yeni özellikler; 

Yeni Özellikler MouseEvent (movementX ve movementY)

Stage.mouseLock == true;

  • MouseEvent.localX ve MouseEvent.localY 0.MouseEvent.movementX içerecek ve MouseEvent.movementY delta değerleri içerecektir.
  • MouseEvent.movementX ve MouseEvent.movementY sahne alanı kadar yer alan objeler.
  • MouseEvent.movementX ve MouseEvent.movementY Stage.mouseLock == false 0 olacaktır.

Fare kilitleme otomatik olarak devre dışı bırakılır ve fare imlecini tekrar görünür hale getirmek için gerekli olaylar;

  • Esc basarsa
  • Ctrl + tab basarsa pasif eder. (Oyun oynarken gezindiğimiz olay)

 

as3 Parallax

Etkileşim açısından gerek oyunlanlarda gerek web uygulamalarında çok hoş duran bir efekt. Örnek olarak buradaki uygulama gayet başarılı bir engine. Ben bunu daha kısa yollada halledilebilir diye düşünüyorum. Şöyle ki;

Sahnede 3 adet objemiz var bunlar ; ev , çit, but diye üç ayrı movieclip bu mclerin ayrı ayrı x değerlerini biz kod yazarken vermeliyiz örneğin çit bulutlarla zıt koordinatlı olmalı. Örneğin. Çit x değeri = -100 iken bulut’un x değeri 50 olmalı. Bir kaç matematiksel işlem ile bu parallax efektini verebileceğimizi düşünüyorum.

Bu üç movieclibimizi sol üst köşe olarak ayarladığımızı varsayalım. Daha sonra bu moviecliplerin içerisine girelim ve x,y değerlerini 0,0 yapalım.

Burada kısa bir çarpma işlemi kullanıyoruz. Bu çarpma işlemi basit olarak sıfırları atmak olarak da düşünebilirsiniz. Örneğin;

Stage = 1000px olarak düşünelim.
MaxValue = 100px olarak verdiğimizi düşünürsek. Buradaki MaxValue bizim sahnedeki parallax uygulanacak objemizin maximum x koordinat bilgisini içermektedir.

var cikanX= (Stage / MaxValue) =  10px değerini bize verecektir. Eğer biz bu değeri mouseX koordinatıyla çarparsak. Bizim parallaks efektimiz oluşmuş olacaktır. Şöyle ki ;

var kalanX =  (posX * mouseX);
mouseX = MOUSE_MOVE fonksiyonu her çalıştığında bu değerde değişecektir. Yani 0,1,5,10,30 …. e kadar gidecektir. Sahnemizin genişliğine kadar.
5 * 10 = 50 o zaman bizim ev değerimiz 50 pixel gidecektir.

 package
 {
 import flash.display.Sprite;
 import com.greensock.TweenLite;
 import flash.display.StageAlign;
 import flash.display.StageScaleMode;
 import flash.events.MouseEvent;

public class Main extends Sprite
 {
 <span style="color: #339966;"> /*</span>
 <span style="color: #339966;"> * -max değerleri stage deki objemizin kaç pixel gitmesi gerektiğini belirtiyoruz.</span>
 <span style="color: #339966;"> * ornek; homeMax = 100 dediğimize göre stage den 100 px uzaklaşsın diyoruz.</span>
 <span style="color: #339966;"> * */</span>
 private var homeMax:Number = 80; // ev
 private var fenceMax:Number = -30; // çit
 private var cloudMax:Number = -50; // bulut

public function Main()
 {
 stage.align = StageAlign.TOP_LEFT;
 stage.scaleMode = StageScaleMode.NO_SCALE;
 stage.addEventListener(MouseEvent.MOUSE_MOVE, move);
 }

private function move(event:MouseEvent):void
 {
 <span style="color: #339966;"> /*</span>
 <span style="color: #339966;"> * Buradaki mantık ise stage genişliği ile bizim verdiğimiz,</span>
 <span style="color: #339966;"> * maksimumum değerin çarpımından çıkan sonucun mouse'un x </span>
 <span style="color: #339966;"> * konumuyla çarpılmasıyla oluşuyor. </span>
 <span style="color: #339966;"> * ///=========== Örnek =========== ///</span>
 <span style="color: #339966;"> * stage = 1000 px;</span>
 <span style="color: #339966;"> * homeMax = 100 px;</span>
 <span style="color: #339966;"> * ise, </span>
 <span style="color: #339966;"> * 1000 / 100 = 10 olarak çıkıyor. Daha sonrasında ise</span>
 <span style="color: #339966;"> * mouseX * homeMax diyoruz. mouseX konumu sürekli değişiyor.</span>
 <span style="color: #339966;"> * bu değer 10 da olabilir 100 de bu değeri 10 le çarpmış oluyoruz.</span>
 <span style="color: #339966;"> * 100 varsayarsak; 100 * 0,1 = 10 çıkıyor bu şekilde</span>
 <span style="color: #339966;"> * x değeri 10 px hareket ediyor.</span>
 <span style="color: #339966;"> */</span>
 var num:Number = homeMax / stage.stageWidth;
 addParallax(ev_mc, (mouseX * num));

num = fenceMax / stage.stageWidth;
 addParallax(cit_mc, (mouseX * num));

num = cloudMax / stage.stageWidth;
 addParallax(bulut_mc, (mouseX * num));
 }

private function addParallax($target_mc, $xPos):void
 {
 new TweenLite($target_mc, 0.9, { x: $xPos } );
 }
 }
}

JavaScript Dizi Fonksiyonları

Javascriptte dizilerde işimizi kolaylaştıracak bir çok hazır metod bulunuyor. Bunları aşağıdaki listede açıklamalı bir şekilde yazdım.

length()

Dizi içindeki eleman sayılarının toplamını verir.

var arr = new Array("bir","iki");
document.write(arr.length);   //2

concat()

İki diziyi birbirine bağlar. Aynı zamanda stringlerde de kullanılır.

var arr = new Array("bir","iki");
var arr2 = new Array("üç","dört");
document.write(arr.concat(arr2));   //bir iki üç dört...

join()

Dizi içindeki seçilen herhangi bir elemanın yada tümünün içindeki değerlere özel karakterler atamaya yarar.

var arr = new Array("bir","iki");
document.write(arr.join("_"));  // bir_iki

shift()

Dizinin içindeki ilk elemanı alır. Daha sonra dizideki ilk elemanı siler.

var arr = new Array("bir","iki");
document.write(arr.shift());   // iki

pop()

Bir dizi içindeki son değeri alır. Shift gibi işlem görür son değeri siler.

var arr = new Array("bir","iki");
document.write(arr.pop());   // bir

push()

Tanımlanmış bir dizi değişkenine değer atar.

var arr = new Array("bir","iki");
document.write(arr.push("üç"));   // bir,iki,üç

unshift()

Dizinin başına bir veya daha fazla eleman ekler.

var arr = new Array("bir","iki");
document.write(arr.unshift("sıfır"));   // sıfır,bir,iki

reverse()

Dizi elemanlarının yerlerini değiştirir. Yani a-b-c ise c-b-a yapar.

var arr = new Array("bir","iki");
document.write(arr.reverse());   // iki,bir

sort()

Dizi içindeki elamaları alfabetik şekilde sıralar.

var arr = new Array("bir","iki");
document.write(arr.sort());   // bir,iki

slice()

Dizide belirlediğimiz bir parçayı alır ve yine dizi olarak geri verir.

var arr = new Array("bir","iki","üç","dört");
document.write(arr.slice(0,2));   // bir,üç

splice()

Dizi içeriğini elemanları silerken yeni elemanlar ekler ve değiştirir.

var arr = new Array("bir","iki");
document.write(arr.splice("yeni bir","yeni iki"));   // yeni bir , yeni iki

every()

Dizi elemanlarının belirtilen belli bir niteliğe sahip olup olmadığını kontrol eder.

function isArrControl(val)
{
if(isNaN(val))
{
return true;
}
else
{
return false;
}
} 

var arr = new Array("serhat","sezer","19");
if(arr.every(isArrControl))
{
document.write("Dizi doğru bir şekilde girilmiş.");
}

filter()

Dizi elemanlarını bir fonksiyon aracılığı ile filtreler

function isFilterControl(val)
{
if(isNaN(val))
{
return true;
}
else
{
return false;
}
} 

var arr = new Array("serhat","sezer","19");
var _r = arr.filter(isFilterControl);
document.write(_r.join(","));

forEach()

Dizi elemanlarını belirtilen fonksiyondan geçirir.

function isControl(arr,index)
{
if(isNaN(val))
{
document.write(arr+"-harf<br>");
}
else
{
document.write(arr+"-rakam<br>");
}
} 

var arr = new Array("a","b","c",10);
document.write(arr.forEach(isControl));

indexOf()

Dizi elemanlarının dizi içindeki en son konumunu verir.

var dizi = new Array("a","b","c","d","e","f");
document.write(dizi.indexOf("e")); //4

lastIndexOf()

Dizi elemanın dizi içindeki en son konumunu verir. Eleman dizide yoksa -1 değerini verir.

var dizi = new Array("a","b","c","d","e","f");
document.write(dizi.lastIndexOf("d")); //3

map()

Dizi elemanlarını belirtilen bir fonksiyondan geçirerek dizi halinde geri döndür.

var kareKok = function(deger)
{
return deger * deger;
}
var arr = ["5","10","20","30","40"];
var kok_al = arr.map(kareKok);
document.write(kok_al);

reduce()

Dizi elemanlarını ilk parametre ile birlikte fonkisyondan geçirir.

var topla = function(i,j){
return i+j;
}
var dizi = ["1","2","3"];
var _t = dizi.reduce(topla);
document.write(_t);

some()

Dizi elemanlarının belirtilen şarta uyup-uymadığını kontrol eder. Sonuç true ya da false geri döner.

var sayi1 = 5;
var sayi2 = 10;
sayi1.some(sayi2) ;

toSource()

Dizinin tanımlama şeklini aynen bir string olarak döndürür.

var arr = new Array("A","B","C");
var results = arr.toSource();
document.write(results); // ("A","B","C")

toString()

Dizinin elemanlarını bir string olarak döndürür.

var arr = new Array("A","B","C");
var results = arr.[0].toString();
document.write(results); // A

JavaScript ile Diziler

Diğer tüm programla dillerinde olduğu gibi javascriptte de aynıdır. Belirli bir değeri ( string, number, boolean, array vs..) gibi objeleri saklamamıza olanak sağlar diziler. Dizilerde her birinin indeks numarası vardır ve bu numaralar 0 dan başlar.  Bu diziler ulaşmak için genellikle for döngüsünü koyarak ulaşırız. Array dizilerine ulaşmak için her zaman [] (kümeli parantezler) kullanırız.

Çift indeksli diziyi burada da kullanabiliriz.

var arr = new Array(new Array("bir","iki","üç"),new Array("xx","yy","zz"));
arr.model = ["_xx","_yy","_zz"];
for(var i = 0; i<arr.length; i++)
{
	var dizi1 = arr[0][0];
	document.write(dizi1);
	var dizi2 = arr[1][0]
	document.write("<br>"+dizi2);

	var dizi3 = arr.model[0];
	document.write("<br>"+dizi3)
	break;
}

as3 Point sınıfı ile iki mesafe arasındaki uzaklık

Yapacağımız bu uygulamada iki obje arasındaki mutlak uzaklık değerini bulacağız. Bunu yaparken Actionscript in point sınıfını kullanacağız. İlk olarak iki tane point sınıfı oluşturup daha sonrasında ise sahne bulunan objelerimizin değerlerini oluşturduğumuz Point sınıfına vereceğiz. Point sınıfı iki adet parametre almaktadır. Point(x değeri p1, y değeri p2); şeklinde iki adet parametre almaktadır. Ulaşırken yapacağımız yöntem ise şu şekildedir.

var p1:Point = new Point(10,10);
 var xPos:int = p1.x;
 var yPos:int = p2.y;

şeklinde değerleri alabiliriz. Bunun yanında değerlerini de değiştirebiliriz. Sonuçta x ve y sabitleri statik değişkenler oldukları için sonradan değerlerini değiştirme imkanımız var. Yukarıdaki örnekten devam ediyorum.

p1.x = 20; p2.y = 20;

şeklinde değiştirdik. Bu şekilde sonradan değleriyle oynabiliyoruz. Aynı zamanda sahnede bulunan objelerimizede verebiliyourz. new Point(mc.x,mc.y); şeklinde sahnede bulunan objelerimize de verebiliyoruz.

import flash.geom.Point;

var pt1:Point = new Point(mc1.x,mc1.y);
var pt2:Point = new Point(mc2.x,mc2.y);
var distance:int = Point.distance(pt1,pt2);

trace("-- İki movieclip arasındaki uzaklık " + distance + "px " + "kadar.");

as3 Seamless Background

Yaptığımız oyun projelerinde örneğin bir galaxy oyun projesinde arkaplanda loop eden bir background düşünün. Bu arkaplanın sürekli olarak loop edildiğini ve hiçbir kesinti olmadığını varsayalım. Bunu nasıl yapardık. Benim aklıma gelen ilk şey photoshop ile ilk olarak aynı resmi yanyana koyup aralığını smooth değeri ile azaltmak ve yüksek genişlik değeriyle flasha gömerek loop ettirmek olurdu. Ama o şekilde yaptığımızda da flash playerda kasılmalar meydana gelebilirdi. Bu yüzden şu yönetimi kullanmak daha sağlıklı.

İlk olarak library’mizde bir background görüntüsü olduğunu varsayalım. Sağ tıklayıp Linkage yönetimi ile Export for actionscript yapalım ve ismini Lib_Bg verelim. Daha sonrasında kodları aşağıdaki gibi yazalım.

var canvas:Sprite = new Sprite();
addChild(canvas);

var bg:BitmapData = new Lib_Bg();
var matrix:Matrix = new Matrix();

this.addEventListener(Event.ENTER_FRAME,loop);

function loop(event:Event):void
{
	canvas.graphics.clear();
	matrix.tx -= 3;
	canvas.graphics.beginBitmapFill(bg,matrix,true,true);
	canvas.graphics.drawRect(0,0,800,600);
}

Aşağıda yaptığımız mantıktan kısaca bahsetcek olursak, ilk olarak bir canvas adında Sprite nesnesi oluşturduk ve bu bizim containerımız olmuş oldu. Daha sonrasında bu canvas objemizin graphics sınıfını kullanarak bir tane daha çizmesini istedik. Bunuda graphics.beginBitmapFill() ile yaptık karıştırılmaması gereken bir husus ise graphics.beginFill() değil bitmapFill kullandık yani bitmap tekrarlamasını istedik. Daha sonrasında ise matrix değerini loop etmesi için ikinci değerimize verdik. Matrix’in tx değeri ile sonsuz bir loopa girmesini sağladık.