Event Handler tanımlama
Yazım tarihi: Ocak 25, 2012 Filed under: ActionScript Leave a comment »Zaman zaman ayrı ayrı fonksiyonlar eventler tanımlarız. Tanımlarken belirli kurallara bağlı kalırız. Örneğin boolean bir değere göre fonksiyon oluşturma number,string,array vs vs uzar gider. Bu gibi durumlarda bunu kısa if-else kısaltmasıyla belki çözüme ulaştırabiliriz.
Örneğin sahnede bir objemiz var ve biz bu objemizi sürekli kontrol etmek istiyoruz ve aynı zamanda ekleyip silmekde istiyoruz. Bu gibi durumlarda bir number ya da boolean değer atayıp yapmak işimizi kısalta bilir. Aşağıdaki olayda soru işaretinden önceki satıra uygunsa soru işaretinden sonraki olayları uygula değilse iki nokta üst üste olan komutları uygula demiş oluyoruz.
var val:Number = 1;
addEventListener(Event.ENTER_FRAME, val == 1 ? (onComplete) : (onEnter));
function onComplete(event:Event):void
{
trace("tamamlandi.");
removeEventListener(Event.ENTER_FRAME, onComplete);
}
function onEnter(event:Event):void
{
trace("gitti");
}
Stringlerde türkçe karakterler
Yazım tarihi: Ocak 24, 2012 Filed under: ActionScript | Tags: as3 türkçe karakter sorunu, String, stringleri büyük küçük harfler, türkçe karakterler Leave a comment »Yaptığımız herhangi bir uygulamada türkçe karakterler sorun olabiliyor bazen bu sorunu çözebilmek için bi fonksiyona atmamız gerekiyor. Bunun içine bir argüman alıyoruz ve stringleri parçalıp yerine yenisini gönderiyoruz..
var cities:String = "Adıyaman,Şanlı Urfa,Siirt,Çankırı";
var upperCase:String = getTurkishUpperCase(cities);
function getTurkishUpperCase(str:String):String
{
str = str.split("i").join("İ");
str = str.split("ı").join("I");
str = str.toUpperCase()
return str;
}
trace(upperCase);
jQuery ile Klavye Hareketi Sağlama
Yazım tarihi: Ocak 16, 2012 Filed under: JavaScript | Tags: jQuery, jquery ile araba oyunu, jquery klavye kontrolü, offset, offset() özelliği 2 Comments »jQuery’nin bu kadar kapsamlı bir kütüphane olduğunu bilmiyordum. Baktıkça daha iyi bir kütüphane olduğunu anlamaya başladım. Yapı olarak çok kuvetli. Şuanda yaptığım uygulama kare hareketini sağlamak oldu. Bunu yaparken dökümana klavye ile sağ sol tuşuyla bastığında hareket etmesini sağlıyorum. Aşağıdaki yapıda yaptığım olay ise code adında bir değişken oluşturuyorum ve bununla x y koordinat bilgilerini ayarlıyorum.Sonuna string birleştirme ile birleştirip sağ sola hareket etmesini sağlıyorum.
offset() değeri
Bir elamanın konumunu yani ekranda sola ve yukarıya olan uzaklığını bulmak için kullanılır.
Not: Her tarayıcının kendine göre margin padding değerleri olduğu için ilk olarak css ‘de margin ve padding değerlerini sıfırlamak gerekiyor. Daha sonra bu kodları denerseniz offset() da daha iyi performans sağlarsınız.
$(function(){
var xPos = $('#kare').offset().left;
var yPos = $('#kare').offset().top;
$(document).keydown(function(event)
{
var code = (event.which) ? event.which : event.keyCode;
if(code == 37)
{
xPos-=5;
$("#kare").css("left", xPos+"px");
}
if(code == 38)
{
yPos-=5;
$("#kare").css("top", yPos+"px");
}
if(code == 39)
{
xPos+=5;
$("#kare").css("left", xPos+"px");
}
if(code == 40)
{
yPos+=5;
$("#kare").css("top", yPos+"px");
}
});
})
JQuery ile Html Sayfası Yükleme
Yazım tarihi: Ocak 16, 2012 Filed under: JavaScript | Tags: harici sayfa yükleme jquery, jquery html yükleme, jquery load, sayfa yükleme Leave a comment »Yaptığımız projelerde dinamik olarak html sayfası yüklemek isteyebiliriz. Jquery ile bunu kısa yolla load metodyla çözebiliyoruz diğer programlama dillerindeki load metodu gibi. Sadece sayfa yüklenirken kullanıcıyı fazla bekletmemek adına preloader dediğimiz olayı ekleyebiliriz. Bunun için .gif formatında bir preloader animasyonunu bulmanız gerekiyor. Ardından html dökümanın içerisine bir adet buton koyuyoruz ve clickediğimizi algılayabilmesi için bir id atıyoruz. Ben “btn” olarak verdim. Daha sonra preloaderımızı yükleyeceğimiz div imize bir id atıyoruz bunun adına da “bilgi” verdim. Daha sonrasında head tagının içerisine aşağıdaki jquery kodlarını giriyorum.
$(function(){
$("#btn").click(showProgress);
})
function showProgress()
{
$("#bilgi").empty().html('burada img src ile belirtiyoruz.').delay(1000);
$("#bilgi").load("ornek.html");
}
Javascript ile CreateElement’lere Değer Atamak
Yazım tarihi: Ocak 15, 2012 Filed under: JavaScript Leave a comment »Bazı durumlarda dinamik olarak javascript kodu üretmek gerekir. Bunun için yapılması en mantıklı olay createElement öğesidir. Bununla birlikte yeni bir “tag” oluşturulur ve arından içerisi doldurulur. İlk olarak benim yaptığım olay bir div oluşturmak ardından dive karakteristik özelliklerini atamak (kalınlık,font büyüklüğü vs.) Html Head tagının script kısmına yazılacak kodlar.
var container;
var ornek_div;
function init()
{
container = document.createElement('div');
document.body.appendChild(container);
container.style.fontWeight = "bold";
container.style.paddingLeft = "20px";
container.style.paddingTop = "10px";
container.style.position = "absolute";
container.style.color = "#ffffff";
container.innerHTML = "Deneme Yazısı."
container.setAttribute("id","ornek_div");
//container.setAttribute("style","width:50px; height:50px; background:#000;");
ornek_div = document.getElementById("ornek_div");
ornek_div.style.backgroundColor = "#000000";
ornek_div.style.width = "200px";
ornek_div.style.height = "200px";
}
Jquery ile Xml Bağlantısı
Yazım tarihi: Ocak 13, 2012 Filed under: JavaScript | Tags: baglanti, data, javascript xml baglantisi, jquery dersleri, jquery ile javascript baglanma, jquery xml, php, xml, xml baglanma, xml baglantisi, xml query baglanma örnek, xmldata Leave a comment »Xml dökümanları her programlama dili için bir nimettir. Veritabanı yerine kullanabileceğimiz bu yapıyı Flash ve Jquery gibi projelerimizde kullanabilmekteyiz. Bunun için Ajax yapısını kullanmamız gerekiyor. Tam örneğini görebilmek için http://labs.curyy.com/query_xml/ adresini ziyaret edebilirsiniz. Xml yapısını alabilmek için herhangi bir browser’ın f12 özelliğini kullanabilirsiniz. Şuanda verdiğimde güvenlik nedeniyle algılamıyor.
Jquery kodlarımız şu şekilde olacak kodların içerisinde gerekli açıklamaları yapmaya çalıştım;
Not: Kodları kullanabilmek için herhangi bir sunucuya atmanız gerekmektedir.
OOP MovieClip(parent)
Yazım tarihi: Ocak 13, 2012 Filed under: ActionScript Leave a comment »OPP projelerimizde Library‘den Linkage yoluyla çağırdığımız objelerin üstüne yani Main classımızdaki herhangi bir fonksiyon ya da değişkene ulaşmak istediğimizde yapmamız gereken yol Parent seçicisi olacaktır. Örneğin;
Main.fla ‘nın içinde Libraryde bulunan Linkage edilmiş bir MovieClibimiz olsun. Linkage ettiğimiz MovieClibimizin Class adı Kare.as olsun. Daha sonrasında ise Main.fla ‘ımızın Document Class yapısı ise Main.as olsun bizim ulaşmamız gereken değer Main.as dir. Şimdi yapımız şu şekilde olacaktır.
Main.as
package
{
import flash.display.MovieClip;
public class Main extends MovieClip
{
public function deneme ():void
{
trace ("DENEME PARENT İLE OLUŞTURULMUŞ FONKSİYON");
}
}
}
Kare.as
package
{
import flash.display.MovieClip;
public class Kare extends DisplayState
{
public function Kare ():void
{
// Document Classımızdaki deneme() isimli fonksiyonumuza ulaşmış olduk.
MovieClip(parent).deneme();
}
}
}
Javascript ile Haber Akışını Sağlamak
Yazım tarihi: Ocak 5, 2012 Filed under: JavaScript | Tags: bottom, haber akışı jquery, html5, javascript, jQuery Leave a comment »Açıklamaları yakında ekleyeceğim sadece paylaşım açısından bir çalışma olsun istiyorum.
bottom.js oluşturulur.
/**
$(CBI)* ...
$(CBI)* @author Serhat Sezer
$(CBI)*/
(function() {
//alert("sayfaya girdi ");
var isLoad = false;
$(window).scroll(function(){
if((($(window).scrollTop()+(window).height())+250) >= $(document).height())
{
//alert('sayfa büyük.');
if(isLoad == false)
{
isLoad = true;
$("#loadingBarDiv").css("display","block");
$.get("ServerSide.php?start=" + $("#loadedMaxDiv").val(), function(e){
$("body").append(e);
$("#loadedMaxDiv").val( parseInt($("#loadMaxDiv").val())+50 );
$("loadingBarDiv").css("display","none");
isLoad = false;
});
}
}
});
})();
main.html oluşturulur.
Head tagının içerisine bir -Script- bir de -Style- alanları oluşturulur.
Body kısmına iki adet div oluşturulu bunlardan -loadMaxDiv- olanına baya bir içerik girilir. Ya da Yukarıdaki gibi ServerSide bir dilden içerik çekebilir.
Head Kısmı -Script-
jQuery(document).ready(function(){
jQuery("#loadMaxDiv").val(50);
});
Head Kısmı – Style-
#loadingBarDiv { width: 100%; height: 20px; display:block; float:left; background: black; }
Actionscript 3 ile RSS Reader
Yazım tarihi: Ocak 5, 2012 Filed under: ActionScript | Tags: actionscript, as3 data yükleyici, data, data xml yükleyici, rss yükleyici Leave a comment »Projenin durumuna göre Facebook,Twitter,Foursquare gibi Apiler kullanabiliyoruz. Benimde aklıma geldi bir RSS Reader oluşturmak istedim. Mantık çok basit. İlk olarak Component panelinden bir List öğesi seçiyoruz. Sonra sahneye sürükleyip bırakıyoruz. Componentten eklediğimiz objeye instance name olarak “list” adını veriyoruz. daha sonrasında ise rss adresimizi bilmemiz gerekiyor bunun için ben kendi blog sitemin rss adresini kullandım. Mantık olarak oluşturacağımız öğeler xml ile aynı. Zaten RSS dosyasını XML dosyası gibi düşünebilirsiniz. Yapmamız gereken işlemler şu şekilde olmalıdır adım adım anlatacak olursak:
URLLoader Oluşturulur.(RSS readerımızı okumamız için)
URLRequest Oluşturulur. (Adres bilgilerini belirleyebileceğimiz bir alan. Yani RSS Adresi istek göndereceğimiz alan)
XML Oluşturulur.(Gelen Dataları yükleyeceğimiz bölüm)
package { import flash.display.MovieClip; import flash.events.Event; import flash.net.URLLoader; import flash.net.URLRequest; import flash.net.navigateToURL; import fl.controls.TextArea; import fl.controls.List;/** * @author Serhat Sezer */ public class RssReader extends MovieClip { private var rssLoader:URLLoader; private var rssReq:URLRequest; private var rssXML:XML; private var contentList:XMLList; public function RssReader() { rssXML = new XML (); rssXML.ignoreWhitespace = true; rssLoader = new URLLoader (); rssReq = new URLRequest ("http://serhatsezer.wordpress.com/feed/"); rssLoader.load (rssReq); rssLoader.addEventListener (Event.COMPLETE, onRssComplete); } private function onRssComplete(event:Event):void { rssXML = new XML (event.target.data); for (var item:String in rssXML.channel.item) { list.addItem ( { label: rssXML.channel.item[item].pubDate.substr (0, 20) + " " +rssXML.channel.item[item].title } ); list.addEventListener (Event.CHANGE,onChangeList); } } private function onChangeList(event:Event):void { var headTitle:String = event.currentTarget.selectedItem.label.substr (20); txtHeadTitle.text = headTitle; contentList = rssXML.channel.item[event.target.selectedIndex].children (); for (var i:int = 0; i < contentList.length(); i++) { if (contentList[i].name () == "description") { i++; break; } var item:XML = contentList[i].children ()[0]; navigateToURL(new URLRequest(item.toString ())); } } } } Sadece belirli alanları anlatmayı uygun görüyorum.for (var item:String in rssXML.channel.item) { list.addItem ( { label: rssXML.channel.item[item].pubDate.substr (0, 20) + " " +rssXML.channel.item[item].title } ); list.addEventListener (Event.CHANGE,onChangeList); }
Bu alanda eklediğimiz list compoentnine rss den aldığımız değeri basıyoruz. İkinci kısımda ise bir listener atıyoruz ve bu listenera gerekli bir kaç işlem yapacağız. Bunlar selectedIndex gibi işlemler yapıyoruz.
ActionScript ile 3d
Yazım tarihi: Ocak 2, 2012 Filed under: Genel | Tags: 3d, actionscript, as3 3d import, flash ile 3d Leave a comment »Actionscript ile 3d programlama oldukça geniş. Eğer siz oyun yapmak istiyorsanız ya da herhangi bir 3d çalışmasında bulunmak istiyorsanız o kadar çok kaynak var ki elinizde. Bunlardan sıralayabileceğim ;
Fizik Motoru :
Box2D (En sağlam fizik motorudur. İçerisinde bir çok class barındırır kod yazmadan da bu 2d motorunu kullanabilirsiniz komponentler sayesinde.)
3D Motorları :
En güçlüsü kuşkusuz ki Alternativa3D Adobe resmi olarak destek vermektedir.
Bir ikincisi bu da kullanımı yaygın ve internette bi çok örneğini bulabileceğiniz Away3D
Eski bir 3d motoru ama bir okadarda işlevli örneği bol Papervision3D
* 3D olarak paylaşabileceğim ve aralarında en sağlam ve belirgin aynı zamanda en yaygın olanları bunlar. Bunların dışındakilere pek bakmamızı öneririm. Tabii sizin bileceğiniz bir şey.
Oyun Motorları :
İşte bu olan çok geniş o yüzden size şu linki veriyorum bir incelemekte fayda var.
http://www.adobe.com/devnet/games.html ayrıca bunlara da bir göz atmak lazım
http://www.flashrealtime.com/flash-game-library-engine-list/#2D
Bunların en belirligini flixel ve FlashPunk bunun yanında Starling çıktı o da adobe’un desteklediği bir oyun motoru.
Ayrıca bahsetmek isterim ki Adobe son zamanlarda duyurduğu stage3D ile iyi örnekler yapabilirsiniz. Bunun yanında bir de matrix3D var yani adobe flash platfromu geniş bir platform ve yapacaklarınızın sınırı yok. Bunu Fwa daki sitelere bakarakta anlayabilirsiniz.
Matrix3D tanıtmak amacıyla bir örnek.
*Aşağıdaki örnekte bir şekil çizilir. Daha sonrasında açıyı sürekli olarak değiştirebilmek için enterframe evente bağlanır (Event.ENTER_FRAME) daha sonrasında açıyı bulabilmek için geometri sınıfı olan flash.geom sınıfı kullanılır ve Matrix3D ile açı hesabı yapılır.
var shape : Shape = new Shape();
shape.graphics.beginFill(0xFF0000);
shape.graphics.drawRect(300,150,50,50);
shape.graphics.endFill();
shape.z = 0;
addChild(shape);
addEventListener(Event.ENTER_FRAME,loop);
function loop(event:Event):void
{
shape.z = 1;
shape.transform.matrix3D.appendTranslation(0,0,0);
shape.transform.matrix3D.appendRotation(1,Vector3D.Y_AXIS);
}
Eğer açıyı X açısından ve ya Z açısından almak istersek.
Vector3D.X_AXIS
Vector3D.Z_AXIS
demek yeterli olacaktır.
