ALLAH (cc)'IN EN GZEL SMLER (ESMA-L HSNA)
el - GANİYY

Çok zengin, hiçbirşeye muhtaç olmayan.

     ANASAYFA    |   BEN KMM?   |   GALER   |   ZYARET DEFTER   |   LETM      İnsanlara merhamet etmeyene Allah da merhamet etmez. - Hz.Muhammed (sav)

Flash Action Script 3 ile YapBoz Yapımı

Flash Action Script 3 ile YapBoz Yapımı
 + Yazy Byt    - Yazy Klt           

Selamun Aleyküm, merhaba, bu dersimde flash action script 3.0 ile yapboz yapımını anlatacağım.

İlk olarak resim düzenleme programlarında herhangi bir resmi istediğiniz parçaya bölünüz. Ben aşağıdaki resmi 2 parçaya böldüm. Anlatımı basit olsun diye 2 parça resimle yapacağım.

yapboz animasyonu resim parçaları

Fireworks programını kullanarak kestiğim resimleri tek tek kopyala yapıştır ile flash programının sahne içine yapıştırdım.  Bu resimlerin örnek adına 1.parçaya r1, 2.parçanın örnek adına r2 yazdım. Bu isimlerle bu resimleri kullanacağız.

Sahneye yeni bir katman ekleyelim ve bu katmanı Katman 1'in altına taşıyalım. 2.katmana 1.katmandaki r1 ve r2 yi kopyalayalım. Bu kopyaladığımız resimlerin örnek adını da g1 ve g2 yapalım. Görüntü olarak kullanacağız. Yani yapbozun altında kılavuz resmi olarak kullanacağız. Katman 2'deki g1 örnek adlı birinci resmi seçelim ve özellikler penceresinden Renk Efekti bölümünden stil açılır menüsünden parlaklığı seçelim ve parlaklığı arttıralım resmimiz soluk görünecek, bu işlemi g2 içinde yapalım. g1 ve g2 yi sahnede istediğimiz yere yerleştirelim.    Kaynak: www.mustafakarsli.com

Katman 1'de iken bir adet Metin Aracı ile dinamik metin oluşturalım ve örnek adını mesaj yapalım. Mesaj yazdırmak için kullanacağız.

Zaman çizelgesinde 1. kareye tıklayarak Eylemler penceresini açalım aşağıdaki kodları yazalım.

1    import flash.events.MouseEvent;

2    function surukle(Event:MouseEvent):void
3    {
4      r1.startDrag();
5    }

6    function birak(Event:MouseEvent):void
7    {
8      r1.stopDrag();

9      if(r1.x>=g1.x && r1.x<=(g1.x+10) && r1.y>=g1.y && r1.y<=(g1.y+10))
10     {
11       mesaj.text="1.resim doğru yerde";
12       r1.x=g1.x;
13       r1.y=g1.y;
14     }
15     else
16     {
17       mesaj.text="1.resim yanlış yerde";
18     }
19   }

20   r1.addEventListener(MouseEvent.MOUSE_DOWN,surukle);
21   r1.addEventListener(MouseEvent.MOUSE_UP,birak);

//yukarıdaki işlemleri 2.parçaya da uyguluyoruz... Sadece 1'leri 2 yapıyoruz ve foksiyon isimlerine de 2 ekliyoruz.   Kaynak: www.mustafakarsli.com

22   function surukle2(Event:MouseEvent):void
23   {
24     r2.startDrag();
25   }

26   function birak2(Event:MouseEvent):void
27   {
28     r2.stopDrag();

29     if(r2.x>=g2.x && r2.x<=(g2.x+10) && r2.y>=g2.y && r2.y<=(g2.y+10))
30     {
31       mesaj.text="2.resim doğru yerde";
32       r2.x=g2.x;
33       r2.y=g2.y;
34     }
35     else
36     {
37       mesaj.text="2.resim yanlış yerde";
38     }
39   }

40   r2.addEventListener(MouseEvent.MOUSE_DOWN,surukle2);
41   r2.addEventListener(MouseEvent.MOUSE_UP,birak2);

Yukarıdaki kodu açıklayacak olursak;     Kaynak: www.mustafakarsli.com

1.satırda, Fare olaylarını kütüphaneden içeri aktarıyoruz.

 2,3,4,5.satırlarda, surukle fonsiyonu oluştruyoruz.

  4.satırda, r1' in sürüklenmesini başlatıyoruz.

  6...19.satırlarda, birak fonksiyonunu oluşturuyoruz.

  8.satırda, r1'in sürüklenmesini bitiriyoruz.

  9...14.satırlarda, if yapısı ile r1'in x ve y koordinatlarını karşılaştırıyoruz. g1'in x ve y koordinatını baz alarak 10x10 luk bir alanda karşılaştırma yapıyoruz. Yani r1'in x koordinatı g1'in x koordinatına eşit veya 10 piksel uzaklıktaysa yani koordinata yakınsa ve y koordinatı da g1'in y koordinatına eşit veya 10 piksel uzaklıktaysa diye karşılaştırma yapıyoruz.

11.satırda, yukarıdaki if şartı sağlanıyorsa yani r1, g1'in koordinatına yakınsa mesaj nesnesinde 1.resim doğru yerde  yazdırılıyor.

12.satırda, r1'in x koordinatı, g1'in x koordinatına eşitleniyor.

13.satırda, r1'in y koordinatı, g1'in y koordinatına eşitleniyor, böylece r1, g1'in üzerine oturtuluyor.

15...18.satırlarda, yukarıdaki if yapısı sağlanmıyorsa else yapısı devreye giriyor.

17.satırda, if değilse yani r1, g1'e yakın yerde değilse  1.resim yanlış yerde mesajı veriliyor.

20.satırda, r1'e fare olayı ekleniyor. Farenin tuşuna basılınca surukle fonksiyonu çalıştırılıyor.

21.satırda, r1'e fare olayı ekleniyor. Farenin basılan tuşu bırakılınca birak fonksiyonu çalıştırılıyor. 

Buraya kadar sadece parça 1 (r1) içindi aynı adımlar (22...41.satırlar) parça 2 (r2) için de yapılıyor.

Tüm bu kodları yazdıktan sonra Ctrl+Enter ile uygulamayı çalıştırabilirsiniz. Aşağıdan da uygulamayı deneyebilirsiniz.

DERSİN KAYDI :

Dersin görsel destekleme videosunu aşağıdan izleyebilirsiniz..

Bu mantıkla herhangi bir resim alınıp parça sayısı arttırılarak yapbozlar yapılabilir... Yeni derslerde görüşmek üzere sağlıcakla kalınız...

Mustafa KARSLI    Kaynak: www.mustafakarsli.com

( 6956 ) kez okundu     -     07.05.2015    Tweetle     
Flash Action Script 3 ile YapBoz Yapımı, yapboz yapımı, flash yapboz, actionscript3 yapboz, puzzle, flash puzzle, flash puzzle make, action script ile yapboz, mustafa karslı, animasyon
Ziyareti Yorumlar
( 3 ) Yorum
Tmn Gster
CEYHUN - İSTANBUL - 15.05.2019 18.26
     KEŞKE İNDİRİLİYOR OLABİLSEYDİ

emre karakaya - İstanbul - 17.04.2019 13.29
     Merhabalar Hocam.Bu yazınızı çok beğendim.Başarılarınızın devamını dilerim.11.Sınınf öğrencisi olarak başarılarınızın devamını dilerim. MADEM TÜRKSÜN GÖSTER ÜRKSÜN! YAŞASIN TURAN!

Faruk - istanbul - 26.12.2016 00.05
     İyi akşamlar, ben üniversitesi 1. sınıf öğrencisiyim. Grafik animasyonda hoca , bir resim çiziceksiniz ve onu en az 16 parçacıklara bölüp puzzle yapıcaksınız dedi. Bende sizden yardım istecektım. İyi akşamlar...

Yorum Ekle
Gvenliiniz iin iP adresiniz kaydedilmektedir. Herhangi bir Hukuki Dava ile karlamamak iin hakaret ieren szler ve argo kelimeler kullanmaynz.
sim
:
Yorum
:
En fazla 400 karakter
ehir
:
E-Posta
:
E-Posta adresi Yaynlanmaz
(Gvenliiniz iin ip adresiniz (18.207.255.49) kaydedilecektir)
  Yeni Dersleri Takip etmek stiyorum. Adresime E-Posta Gelmesini Onaylyorum.
BENZER YAZILAR
Android
Arduino
Bilgisayar Ağları
Bilişim Teknolojileri
C Sharp
Çalışmalar
Donanım
Fireworks
Flash - Action Script 3
Gezdik ve Gördük
HTML
JavaScript
Kişisel Gelişim
Okul Öncesi Etkinlik
PHP
Silverlight
Şanlı Tarihimiz
Yazılarım
  Zamanlanm Duyuru/dev Bulunmamaktadr...  
Kiisel resim ve yazlar kullanmak yasaktr. Bunun dndaki dersleri sim ve Kaynak gstermek artyla kullanmak serbesttir.
 Aktif ziyareti : 3
 Bugn : 579
 Toplam : 2011951
Mustafa KARSLI - Bilişim Teknolojileri Öğretmeni © 2008 - 2019  
Site Haritas

 

3