Flash ile İl İl Türkiye Haritası yapalım

Flash - Flash ile İl İl Türkiye Haritası yapalım ...

Cevapla
Flash ile İl İl Türkiye Haritası yapalım
muratcdemirci isimli Üye şimdilik offline konumundadır

muratcdemirci

Grafiker / İstanbul

Dosya19

Flash ile İl İl Türkiye Haritası yapalım

Alt 25-03-2010 #1
Sponsorlu Bağlantılar

Uyarı:

Her il için bir sayfa hazırlama zahmetli olacağından il üzerine tıklandığında açılacak sayfa hazırlanmadığından sayfa açılamadı şeklinde uyarı alacaksınız. Çalışmanın sonunda her il için hazırlanacak sayfanın adı yazılacaktır.Kodlara göre sayfa adı verileceğinden açılacak sayfa isimlerinin size yazılanlardan farklı olmamasına dikkat etmelisiniz.


Flash ile İl İl Türkiye Haritası yapalım

Flash ile İl İl Türkiye Haritası yapalım

Flash ile İl İl Türkiye Haritası yapalım

Flash ile İl İl Türkiye Haritası yapalım

Flash ile İl İl Türkiye Haritası yapalım

Flash ile İl İl Türkiye Haritası yapalım













Uygulama:

Çalışmayı incelediğinizde çok fazla anlatılacak bir dosya olmadığını göreceksiniz.Burada en önemli konu çizimin yapılabilmesidir.Sahneye yerleştirilen her il bir film klibi şeklindedir ve bu klip üzerine gelindiğinde 2.kareye geçiş yaparak bir renk değişim efekti verir. Bu nedenle çalışmada sadece kodlardan bahsedilecek ve uyarlamayı nasıl yapacağınız tanımlanacaktır.

Fla dosyası açtığınızda sahnede harita adında tek bir klip ve bunun altında deniz ve kara çizgisini belirleyen bir arkaplan vardır. Harita klibine çift tıkladığınızda asıl çalışmanın içine girmiş olursunuz.Tüm kodlar bu bölümdedir. Burada alt layera dış kenarları çizilmiş haritamız yerleşmiş bunun üstünde de tüm şehir klipleri tek tek ilgili kısma eklenmiştir. Ayrıca sahne dışına şehirlerin isminin atanacağı bir dinamik kutu içeren film klibi eklenir.Bu klibin instance name`i balon` dur.

Şehir kliplerini tek tek seçerek baktığınızda hepsinde de aynı kodların bulunduğunu göreceksiniz. Bu kodlar birazdan anlatacağımız timeline üzerinde actionscript layerına yerleştirilmiş fonksiyonları çalıştırmaktadır.

on (rollOver) {
y = new String(_name);
a = y.slice(1, 3);
_parent.rbtxt(a);
}
on (rollOut) {
_parent.rbalon(a);
}
on (release) {
_parent.rpress(a);
}

Yukarıdaki kodları incelemeden evvel şehir kliplerine tek tek tıklayarak instance name alanına bakarsanız tüm kliplere önce x sonra plaka numarasının eklendiğini göreceksiniz. Örneğin Samsun il klibinin instance name`i x55 , İstanbul`un x34 dür. Bu isimlendirme çok önemlidir. Çünkü daha sonra yazılacak fonksiyonlarda bu kliplere ait x karakterinden sonra gelen rakam alınarak kullanılacaktır. Şimdi kodları irdeleyelim:

on (rollOver) {
y = new String(_name);
a = y.slice(1, 3);
_parent.rbtxt(a);
}
// Fare klip üzerine geldiğinde y değişkenine klibin adı atanıyor.Örneğin Samsun için y değişkeni x55 adını alır. Daha sonra a değişkenine slice metodu ile y değişken değerinin son iki karaktere atanıyor. Bu Samsun için 55 olur. a değişkenine ait 55 değeri daha sonra timelineda tanımlanacak olan rbtxt adlı fonksiyona gönderilecek ve bu fonksiyon çalıştırılacaktır.

on (rollOut) {
_parent.rbalon(a);
}
// Fare klip üzerinden çekildiğinde yine daha sonra anlatılacak olan rbalon fonksiyonuna a değeri gönderilip çalıştırılacaktır.

on (release) {
_parent.rpress(a);
}
// Klip tıklandığında rpress fonksiyonuna a değeri gönderilerek çalıştırılır.

Şimdi bunlar çalıştığında ne olacağını anlamak için timeline üzerindeki kodlara bakalım:

//Etiket için şehir isimleri
ilad = "a,Adana,Adıyaman,Afyon,Ağrı,Amasya,Ankara,Antalya ,Artvin,Aydın,Balıkesir,Bilecik,Bingöl,Bitlis,Bolu ,Burdur,Bursa,
Çanakkale,Çankırı,Çorum,Denizli,Diyarbakır,Edirne, Elazığ,Erzincan,Erzurum,Eskişehir,Gaziantep,Giresu n,Gümüşhane,Hakkari,
Hatay,Isparta,Mersin,İstanbul,İzmir,Kars,Kastamonu ,Kayseri,Kırklareli,Kırşehir,Kocaeli,Konya,Kütahya ,Malatya,Manisa,Kahramanmaraş,
Mardin,Muğla,Muş,Nevşehir,Niğde,Ordu,Rize,Sakarya, Samsun,Siirt,Sinop,Sivas,Tekirdağ,Tokat,Trabzon,Tu nceli,ŞanlıUrfa,Uşak,Van,Yozgat,
Zonguldak,Aksaray,Bayburt,Karaman,Kırıkkale,Batman ,Şırnak,Bartın,Ardahan,Iğdır,Yalova,Karabük,Kilis, Osmaniye,Düzce";

//Gidilecek adres için şehir isimleri
ilurl = "a,adana,adiyaman,afyon,agri,amasya,ankara,antalya ,artvin,aydin,balikesir,bilecik,bingol,bitlis,bolu ,burdur,bursa,
canakkale,cankiri,corum,denizli,diyarbakir,edirne, elazig,erzincan,erzurum,eskisehir,gaziantep,giresu n,gumushane,hakkari,
hatay,isparta,mersin,istanbul,izmir,kars,kastamonu ,kayseri,kirklareli,kirsehir,kocaeli,konya,kutahya ,malatya,manisa,kmaras,
mardin,mugla,mus,nevsehir,nigde,ordu,rize,sakarya, samsun,siirt,sinop,sivas,tekirdag,tokat,trabzon,tu nceli,sanliurfa,usak,van,
yozgat,zonguldak,aksaray,bayburt,karaman,kirikkale ,batman,sirnak,bartin,ardahan,igdir,yalova,karabuk ,kilis,osmaniye,duzce";

//Buton üzerine gelince çalışacak olan fonksiyon
function rbtxt(a) {
var Register_1_ = a;
var Register_2_ = this;
balon._visible = true;
arbtxt = ilad.split(",");
balon.txt.text = arbtxt[Register_1_];
Register_2_[("x" + Register_1_)].play();
balon._x = Register_2_[("x" + Register_1_)]._x;
balon._y = (Register_2_[("x" + Register_1_)]._y - Register_2_[("x" + Register_1_)]._height / 2) - 25;
}

//Buton üzerinden ayrılınca çalışacak olan fonksiyon
function rbalon(a) {
balon._visible = false;
this[("x" + a)].gotoAndStop(1);
}

//Butona tıklanınca çalışacak olan fonksiyon
function rpress(a) {
arburl = ilurl.split(",");
getURL(arburl[a] + ".html", "_blank");
}

Önce ilad isimli bir değişkene tek bir string şeklinde tüm şehir adları virgül ile ayrılarak yazılır. Bu değer daha sonra split komutu ile virgülden itibaren ayrılacak. Ve tüm isimler arbtxt adlı bir dizi oluşturacaklardır. Bu dizi fare ile şehirler üzerine gelindiğinde isminin yazıldığı balon klibi içindeki dinamik metin kutusuna aktarılmak için kullanılacaktır.

Split komutu kullanılmadan da şehir isimleri doğrudan bir diziye aktarılarak kodlama yapılabilirdi ama hazırlayan yazarın tercihi bu yönde olduğundan değiştirilmedi. Çalışmaının sonunda split komutu kullanılmadan daha temiz bir kod grubu yazılacaktır

ilurl = yine aynı yöntemle ayrılarak şehir üzerine tıklandığında gidilecek adresin bir parçasını oluşturacaktır.

Yukarıdaki fonksiyonların ne amaçla oluşturulduğu üzerinde yazılmaktadır. Biz tüm çalışmanın oluşumunu bir örnekle anlatalım. Fare ile Samsun klibi üzerine geldiğimizde hangi fonksiyonlar çalışır ve neler olur bunu inceleyelim. Samsun klibi üzerine geldiğimizde bu klibe atanan rollOver kodları çalışır:,

y = new String(_name); klibin adı x55 olduğundan y değeri x55 olur.
a = y.slice(1, 3); y değişkeninin 2. ve 3. karakteri a değişkenine atandığından a=55 olur.
_parent.rbtxt(a);parent klibin bir üst seviyesini tanımlamak için kullanılır.(yani harita klibinin timeline`ını).55 olan a değeri rbtxt fonksiyonuna gönderilir ve bu fonksiyon çalıştırılır. Fonksiyon çalıştırıldığında:(fonksiyonun tamamı üstte yazılmıştır)

var Register_1_ = a; yani Register_1_ değeri 55 olur.(Çünkü klipten bu değer gönderilmişti.)
arbtxt = ilad.split(","); komutu ile en üstte yazılan isimler dizi haline getirilir.
balon.txt.text = arbtxt[Register_1_]; Sahne dışına eklediğimiz balon klibi içindeki txt adlı dinamik metin kutusuna arbtxt[Register_1_]; dizisinin adı yazdırılır. Register_1_ a değerine yani 55 e eşit olduğundan dizinin 55. elemanı olan Samsun adı dinamik metin kutusuna yazdırılır, diğer kodlarla da x ve y koordinatı ayarlanarak klibin adı kullanıcya gösterilmiş olur.Register_2_[("x" + Register_1_)].play(); bunun açılımı this.x55.play(); şeklindedir ve doğal olarak klip renk değişimi efekti verecektir.

Fareyi klip üzerinden çektiğimizde rollOut kodları çalışır. balon._visible = false; balon klibi yani yazı kaybolur ve this[("x" + a)].gotoAndStop(1); yani this.x55.gotoAndStop(1) ile klip eski rengine döner.

Son olarak fareyi tıkladığınızda çalışacak fonksiyon grubu:

function rpress(a) {
arburl = ilurl.split(",");
getURL(arburl[a] + ".html", "_blank");
}

a değerini 55 kabul etmiştik. Yine diğer fonksiyon gibi arburl adlı bir diziye split metodu ile bölünen ilurl isimleri atanır. arburl[a] + ".html" kodu şunu tanımlar arburl dizisinin 55. elemanını çağırır.Biz bunu samsun olarak yazdığımızdan o değer döner ve .html ile birleşerek şu adresi verir. samsun.html. Yani açılım:

getURL("samsun.html", "_blank"); olur. Ve bu sayfa blank olarak açılır. İstanbul tıklanırsa istanbul.html sayfası açılır.

ÖNEMLİ NOT: Sayfayı editlerken yani her tıklandığında açılacak şehir detaylarını gösteren sayfaların ismini üstte anlattığım nedenlerden dolayı ilurl değişkenindeki isimlerle aynı olmasına dikkat etmelisiniz. Örneğin Adıyaman ili tıklandığında açılacak sayfanın adı adiyaman.html , Elazığ için elazig.html şeklinde olmalıdır. Başka isimler yazılırsa anlatılan nedenlerden dolayı sayfa açılmayacaktır.

Uygun kodlama aşağıdaki gibidir:

Harita klibinin 1.karesinde bir seri gerek olmayan kod grubu vardır.Özellikle kullanılan split komutu flash`ı zorlayan komutlardandır ve amacı bir string`den aradaki bir ayraçı (burada virgül kullanıldı) kullanarak dizi yaratmaktır .O halde stringi yazmadan ve split komutunu kullanmadan ve gereği olmayan fazladan değişkenleri atarak (Register_1_ ,Register_2_, arbtxt ,arburl gibi) daha temiz bir kod grubu oluşturulabilir.1.karedeki kodları aşağıdakilerle değiştirip kullanabilirsiniz:

//Etiket için şehir isimleri
ilad =["","Adana","Adıyaman","Afyon",.........diğer 80 şehir adınıda girmelisiniz...............];
//Sadece 3 şehir yazılmıştır virgülden sonra diğer şehir isimlerini de eklemelisiniz

//Gidilecek adres için şehir isimleri
ilurl =["","adana","adiyaman","afyon",.........diğer 80 şehir adınıda girmelisiniz...............];
//Sadece 3 şehir yazılmıştır virgülden sonra diğer şehir isimlerini de eklemelisiniz

//Buton üzerine gelince çalışacak olan fonksiyon
function rbtxt(a) {
balon._visible = true;
balon.txt.text = ilad[a];
this[("x" + a)].play();
balon._x = this[("x" + a)]._x;
balon._y = (this[("x" + a)]._y - this[("x" + a)]._height / 2) - 25;
}

//Buton üzerinden ayrılınca çalışacak olan fonksiyon
function rbalon(a) {
balon._visible = false;
this[("x" + a)].gotoAndStop(1);
}

//Butona tıklanınca çalışacak olan fonksiyon
function rpress(a) {
getURL(ilurl[a] + ".html", "_blank");
}


Son olarak bu kod grubunda dizi içinde gördüğünüz ilk karakter olan "" ve yukarıda çalışmayı hazırlayan otörün eklediği a karakterinin nedeni şudur. Dizilerde ilk karakterin indexi sıfırdan başlar. Şehir plakalarını esas aldığımızdan kodlama 1 den başlamaktadır.Bu nedenle ilk karakter hatalı okuma olmaması için boş bırakılmıştır veya a gibi kullanılmayan bir karakter eklenmiştir.
Bu mesajdan alıntı yap
Sponsor Links

Grafikerler.net Reklamları

PatriotMan isimli Üye şimdilik offline konumundadır

PatriotMan

Eğitimci / Hakkari

Standart
Alt 04-01-2011 #2
                             Sponsorlu Bağlantılar
fla dosyasından bahsetmişsiniz ama ben göremedim. yanlış yere mi bakıyorum acaba?
Bu mesajdan alıntı yap
aksak210 isimli Üye şimdilik offline konumundadır

aksak210

Grafiker / Mardin

Standart
Alt 22-02-2011 #3
actionscprt kaçda yazılı bu kodlar...3 mü 2mi..
Bu mesajdan alıntı yap
siir-delisi isimli Üye şimdilik offline konumundadır

siir-delisi

Hiç Biri / Yurtdışı

Standart
Alt 28-02-2011 #4
actionscprt kaçda yazılı bu kodlar...3 mü 2mi..
Aktion olaylarini Actionscript 3 addEventListener ile kullanmaya basladi.
Olsa olsa AS 2 olabilir.

Bende AS3 mi diye baktim yada katkim olabilirmi diye ama AS3 degilmis, en azindan birseyler ögrenirdik hem yeni ögrendiklerimizi unutmamak icin faydasi olurdu.
Bu mesajdan alıntı yap
l3ykinq isimli Üye şimdilik offline konumundadır

l3ykinq

Webmaster / Niğde

Standart
Alt 09-03-2011 #5
Fla Dosyasından Bahsetmisin Kardesim dQqru yeRDeSin ; Fla Dosyası Swf Dosyasının Editlenebilir halidir. Düzenlenebilir yani Kolay Gelsin
Bu mesajdan alıntı yap
Cevapla

Benzer Konular
Konu Konu Bilgileri Forum Cevaplar Son Mesaj
Türkiye Haritası benden Corel Draw 52 08-03-2013 11:43:49
türkiye karayolları haritası yasemin özbek Corel Draw 7 13-08-2009 14:27:42
Ayrıntılı türkiye haritası mecbey Corel Draw 2 15-01-2009 15:54:15

Kapat
Şifremi Unuttum?