As3 ball distance

Sahneye circle adında bir oval movieclip çiziyorum. Bunu farenin yatay ve dikey koordinantlarda takip edebilmesi için bir olay dinleyicisi ekliyorum Enter_FRAME bu olay frame rate değeri kadar olayı tetikler ve bizim animasyonumuzu çalıştırmamızı sağlar. Daha sonrasında ise distanceX değeri ile x uzaklığını distanceY değeri ile y uzaklığını yani distanceX ile yatay düzlemdeki uzaklığını distanceY ile dikey uzaklığını alıyoruz. Bir diğer değişkenlerimiz ise frictionX ve frictionY değişkenleri olayımızın sürüklenmesini ve animasyonun gerçekleşmesini sağlıyor.

– distanceX değişkeninin içindeki değeri circle mcnin x koordinantı ve farenin x koordinantından çıkartıyoruz. Çıkan sonuçlar olacaktır farklı farklı…

– frictionX değerinide animasyonu iki yöndede sağlayabilmek için -= diyerek distanceX değerine atıyoruz bu değeride 2 ile bölerek ivmeyi sağlıyoruz.

– friction değerlerini de çarparak ondalıklı sayılara atıyoruz. Her defasında bu sayı artacak.

– circle.x ile artarak frictionX değerini sağlamış ve circle mcye atamış oluyoruz.

var distanceX:Number = 0;
var distanceY:Number = 0;

var frictionX:Number = 0;
var frictionY:Number = 0;

addEventListener(Event.ENTER_FRAME,loop);

function loop(event:Event):void {

distanceX = circle.x – mouseX;
distanceY = circle.y – mouseY;

frictionX -= distanceX / 2;
frictionY -= distanceY / 2;

frictionX *= 0.20;
frictionY *= 0.70;

circle.x += frictionX;
circle.y += frictionY;
}

Advertisements

as3 yön değiştiren ok

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

stage.addEventListener(MouseEvent.MOUSE_MOVE,mMove);

function mMove(event:MouseEvent):void
{
var xPercent:Number = mouseX / (stage.stageWidth / 2);
arrow_mc.rotationY = (xPercent * 45) – 45;

if(mouseX > arrow_mc.x)
{
TweenMax.to(arrow_mc,1,{ scaleX: 1 });
}
else
{
TweenMax.to(arrow_mc,1,{ scaleX: -1 });
}
}

as3 ile Text Alanlarına Scroll Eklemek

// çubuğun uzunluğunu yazının belirleyeceği kısım.
// thumb sürükleyen mc.
// track altta kalan çubuk.

thumb.height = track.height / text_mc.height * thumb.height;

var scrollArea:Rectangle = new Rectangle(track.x+1,track.y,0,track.height – thumb.height);

thumb.addEventListener(MouseEvent.MOUSE_DOWN,onDragged);
thumb.addEventListener(MouseEvent.MOUSE_UP,onStopDrag);
stage.addEventListener(MouseEvent.MOUSE_UP,onStopDrag);
stage.addEventListener(Event.ENTER_FRAME,onLoop);

function onDragged(event:MouseEvent):void
{
thumb.startDrag(false,scrollArea);
}

function onStopDrag(event:MouseEvent):void
{
thumb.stopDrag();
}

function onLoop(event:Event):void
{
text_mc.y = track.y + (thumb.y – track.y) * (text_mc.height – track.height) / (thumb.height – track.height)
}

AS3 HTML ve CSS kullanımı

Flash as3 ile gelişmiş CSS özelliklerini kullabilirsiniz. Bir çok tagı hatta Classları bile kullanabiliyorsunuz. Aşağıda bir döküman hazırladım.

– İlk olarak kullanacağımız HTML Stringini oluşturduk. Aşağıda bunu HtmlText Classı ile çağıracağız.

– Textleri manuel olarak elimizle oluşturacağımız için TextField Classımızı oluşturduk. Oluşturduğumuz Stringleride burda kullandık.

– Bir Obje oluşturduk bununla birlik font özelliği kazandırdık.

– Bir tane CSS kullanabilmek için Stylesheet kullandık ve bunu TextFieldın Stylesheet özelliğine atadık.

– style adlı Stylesheet değişkinimizin setStyle özelliği ile de hangi tagı etkilecek isek onu tırnak işaretleriyle belirledik “ozellik_adi” ve içerisine süslü parantezler ile virgülle değerler girdik. Normal CSS özelliklerini kullanamadığımız için isimler aynı ancak tre(-) yerine carmel sistemini kullanarak ilk harf küçük diğeri büyük şeklinde yaptık.

var txt:String = “<span class=’defaultStyle’><h1><b>HTML</b> Text <i>(sample <u>header</u>)</i></h1>Here is some <em>sample</em> <strong>html text</strong> “+”filling a text box <a href=’http://www.adrianparr.com’>this link to adrianparr.com</a> and example headers”+”<br><br><br><h1>Header h1</h1><h2>Header h2</h2><br><br><br>Hello world<br><br><br><redText>This text <i>will be red</i></redText><br><br><h1>Boo</h1></span>”;
var txtField:TextField = new TextField();
var obj:Object = new Object();
var style:StyleSheet = new StyleSheet();

obj.fontFamily = “Comic Sans Ms”;

style.setStyle(“body”,{ fontSize:’15’, color:’#000006′ });
style.setStyle(“h1”,{ fontSize:’32’, color:’#FFCC00′ });
style.setStyle(“h2”, { fontSize: ’19’, color:’#000000′ });
style.setStyle(“a:link”,{ color:’#0000FF’, textDecoration: ‘none’});
style.setStyle(“a:hover”,{ color:’#0000FF’, textDecoration: ‘underline’});
style.setStyle(“b”,{ fontWeight: ‘bold’});
style.setStyle(“em”,{ fontWeight: ‘bold’});
style.setStyle(“.defaultStyle”, obj);
style.setStyle(“redText”,{ color: ‘#FF0000’});

txtField.width = 500;
txtField.multiline = true;
txtField.styleSheet = style;
txtField.htmlText = txt;
txtField.autoSize = TextFieldAutoSize.LEFT;
txtField.wordWrap = true;
txtField.border = true;
addChild(txtField);

AS3 Math Property

Programlamanın olmazsa olmazı ve aynı zamanda da temel taşı olan matematik sınıfını actionscriptte de kullanabiliyoruz. Benim görüşüme göre matematik sınıfının en çok kullanıldığı programlama dili ActionScripttir. Bende bu sınıfların propertylerini ve ne işe yaradıkları buraya yazacağım 🙂

// abs özelliği bize mutlak değeri verir.
// İçerisinde pozitif sayıları barındırır.
trace(Math.abs(-8.2)); // 8.2

// ceil özelliği bize bir üst tam sayıyı verir.
// bu koşul ondalıklı rakamlar için geçerlidir.
trace(Math.ceil(20.002)); // 21

// floor özelliği ondalıkları atarak bize ham sayıyı verir.
trace(Math.floor(236.322)); // 236

// max adından da anlaşıldığı gibi
//iki sayı arasındaki en büyük değeri verir
trace(Math.max(50,85)); // 85

// min adından da anlaşıldığı gibi
//iki sayı arasındaki en küçük değeri verir
trace(Math.min(50,85)); // 50

// pow değeri bizim 2 üzeri 3 anlamına gelen matematiksel değerimiz
// bundaki mantık 2x2x2 dir. yani sağdaki parametre kadar soldaki değeri çarpar.
trace(Math.pow(2,3)); // 8

// round en yakın tam sayının değerini döndürür.
// eğer 30.45 olsaydı çıktısı 30 olacaktı.
trace(Math.round(30.45)); // 31

// sqrt verdiğimiz rakamın kare kökünü bize verir.
trace(Math.sqrt(16)); // 4

Flash Builder ile İlk Adım

Flash Builder hem Flex projelerimizi hem de Flash ActionScript projelerimizi hemde Flash projelerimizi geliştirmemiz için güzel bir IDE en azından diğerlerinden artıları var tabii. Artık Flash ile uygulamalarda kodları library ya da stage eklemiyoruz. Direk Libraryden çekebiliyoruz.

İlk örnek Yeni Proje Açmak

File > New (bu pencere ile yeni dökümanlar açabiliyoruz. Biz burada ActionScript projesi geliştireceğimiz için ActionScript Project açıyoruz)

Create an ActionScript Project (bu pencerenin altından gerekli ayarları yapacağız.)

Project Name kutusuna projemizin ismini yazıyoruz.
Örnek olarak : FirstExampleProject olarak veriyorum.

Use default location alanı checklendiğinde aşağıdaki kutucukla projemizin proje dökümanı yerini ayarlayabiliyoruz. Browse butonunu kullanarak.

Flex SDK Version bununla birlikte Flex Software Develompent versiyonunu belirliyoruz. Varsıyalan olarak kalabilir.

Next diyerek devam ediyoruz.

Aşağıdaki kutucukları tek tek incelemek gerekirse;

Main source folder : Projemizin Classlarının bulunduğu klasördür istediğiniz ismi verebilirsiniz. Ben Serhat/Main.as olarak verdim.

Main application file : Projemizin ana class dosyasıdır. Yani Projemizi başlatan Class dosyasıdır.

Output folder  : Çıktı dosyamız yani Debug işlemlerinde dosyalarımızı ayıklayacak browserda göstermesini sağlayan yapı

Output folder URL  : Yukarıda işlemleri gerçekleştirecek olan debugın URL adresini vererek o adreste hata ayıklanmasını sağlayan kutucuk

Tab menüler incelersek

1. Source Path (bununla kod kütüphanelerimizin yerlerini belirleyebilir, kodlarımızı yazarken bir daha yazmamıza gerek kalmaz örnek vermek gerekirse TweenMax proje dosyanızı yolunu Add Folder… diyerek yerini belirtebilir projenize ilave ederek kullanabilirsiniz.)

2. Library Path (Add Project… ile projemize yeni projeler ekleyebiliriz.)

3. Add SWC Folder (Flashda tasarımını yaptığımız ve Linkage verdiğimiz dosyaları ekleyebileceğimiz panel)

4. Add SWC (Flash ile yaptığımız tasarımları linkage ettikten sonra .swc olarak çıktısını aldığımızda ekleyeceğimiz panel)

İlk Proje Flash ve Flash Builder

Flash Professional programımızı açıyoruz ve sahnemize bir adet dikdörtgen çiziyoruz. Sağ tıkladıktan sonra Convert to Symbol diyerek MovieClibe çevirelim ve adını Dikdortgen verelim. Daha sonra Libraryimize dönerek Dikdortgen movieclibine sağ tıklayarak Properties diyoruz daha sonra Export for ActionScript dedikten sonra Class ismini Lib_SquareMC olarak veriyoruz.

Daha sonrasında ise Flash dosyamızı Flash Builder ActionScript project dökümanımızın bulunduğu Bin klasöründe bir yere istediğimiz isim ile kayıt edelim benimkisi Bin/Main.fla bu şekilde devam edeceğim. Flash dosyamız açıkken File > Publish Setting > Flash Sekmesi > SWF Settings Başlığından > Export SWC diyoruz ve OK diyerek çıkıyoruz daha sonra test ediyoruz Ctrl + Enter (Control > Test Movie > Test) flash ile işlemimiz bitti. Şimdi Flash Builder programımıza dönüyoruz.

File > New > ActionScript Project diyoruz ve daha sonra buradaki ayarları yukarıda belirttiğim gibi veriyoruz.  Ben OrnekUygulama olarak veriyorum daha sonra Next diyerek Library Path ile Add SWC… ile Bin klasörü içerisindeki SWC dökümanımızı buluyoruz ve  OK deyip onayladıktan sonra Finish diyerek çıkıyoruz ve Main.as dosyasına ilk kodlarımızı yazıyoruz.

// Libraryde verdiğimiz Lib_SquareMC yi çağırmamız gerekiyor bunun için bir değişken oluşturuyoruz.
package
{
import flash.display.MovieClip;

public class Main extends MovieClip
{
private var box:Lib_SquareMC;

public function Main()
{
// Fonksiyonumuzun içerisinde belirtiyoruz ve yeni bir Lib_SquareMC oluşturup addChild ile ekliyoruz
box = new Lib_SquareMC();
addChild(box);
// Tıklandığında kaybetmek için kullanacağımız fonksiyon
box.addEventListener(MouseEvent.CLICK,onClick);
}

private function onClick(event:MouseEvent):void{

//Kutumuzu yok ediyoruz.
box.alpha = 0;

}
}
}

Daha sonra yukarıdaki yeşil renkteki oynatma butonuna bir kez tıklayarak bekliyoruz ve açılan pencerede sonucu gözlemliyoruz kolay gelsin =)

String Class split ve join

Büyük bir metnimiz var ve biz bu metnin içersindeki virgülleri almak ve yerine istediğimiz bir imgeyi koymak istiyoruz. Bunun için yapılması gerekenler metinin içerisindeki virgülleri bulup noktalar ile değiştirmek. Bunun için String classın split ile bulup join ile değiştireceğiz. Yazımızda da noktadan sonrasındaki ilk harfi büyük yapmak istiyoruz , bunuda indexOf ile bulup toLowerCase() ile küçültebilir, toUpperCase() ile de ilk harfini büyütebiliriz.

var str:String = “Burada virgül ile yazılmış, değerleri nokta ile değiştirip, split ve join işlemini yapmış, öğrenmiş olacağız,,,”;

trace(str.split(“,”).join(“.”));

AS3 ipuçları – 1

BlendMode (Renk Mikseri)

BlendMode bizim flashda display panelindeki özellikleri kullanmamızı sağlar. Yani Flash IDE sinde kullanacağımız özellikleri ActionScript 3 de de kullanabiliyoruz.

movieclip.blendMode = BlendMode.MULTIPLY;

CacheAsBitmap(Bitmap Gösterimi)

Vektörel çizimlere Bitmap gibi kullanılır. Vektörel imajların boyutları çok düşük olsa bile işlemciyi çok kasar. Bu nedenle bazı durumlarda vektörel çizimleri bitampe çevirir performans kazanmanız gerekebilir. True veya False parametreleri vardır.

target_mc.cacheAsBitmap = true;
// bitmap yapar…

target_mc.cacheAsBitmap = false;
//normalde vektörlerse yine vektörel olarak kullanılır.