photoders » Mouse

Mouse Cursor Efektli Header

admin — Mon, 09 Nov 2009 21:36:04 +0000

Flash header çalışmamızda Cursor (Mouse Ucunu) ‘u kişiselleştirip kendi web sitemiz için headerimizi hazırlayacağız. Yeni bir çalışma sayfası açalım benim çalışmadaki sayfa değerlerim 450×150 px oldu siz kendi çalışma sayfanızı kendinize göre açabilirsiniz.

1-Çalışmamıza başlarken ilk olarak Mouse ucunu hazırlayalım. İlk olarak resimdeki örnek şekli hazırlayalım. Seçili durumda symbol yapalım F8 graphic name olarak (cusor_normal )olarak adlandıralım. Properties panelden Rotate CW yapalım.

2-Tekrar seçili durumda F8 Movie Clip yapalım name olarak (cursor_mc) yazalım. Cursor_mc içinde animasyon yapalım şimdi 30 frameye keyframe ekleyelim frame arasına create motion tween verelim.

3-İkinci şeklimizi yapalım örnek resimdeki çizimi yapalım seçili durumda F8 graphic yapalım name (cursor_over)yazalım. Şimdi tekrar F8 movie clip yapalım name (cusorover_mc )yazalım. Klipimiz cusorover_mc içinde animasyonu oluşturalım 40 frameye keyframe ekleyip frame aralarına create motion tween verelim 1 framede properties panelde Rotate CW yapalım.

4-İki klip hazırlandı şimdi Mouse animasyonumuzu hazırlayalım. İlk olarak cursor_mc klipi saheye alıp seçili durumda F8 movie klip yapalım name (cursor_klip)yazalım Layer1 10 frameye gelelim keyframe ekleyelim sahnedeki şeklimizi delete silelim kütüphaneden cusorover_mc klipi alarak ekleyelim. 30 frameye key ekleyelim.

5-Yeni layer ekleyelim layer adı Label olsun 1.framede instance name kutusuna (normal)yazalım 10 frameye keyframe ekleylip tekrar instance name kutusuna (over)yazalım. Yeni layer ekleyip layer adını action yapalım 1 frameye stop eklemek için F9 actions paneli açalım. 10 frameye keyframe ekleyelim actions paneli açıp stop ekleyelim.

6-Mouse ucu animasyonumuzu hazırladık şimdi buton yapalım. Buton hazırlamak için örnek resimdekine benzer çizim yapabilirsiniz.

7-Çizimi bitirdikten sonra seçili durumda F8 Button yapalım name(logo_button)yazalım buton içine girelim Up kısmında şeklimiz aynı kalıyor Over kısmında biraz büyültelim Down kısmında küçültelim hit kısmına çizimi kapatacak şekilde mask yapalım.

8-Butonumuz tamamlandı şimdi scene 1 sayfamıza gelelim örnek resimde görüldüğü şekilde bir header düzenledim üst kısma bar alt kısmada bar ekledim arka renk için #333333 renk verdim örnek resim. Bu kısmı kendinize göre uyarlayabilirsiniz tek, tek anlatmaya gerek görmedim eğer isterseniz ekli dosyadan inceleyebilirsiniz.

9-Çalışmamızı genel olarak tamamladık şimdi yaptığımız buton,klipleri yazıları yerleştirelim. Yeni layer ekleyelim layer adı action olsun.

10-Resimde görülen Mouse_mc klipi sahnede seçelim instance name kutusuna (newKlip)yazalım.
11-sahnedeki butonları tek tek seçili yaparak actions paneli açıp ekli kodu ekleyelim.

on (rollOver) {
	with (newKlip) {
		gotoAndStop("over");
	}
}
on (rollOut) {
	with (newKlip) {
		gotoAndStop("normal");
	}

12-Son olarak en üst action layer 1.framede actions paneli açıp ekli kodu ekleyelim.

Mouse.hide();
startDrag("newKlip", true);

Çalışmamızı artık test edebiliriz. Ctrl+Enter

FLA İndir

Bu Yazıyı Paylaşın

Duvar Kağıdı Animasyon AS3

admin — Sun, 04 Oct 2009 10:33:21 +0000

Flash çalışmamızda resim üzerinde Actions Script kod kullanarak mouse etkili animasyon uygulayacağız. İlk olarak çalışmamızda kullanacağımız resmimizi import edelim CTRL+R resmimizi movie clip yapalım F8 layer1 adını resim olarak isimlendirelim.

2-Resim_mc klipi sahnemize ortalayalım bu işlemi Align paneli kullanarak kolayca yapabiliriz CTRL+K

3-Properties Paneli gelelim Instance name kutusuna resim_mc klipimizi yazalım.
4-Son olarak AS3 kodumuzu ekleyelim eklemek için resim layer 1.framesinde F9 actions paneli açalım ekli kodu ekleyelim.

var bevelSpeed:Number = 8;

resim_mc.addEventListener (MouseEvent.MOUSE_OVER, mouseOverresim_mc);

resim_mc.addEventListener (MouseEvent.MOUSE_OUT, mouseOutresim_mc);

resim_mc.addEventListener (Event.ENTER_FRAME, enterFrameresim_mc);

var bevelFilter:BevelFilter = new BevelFilter(10,
                                   45,
                                   0x14173a,
                                   1,
                                   0x79ac9d,
                                   1,
                                   0,
                                   0,
                                   0,
                                   BitmapFilterQuality.HIGH,
                                   BitmapFilterType.INNER,
                                   false);

resim_mc.filters = [bevelFilter];

var mouseIsOverresim_mc:Boolean = false;

function mouseOverresim_mc (event:MouseEvent):void {
mouseIsOverresim_mc = true;
}

function mouseOutresim_mc (event:MouseEvent):void {
mouseIsOverresim_mc = false;
}

function enterFrameresim_mc (event:Event):void {

if (mouseIsOverresim_mc == true && bevelFilter.blurX < 100) {
bevelFilter.blurX += bevelSpeed;
bevelFilter.blurY += bevelSpeed;

bevelFilter.strength = 5;
}

if (mouseIsOverresim_mc == false) {
bevelFilter.blurX -= bevelSpeed;
bevelFilter.blurY -= bevelSpeed;
}

if(bevelFilter.blurX == 0) {
bevelFilter.strength = 0;
}

resim_mc.filters = [bevelFilter];
}

5-Son olarak hızımızı belirleyelim frame rate 40 yaparak çalışmamızı deneyelim.
CTRL+ENTER

FLA İndir

Bu Yazıyı Paylaşın

Flash Menü Mouse Gizli

admin — Sat, 04 Jul 2009 14:43:39 +0000

Çalışmamızda flash menü hazırlayacağız web sayfalarında kullanabileceğiniz hoş görünümlü bir çalışma yapacağız AS2 uygulaması olacak ayrıca Mouse kendimize göre düzenleyeceğiz Mouse işaretini kaldıracağız. İlk olarak yeni çalışma sayfası açalım 550x200px background beyaz olsun.

1-Rectangle Tool aracını seçelim properties panelden rectangle corner radius seçeneğinin kilidini açalım çünkü biz tek tarafına radius vereceğiz. Çizim bitince seçili yapalım F8 button yapalım name 1 olsun. Sadece up kısmında aktif olması yeterli. Örnek resim.

2-Hazırladığımız butonu çoğaltalım kütüphaneden kolayca duplicate yapabiliriz name kısmına 5 yazalım free transform rotate aracı ile diğer kenar için çevirelim çevirme işleminde gradient rengimizide düzeltelim Gradient Transform Tool aracı kullanabiliriz örnek resim.

3-İki adet kenar butonu hazırladık isterseniz hemen butonların tek, tek içine girelim yazı yazalım yeni layer ekleyelim up kısmında beyaz renk ile yazımızı yazalım F6 keyframe ekleyelim over kısmında yazı rengini değişelim. Örnek resim.

4-Orta butonumuzu hazırklamak için tekrar rectangle tool aracı seçelim örnek dikdörtgeni oluşturalım butonlarımız aynı gradient renk seçeneklerini uygulayalım örnek resim.

5-Ortadaki butonları tekrar çizmeye gerek yok hazırladığımızı kütüphanede çoğaltalım name kısmına sırayı takip ederek numaralandıralım 1 ile 5 vardı 2,3,4 olarak yazarsak olur her butonumuzu içine girelim yazıları tek, tek yazalım ilk uygulamanın aynısı olacağından anlatmıyorum.
6-Scene 1 sahnemize butonları düzgün bir şekilde yerleştirelim örnek resim.

7-Butonları tek tek seçelim properties panelden filters paneli açalım drop shadow efekti verelim.

8-Mouse efektimizi yapalım örnek resimdeki şekli ben oluşturdum siz kendinize göre yapabilirsiniz çizim sonrası şekli F8 movie Clip yapalım name Mouse olsun yazacağımız yazıyı yazalım scene1 sahnemize gelelim ilk layer butonlar layerimiz oldu yeni layer ekleyelim layer adı Mouse olsun kütüphaneden Mouse klipimizi alarak 1.frameye yerleştirelim. Sahnede Mouse klipimiz seçili durumda instance name kısmına Mouse yazalım properties panelden filters penceresini açalım drop shadow efekti verelim örnek resim.

9-mouse layer 1.framesine gelerek actions paneli açalım F9 ekli kodo yazalım.

mouse.show();

10-Sahnedeki Mouse klipi seçelim actions paneli açalım ekli kodu ekleyelim.

onClipEvent(enterFrame){
this.startDrag(true);
}

11-Geldik mouse işaretini kaldırmaya butonlar layerimize gelelim tek tek butonları seçelim actions paneli açalım ekli kodu ekleyelim.

on(rollOver) {
Mouse.hide();
}
on(rollOut){
Mouse.show();
}

12-Ben çalışmada daha etkili görünüm elde edebilmek için bir animasyon hazırladım animasyonu çoğalttım toplam üç adet oldu klipleri scene1 sahnemize yeni layer ekleyerek yerleştirdim properties panelden filters blur efekti uyguladım alpa değerinide %20 yaptım bu kısmı fazladan yapılan çalışma oldu incelemek için ekli dosyayı indirebilirsiniz.
Çalışmamız sonlandı test edelim Ctrl+Enter

FLA İndir

Çalışmayı İzle

Bu Yazıyı Paylaşın

Flash Action Script 3.0 Mouse Etkili Döndürme

admin — Wed, 29 Apr 2009 22:38:03 +0000

Flash çalışmamızda hazırladığımız movie clip üzerinde mouse ile tıkladığımızda oluşan olayı Action Script 3.0 kod ile nasıl yapacağımızı sizlere anlatmaya çalışacağım. İlk olarak çalışma sayfamızı açalım sahneye bir klip oluşturalım ben Polystar Tool aracı ile sahneye altı köşe oluşturdum. F8 Movie Clip yapalım name olarak altıgen ismini verelim.

2-Klipimizi kod ekleyerek kullanacağımız için properties panelden instance name kısmına altıgen_mc yazalım. Klipimizin layer adını altıgen olarak değişelim yeni layer ekleyelim layer adını actions yapalım birinci framede sağ tıklayalım (F9)Actions panelini açalım qaşağıda açıklamasın verdiğim kodu ekleyelim.
//ilk olarak klibimizi buton davranışı verelim altıgen_mc.buttonMode=true; //Tıklanma islevi tıklama sırasında döndürme altıgen_mc.addEventListener(MouseEvent.CLICK, donus); //döndür fonksiyonu tanımlayalım function donus(oly:MouseEvent) { altıgen_mc.rotation += 30 //dönüs fonksiyon özelikleri artı değeri sağa 30 değer dönüş yapacak altıgen_mc.alpha -= 0.2 //klibimizin alpa değerini düşürelim altıgen_mc.scaleX = altıgen_mc.scaleY -= 0.2 //büyüme küçülme ekliyoruz }
3-Klibimiz tıklandığı zaman verdiğimiz değer kadar dönüş, alpa ve küçülme olayını oluşturmuş olduk
Test edelim Ctrl+Enter
FLA İndir
Mouse ile klip üzerine tıklayın.

Bu Yazıyı Paylaşın

Mouse Fare Tekerleği Kontrol

admin — Mon, 05 Jan 2009 20:18:47 +0000

AS3 uygulamasında mouse tekerleğini kullanarak sahnede hazırladığımız movieclip aşağı yukarı hareket ettireceğiz.
İlk olarak istediğiniz ölçülerde flash çalışma sayfası açalım. Sahneye istediğimiz bir şekil çizelim benim tercihim flash icon resmi oldu name kısmına kare yazdım F9 movieclip yapalım.

[Hidepost]
Klipimizin instance name kısmına klipimize verdiğimiz ismi kare yazalım. Layer1 üzerinde Actions paneli açalım F9 ekli kodları girelim.
//www.photoders.com AS3 // stage.addEventListener(MouseEvent.MOUSE_WHEEL, teker);
Sahnemizin üst kısmına Dynamic Text oluşturalım instance name kısmına hareket yazalım.
Çalışmamızı test edelim CTRL+ENTER

function teker(e:Event){
var _e=e;
kare.y-=_e.delta;
if(_e.delta<0){
hareket.text=”kare alt”;
} else { hareket.text=”kare ust”; }
}

FLA İndir

Çalışmayı İzle

[/Hidepost]

Bu Yazıyı Paylaşın