Macromedia Flash 8 (Ders 6)

Flash Belgelerini Etkileşimli Hale Getirmek

Etkileşim çok geniş kapsamlı bir kavramdır. En temel seviyede düşündüğümüzde bir şeyleri etkileşimli hale getirmek, insanların sizin oluşturduğunuz uygulamada gerçekleşen olaylara, bir düğmeye tıklayarak, bir şeyler yazarak ya da herhangi bir şekilde cevap verebilmesini sağlamaktır. Kullanıcılar uygulamanızda birtakım işlem yapar (bir öğeyi başka bir öğenin üzerine sürüklemek ya da klavyedeki bir tuşa basmak gibi) ve uygulamanız onların bu yaptığına cevap verir. Tabii ki etkileşimle ilgili çok daha karmaşık kavramlar da mevcuttur, ama çoğu durumda uygulamanıza kullanıcıların uygulama içinde yaptıkları işlemlere cevap verme yönünde talimat vermeniz fazlasıyla yeterlidir.

Macromedia Flash’ta etkileşim özellikleri oluşturmak için en çok kullanılan öğeler düğmeler, movie clip’ler ve metin alanlarıdır. Flash’taki düğmeler, kullanıcı tarafından tetiklenen fare ve klavye olaylarına cevap verirler. Movie clip’ler, kullanıcı tarafından başlatılan etkileşim olaylarına ya da sunucu tipindeki etkileşim olaylarına (veri yükleme gibi) cevap verebilirler. Metin alanları kullanıcılardan bilgi almak, kullanıcılara belirli bilgileri göstermek veya bunların her ikisi için de kullanılabilir. Amaç ne olursa olsun, sizin oluşturacağınız hemen her Flash 8 uygulaması bu öğelerin üçünü de kullanacaktır.

Etkileşim özellikleri eklemek için ActionScript kodu yazmanız gerekmez. İster inanın, ister inanmayın, ama gerçekten de müthiş bir programcı olmanız gerekmiyor. Bilginiz ne kadar fazlaysa, gelişmiş uygulamalar yaratmak için o kadar donanımlı olacağınız aşikâr; bununla birlikte Flash 8’in, etkileşim özellikleri eklerken işinizi çok kolaylaştıran (ama öncesinde ciddi bir planlama safhası gerekir) bazı yerleşik araçlara sahip olduğunu da aklınızdan çıkarmayın. Bu yerleşik özellikler, belirli öğelere hemen ekleyebileceğiniz hazır ActionScript kodları olan davranışlar ve Script Assist şeklinde karşınıza çıkmaktadır. Script Assist, ActionScript panelinde bulunan ve ActionScript konusunda her şeyi öğrenmeye gerek kalmadan daha karmaşık eylemler eklerken kullanılan bir özelliğidir.

Davranışlar

Davranışlar (behaviors), bir panelin içinde organize edilen ve ActionScript’in en çok kullanılan bazı uygulamalarından oluşan bir koleksiyondur. Panelin adı Behaviors panelidir. Garip, ama gerçek. Çok doğru bir şekilde adlandırılan bu panelde; Web sayfalarını açan, movie clip Timeline’larını kontrol eden, JPEG resimlerini ya da SWF dosyalarını movie clip örneklerine yükleyen ve sesleri kontrol eden çeşitli davranışlar yer alır. Bu davranışlar doğrudan panel kullanılarak eklenir ve panel, davranışın tetiklenmesini sağlayan olayı değiştirmenize imkân sağlar. ActionScript konusunda uzmanlaştıktan sonra kendi davranışlarınızı oluşturabilir ve bu panele ekleyebilirsiniz. Ama bu aşamaya gelene kadar üçüncü parti şirketlerin ve Flash kullanıcılarının oluşturduğu davranışları indirip yükleyebilirsiniz. Bahsettiğimiz bu üçüncü parti davranışlarla ilgili en iyi kaynaklardan biri Adobe Macromedia Exchange’dir.

İki yere davranış ekleyebilirsiniz: bir Timeline’daki a ’daki anahtar karelere ya da doğrudan movie clip, düğme ya da bileşen örneklerine (bundan sonra hepsine müşterek olarak nesne diyeceğiz). Kendisine davranış eklemek üzere bir nesne (bir nesne ya da Timeline’da bir anahtar kare) seçtiğinizde, Behaviors paneli, seçilen nesneyi gösterecektir. Böylece ilgili davranışı yanlışlıkla başka bir nesneye eklemeniz engellenmiş olur. Ekleyebileceğiniz davranışlar, seçilen öğeye bağlı olarak farklılık gösterir.

İpucu: B ehaviors panelindeki davranışların birçoğu, geliştirici ya da tasarımcının onları doğrudan nesne örneklerine ekleyeceği düşünülerek oluşturulmuştur. Başlangıç için bu yaklaşım doğru görünse de, bütün ActionScript kodlarını Timeline’daki bir anahtar kareye eklemek genelde daha iyi bir yaklaşım olarak kabul edilir; çünkü bu yöntemde, hata yapmanız durumunda sorunlu öğeleri bulmak ve sorunu gidermek daha kolaydır. Bu yaklaşımla ilgili ayrıntılı bilgiyi 9. Ders’te inceleyeceğiz.

Şimdi göreceğimiz birkaç uygulamada uygulamanıza temel etkileşim özellikleri eklemek için davranışların nasıl kullanıldığı anlatılmaktadır. Önce, sabit diskinizden Flash uygulamanıza anında bir JPEG resmi yükleyen bir davranış, sonra da movie clip Timeline’larını kontrol eden bazı davranışlar ekleyeceksiniz.

Davranışları Kullanarak Bir JPEG Resmi Yüklemek

Bir resmin dinamik olarak yüklenmesi, Flash’ta anlamanız gereken en önemli özelliklerden biridir; çünkü ürün kataloglarını, fotoğraf galerilerini, vb. öğeleri görüntülemek için resimlerden sıkça faydalanılır. Resim boyutları genelde büyük olduğundan, fotoğraf galerilerinizi ya da ürün kataloglarınızı görüntülemek için ihtiyaç duyduğunuz resimler Flash uygulamanızın büyümesine sebep olacaktır. Buna bir de resimlerin sıralanmasında çoğunlukla kullanıcıyla girilen birtakım etkileşimlerden faydalanıldığını düşünecek olursak (bazı resimler görüntülenirken diğerlerinin görüntülenmemesi gibi), sonuçta uygulamanızın boyutu ciddi şekilde büyüyebilir. Resimleri harici olarak saklamak ve sadece gerektiğinde yüklemek bu sorunu çözecektir. Ayrıca bu yaklaşım, Flash dosyanızın, kolayca güncellenebilen ve değişen ihtiyaçlara göre yeniden şekillendirilebilen bir yapıda olmasını sağlar, çünkü görsel içeriğinizin büyük bir kısmı harici olarak depolanmaktadır. Flash 8’in hem Basic, hem de Professional sürümü JPEG, PNG ve GIF formatındaki resimleri çalışma zamanında (yani SWF tarayıcıya yüklendiğinde ve çalıştığında) dinamik olarak yükleyebilir.

İpucu: Flash 8 Basic, standart JPEG’lerin dışında, ilerlemeli (progressive) JPEG’leri de yükleme becerisine sahiptir. İlerlemeli JPEG’ler, yüklenirken görüntülenmeye başlar. Bu, son kullanıcıya uygulamada neyle karşılaşacağı konusunda ipucu verir.

ActionScript kullanarak bir JPEG, GIF ya da PNG resmi yüklerken, görüntülenmesi için resmi bir şeyin içine yerleştirmeniz gerekir. Resmi ana belgenin Timeline’ına yükleyemezsiniz, çünkü Timeline yeni yüklenen resim yüzünden diğer tüm içeriği atmaya çalışır. Bu işlemi yapsanız bile resim Flash belgesinin sol üst köşesinde görüntülenir, ancak konumu değiştirilemez; çünkü resimler ActionScript nesneleri değildir ve bu yüzden kontrol edilemez. Bu kural dinlemeyen resimleri kontrol edebilmeniz için onları ayrı ayrı movie clip örneklerine yüklemeniz gerekir. Bu arada, bahsettiğimiz bu örnekleri adlandırmanız gerektiğini de unutmayın. Movie clip’ler, düğmeler, bileşenler ve görünmeyen ActionScript nesneleri (bu nesneleri Ders 9’da kullanacaksınız) örnek isimleri alabilirler. Bu isimler, yukarıda bahsettiğimiz nesnelerin kontrol edilmesinde büyük önem taşırlar.

İpucu: JPEG, GIF ya da PNG resimlerini Loader bileşenlerine de yükleyebilirsiniz. Ders 9’da bazı PNG resimlerini Loader bileşen örneklerine yükleyeceksiniz.

Bu uygulamada göreceğiniz gibi, Flash belgenize yerleştirdiğiniz movie clip ve düğme sembollerinin hedef olarak kullanılması için örnek isimlerine ihtiyaç vardır. Herhangi bir amaçla bir ActionScript kodu eklediğinizde Flash’ın hangi nesneyi yöneteceğini anlaması için, movie clip örneklerine isim vermeniz gerekir. Örneklere isim vermek için Properties denetçisindeki <Instance Name> alanını kullanabilir ya da davranışları eklerken bir örnek ismi verebilirsiniz. Bununla birlikte, örneklere Properties denetçisinde isim vermenin daha iyi bir yaklaşım olduğunu hatırlatalım. Çünkü davranış eklerken bir öğeye örnek ismi vermek, ancak başlangıçta adlandırmayı unutmanız durumunda kullanabileceğiniz bir yaklaşımdır. Aşağıdaki uygulamada, bir movie clip’e bir resim dosyası yükleyebilmek için bu movie clip’e bir örnek ismi vereceksiniz.

1.bookstore9.fla dosyasını açın ve bookstore10.fla adıyla dosyanın yeni bir sürümünü kaydedin.

Dosyanın yeni sürümünü sabit diskinizdeki TechBookstore klasörüne kaydedin.

2.Macromedia Press logosunu TechBookstore klasörünüze kopyalayın.

mmpresslogo.jpg dosyasını, burada gereken bir davranışı yüklemek için kullanacaksınız. Resmi TechBookstore klasörünüzün kök dizinine yerleştirmeniz bu uygulamada işinizi kolaylaştıracaktır. Ama gerçek uygulamalarda, dizin yapınız geliştirme işlemlerini yaptığınız bilgisayardan Web sunucunuza doğru
olacak şekilde yapılandırıldıysa bu dosyayı istediğiniz klasöre yerleştirebilirsiniz.

3. Pages katman klasöründeki home katmanını seçin ve Stage’de yeni bir dikdörtgen oluşturun. Dikdörtgeni bir movie clip’e dönüştürün ve ona bir örnek ismi verin.

Timeline’daki pages katman klasöründe yer alan home katmanını seçin. Oynatım kafasının 1 numaralı karede olduğundan emin olun. Tools panelinden Rectangle aracını seçin ve dış hat rengini No Color ve dolgu rengini de siyah (#000000) olarak ayarlayın. Stage’de bir dikdörtgen çizin ve Properties denetçisini kullanarak bunun boyutlarını, genişliği 128 piksel, yüksekliği de 96 piksel olacak şekilde ayarlayın.

ve Properties denetçisini kullanarak bunun boyutlarını, genişliği 128 piksel, yüksekliği de 96 piksel olacak şekilde ayarlayın. Oluşturduğunuz dikdörtgene çift tıklayın ve F8 tuşuna basarak bunu bir sembole dönüştürün. Sembolü mcMMPressLogo olarak adlandırın ve ardından Movie clip radyo düğmesine tıklayın. Sembolün kayıt noktasını (registration point) sol üst köşe olarak ayarlayın (ızgarada sol üst siyah kareye tıklayın) ve OK düğmesine tıklayın. Properties denetçisini kullanarak yeni movie clip’e mmPressLogo örnek ismini verin. Movie clip’i aşağıdaki resimde gösterildiği şekilde Stage’in sağ alt köşesine yakın bir konuma taşıyın.


İpucu: Movie clip’in örnek ismi ile kütüphane ismi aynı şey değildir. Örnek ismi, ActionScript’in Stage’deki ’deki bir nesneye göndermede bulunabilmek için ihtiyaç duyduğu bir öğedir. Kütüphane ismini ise, belgenizin bileşenlerini organize etmek için kullanırsınız.

Bu movie clip’i, SWF dosyası çalışırken dinamik olarak yükleyeceğiniz resim için bir içerik nesnesi (container) olarak kullanacaksınız. Siyah resim, mmpresslogo.jpg resmi ile değiştirilecektir, dolayısıyla burada asıl içerik için bir yer tutucu görevi üstlenecektir. Böylece onun nereye yerleştirileceğini bilirsiniz.

4. Timeline’a actions isminde yeni bir katman ekleyin ve her sayfa için anahtar kareler ekleyin.

labels katmanını seçin ve Insert New Layer düğmesine tıklayın. Yeni katmana actions ismini verin. Bu katman, Timeline’daki katman yığınında en üst sırada yer alacaktır. Katmanı oluşturduktan ve buna bir isim verdikten sonra, her bir etiketin üzerindeki kareyi seçin ve sonra da aşağıdaki resimde de gördüğünüz gibi F6 tuşuna basarak yeni bir anahtar kare ekleyin. Sayfaların her birine ait eylemler buraya yerleştirilecektir. Şu an için sadece home sayfasındaki eylemlerle ilgileniyoruz.


5. mmpresslogo.jpg resmini SWF dosyasına yüklemek için, Add (+) menüsünü kullanarak bir davranış ekleyin.

Davranışları iki yere ekleyebilirsiniz: Bir anahtar kareye ya da örneğin kendisine.
Ekleyebileceğiniz davranışlar seçtiğiniz öğeye bağlıdır. Örneğin bazı davranışlar karelere eklenemez, dolayısıyla bunları kullanamazsınız. Diğer davranışlar sadece düğmelerle ilişkilendirilebilir. Add Behavior (+) menüsü düğmesine basıp açılır menüleri ve kayar menüleri kullanarak neleri ekleyebileceğinizi görebilirsiniz.


Davranışlar kategorilere göre düzenlenmiştir. Add Behavior düğmesine bastığınızda bu kategorilerin görüntülendiği seçeneklerden oluşan bir menüyle karşılaşırsınız. Harici bir resim yüklemek, movie clip’lerin farklı bir özelliğidir; dolayısıyla, kullanmak istediğiniz davranış Movieclip kategorisinde yer alır.

actions katmanındaki 1 numaralı kareyi seçin ve Behaviors panelini açın. Bu panel açık değilse, Window (Pencere) > Behaviors (Davranışlar) komutunu seçin. Kare 1 seçili durumdayken, Behaviors panelindeki Add Behavior düğmesine tıklayın ve Add Behavior menüsünden Movieclip > Load Graphic’i seçin.

Load Graphic iletişim kutusunda, üstteki metin alanına assets/mmpresslogo.jpg yazın ve kullanılabilir durumdaki örnekleri listeleyen iki metin alanının altında bulunan ağaç yapısından mcMMPressLogo movie clip’ini seçin. Relative radyo düğmesine tıklayın. Bu düğme, SWF dosyasının dışındaki resmin hedeflenmesi için kullanılan adres türünü belirtir. Sonuçta hangi resmin yükleneceğini ve yüklediğinizde bu resmin nereye gideceğini belirtiyorsunuz. Bunun dışında şu anda ince ayrıntılar konusunda endişelenmenize gerek yok. Örneklerin mutlak (absolute) ve göreceli (relative) olarak adreslenmesi konusunu Ders 9’da göreceğiz. OK düğmesine tekrar
tıklayarak ana Stage’e geri dönün.


6. Belgede yaptığınız değişiklikleri kaydedin.

Bu aşamada bu işlevselliği etkin bir biçimde test edemezsiniz, çünkü Timeline’ın ilk karenin ötesine gitmesini engelleyen ActionScript kodunu eklemediniz. FLA dosyasını bu dersin ilerleyen bölümlerinde test edecek ve Behaviors panelinin sizin yerinize eklediği ActionScript kodunu inceleme fırsatını bulacaksınız.
Devam etmeden önce File > Save komutunu seçerek değişiklikleri kaydedin.

Bir Web Sayfasını Açmak için Davranışları Kullanmak

Önceki uygulamada bir davranış kullanarak harici bir JPEG resmini yüklemeyi öğrendiniz, ancak bu işlemin başarıyla sonuçlanıp sonuçlanmadığını henüz kontrol etmediniz. Bu uygulamada, bir Web sayfasını yeni bir tarayıcı penceresinde açmak için Flash’taki davranışlardan birini nasıl kullanacağınızı göreceksiniz. Burada davranışı Timeline’daki bir kare yerine doğrudan bir movie clip örneğine ekleyeceksiniz. Buna bazen nesne eylemi de denir.

Bu uygulamada da bookstore10.fla dosyasını kullanacaksınız.

1. Ana Stage’de olduğunuzdan emin olun, sonra da home katmanındaki 1 numaralı kareyi seçin

Selection aracını kullanarak, bir önceki uygulamada oluşturduğunuz mcMMPressLogo örneğine tıklayın. actions katmanındaki 1 numaralı karede, bu örneğe göndermede bulunan bir eylem yer alır. Fakat siz bir movie clip’in kendisine bir eylem yerleştireceksiniz ve kullanıcı buna tıkladığında bir Web sayfasının çalıştırılmasını sağlayacaksınız.

2. Behaviors panelini kullanarak, doğrudan mcMMPressLogo movie clip’ine bir davranış ekleyin.

mcMMPressLogo seçili durumdayken, Behaviors panelindeki Add Behavior düğmesine tıklayın ve menüden Web > Go to Web Page (Web Sayfasına Git) komutunu seçin. Go to URL (URL’e Git) iletişim kutusu açılacak ve burada hedef seçenekleri görüntülenecektir: _self, _parent, _blank ya da _top. Bu seçeneklerin her biri HTML’deki karşılığının aynısıdır. Buradaki değeri _blank olarak değiştirin.

3. Go to URL iletişim kutusunda davranış için hedef URL’i ayarlayın

Hedef URL’i yeniden yönlendirilecek şekilde ayarlamak için, URL metin alanındaki varsayılan değerin yerine istediğiniz hedefi yazmanız yeterlidir. Bu uygulama için hedef URL’i https://www.peachpit.com olarak ayarlayın. URL’i yazdıktan sonra OK düğmesine tıklayarak Stage’e geri dönün.


Not: Başka bir alan adında yer alan bir Web sayfasına gitmeye çalışıyorsanız, Go to URL iletişim kutusunda URL’in başına https:// eklemeyi unutmayın. Yeni tarayıcılar hepimizi tembelleştirdi, çünkü artık bir Web sayfasına gitmek için adres penceresine https:// yazmamız gerekmiyor. Eğer başka bir sayfaya giden bir bağlantı tanımlayacaksanız, kullanılacak protokolü kesinlikle belirtmeniz gerekir. Burada Hypertext Transfer protokolünü kullanacaksınız.

4. Behaviors panelini kullanarak davranışın tetikleyici olayını değiştirin.

Stage’deki mcMMPressLogo örneğine tıklayın. Behaviors panelini açıp bazı ayarları değiştirerek davranışın ne zaman çalışacağını belirleyebilirsiniz. Behaviors panelini açın ve Add Behavior ile Delete Behavior düğmelerinin altındaki Event ve Action listelerine bakın.


Go to Web Page eyleminin solundaki alanda On Release yazısına tıklarsanız, açılır listede bu davranışı tetikleyen olayların listesini görebilirsiniz. Varsayılan olarak burada On Release olayı (kullanıcının imleç mcMMPressLogo movie clip’inin üzerindeyken farenin tuşuna basıp bırakacağı anlamına gelir) seçili durumdadır. Açılır listeden yeni bir değer seçebilir ve kullanıcı imleci örneğin üzerine getirdiğinde ya da imleç örnekten tamamen uzaklaştırıldığında bunun tetiklenmesini sağlayabilirsiniz. Olayın belirli bir tuşa basıldığında tetiklenmesini sağlamanız da mümkündür.

Olayı bir Key Press olayıyla değiştirin. Flash, Peachpit Web sitesini açmak için, bir fare tıklamasının yerine kullanılmak üzere sizden klavyedeki bir tuşa basmanızı isteyecektir. Olayı tekrar On Release olarak değiştirin, çünkü bu, çoğu kişinin alışık olduğu etkileşim türüdür.

5. Behaviors panelini kullanarak davranışın özelliklerini değiştirin. Sonra da OK
düğmesine tıklayarak bu değişiklikleri uygulayın.

Davranışı bir kareye ya da nesneye uyguladığınızda kimi zaman davranışın bazı özelliklerini değiştirmeniz ya da elle girdiğiniz parametrelerdeki yazım hatalarını düzeltmeniz gerekebilir. Neyse ki düzeltmek ya da değişiklik yapmak üzere Behaviors panelini kullanarak istediğiniz zaman davranışa geri dönebilirsiniz.

Davranışta değişiklik yapmak ve kullanıcıyı farklı bir URL’e yönlendirmek istiyorsanız Behaviors panelindeki Actions sütununda ilgili davranışa çift tıklayarak üzerinde değişiklik yapabilirsiniz. Siz bu işlemi yaptığınızda URL’i ayarlamak için kullandığınız iletişim kutusu açılacaktır. İstediğiniz değişiklikleri yapın ve OK düğmesine tıklayın.

İpucu: Davranışın eklediği ActionScript kodunu doğrudan Actions panelinde de düzenleyebilirsiniz. Şu ana kadar Actions panelini fazla kullanmadınız, ama henüz temel ActionScript konularını öğrenmediğiniz için bunu yapmanızı pek tavsiye etmem. Ancak konuyla ilgili biraz daha bilgi sahibi olduktan sonra bir davranışın çalışma şeklini değiştirmek için bunun bazı durumlarda kullanılabilecek en akıllıca alternatif olduğunu belirtmeliyim.

Bileşen Kullanarak Harici Bir SWF Dosyası Yüklemek

Önceki uygulamada Flash 8 Basic’in çalışma zamanında SWF dosyalarına JPEG (ya da tercihe göre GIF veya PNG) dosyalarını anında (ya da dinamik olarak) yükleme özelliğine sahip olduğunu gördünüz. Flash, JPEG resimleri yüklemeye ek olarak movie clip’lere başka SWF dosyalarını da anında yükleyebilir. Normal kullanım şeklinde bir Flash uygulaması, kullanıcı talep ettiğinde yüklenen birçok SWF dosyasına bölünür ve her SWF dosyası özel bir içerik kategorisine sahiptir. Resimlerin hariç olarak tutulması gibi, Flash uygulamasını gerektiğinde yüklenen küçük modüllere bölmek, uygulama dosyanızın boyutunu kontrol edebilmenizi sağlar ve içeriğin güncelleştirilmesini kolaylaştırır. Daha küçük içerik modülleri kullandığınızda, bütün uygulama yerine sadece değişen SWF dosyasını güncellersiniz. JPEG resimleri gibi, içerik amaçlı kullanılan bu daha küçük SWF dosyaları movie clip’lere yüklenebilir. Bununla birlikte, Flash 8’de bu süreci kolaylaştıran (çünkü bileşeni belgenize, gidip harici SWF dosyasını ya da JPEG resmini almasını söyleyen bir davranış ya da ActionScript kodu eklemeksizin dâhil edebilirsiniz) özel bir yerleşik bileşen bulunur. Bu bileşen Loader bileşeni olarak bilinir.

Loader bileşeni, SWF dosyalarını ya da JPEG, PNG veya GIF resimlerini bir SWF dosyasına herhangi bir ActionScript kodu yazmanıza ya da herhangi bir davranış eklemenize gerek kalmadan kolayca gömmenizi sağlar. Yapmanız gereken tek şey, Loader bileşeninin bir örneğini Stage’in üzerine sürüklemek ve bileşen Stage’in üzerine geldikten sonra Properties denetçisindeki contentPath isimli özel bir parametrede değişiklik yapmaktır. Bu parametre, bileşene, yüklenecek harici verinin nereden alınacağını söyler. Bileşen SWF dosyasında tümüyle oluşturulduktan sonra kendisine bir şey söylenmeden gidip harici içeriği alacak ve sonra da onu görüntüleyecektir. Tabii ki bu sürecin gerçekleştiği zamanla ilgili olarak ince ayar yapmanız gereken durumlarda harici içeriği alma işlemini ActionScript kullanarak kontrol edebilirsiniz.

Not: Loader bileşeni, harici SWF dosyalarını ya da JPEG resimlerini yükleme işlemini kolaylaştırır. Bununla birlikte bir dezavantajı vardır: Dosya boyutunu 25 KB kadar büyütür. Bu bileşeni, uygulamanızın boyutunu daha fazla büyütmeden tekrar tekrar istediğiniz kadar kullanabilirsiniz.

Bu uygulamada, Ders 2’de oluşturduğunuz SWF dosyasını Loader bileşenine nasıl yükleyeceğinizi öğreneceksiniz. Yani Ders 2’de oluşturduğunuz map.swf dosyasını SWF dosyasına yüklemek için Loader bileşenini kullanacaksınız.

1. map katmanının 60 numaralı karesini seçin ve Stage’e bir Loader bileşeni ekleyin.

Ana Timeline’da map katmanının (map etiketine sahip katman) 60 numaralı karesini seçin. Bu kare bir anahtar karedir ve daha önceki uygulamalarda oluşturduğunuz ve Stage’e yerleştirilmiş bulunan iki metin alanı (adres ve harita başlığı için) içermektedir.

Components panelini açın, User Interface kategorisini genişletin ve Loader bileşenini bulun. Bileşenin bir örneğini Stage’in üzerine sürükleyin.

2. Loader bileşenini seçin, sonra da Properties denetçisinde bulunan bileşen
parametrelerine bakın.

Stage’de Loader bileşeninin örneğini seçin ve Properties denetçisini açın. Properties denetçisinde Parameters (Parametreler) sekmesine geçin. Tün bileşenler, değiştirilebilir parametrelere sahiptir (bu konunun jargonuna alışık olmayanlar için bunları, üzerinde değişiklik yapılabilen öğeler olarak tanımlayabiliriz). Loader bileşeninin böyle üç parametresi vardır:

• autoLoad: Bu parametre, içeriğin otomatik olarak mı yükleneceğini, yoksa yüklenmesi için içeriğin ActionScript koduyla açık olarak tetiklenmesinin mi gerektiğini belirler. true değeri içeriğin otomatik olarak yükleneceğini; false değeri de yüklenebilmesi için onu tetiklemeniz gerektiğini belirtir.

• contentPath: Bu metin alanına girilen metin, bileşene yüklemek istediğiniz SWF dosyasının ya da JPEG, GIF veya PNG resminin yolunu ayarlar.

• scaleContent: Bu parametre, içeriğin bileşenin büyüklüğüne uyacak şekilde ölçekleneceğini (true) ya da bileşenin içeriğin büyüklüğüne göre ölçekleneceğini (false) belirtir.


İpucu: B ileşenleri kontrol etmek ve bunlarda değişiklik yapmak için Component Inspector (Bileşen Denetçisi) panelini de kullanabilirsiniz. Window > Development Panels > Component Inspector panel komutunu seçerek Component Inspector panelini açın. Değiştirebileceğiniz şeyler, kullandığınız bileşene bağlıdır; bununla birlikte, değiştirilebilir tüm seçenekler Parameters sekmesinde listelenmiştir. Bindings ve Schema sekmeleri bu derslerde ele
alınmamıştır.

3. Properties denetçisinde, Loader bileşeninin örneğiyle ilgili parametreleri ayarlayın.

Bu bileşene map.swf dosyasını hemen yükleyeceğiniz için, autoLoad parametresini true olarak ayarlayın ve sonra da contentPath metin alanına map.swf yazın.

Not: map.swf dosyasını bookstore10.fla dosyasının bulunduğu klasöre değil de başka bir klasöre kaydettiyseniz, dosya yolunu değiştirmeniz, göreceli bir URL kullanmanız gerekir. Yani dosyaları daha düzenli tutmak amacıyla belirli dosyaları başka dosyaların içinde saklayabilirsiniz.

Stage’de bileşenin büyüklüğünün harici SWF dosyasının büyüklüğüne uyacak şekilde değiştirilmesini sağlamak için, scaleContent parametresini false olarak ayarlayın.

4. Bileşeni map.fla dosyasıyla aynı büyüklükte olacak şekilde ayarlayın, sonra da bunun Stage’deki konumunu ayarlayın.

Bileşen seçili durumdayken Properties denetçisini açın. W (genişlik) değerini 500, H (yükseklik) değerini de 355 olarak ayarlayın.

Aşağıdaki resimde de gördüğünüz gibi, haritanın How to find us metin alanının altına, kitap mağazasının sloganının ve sayfa başlığının da sağ kenarına gelecek şekilde hizalanması gerekir.


Bileşeni Stage’de hizalamanıza yardımcı olacak kılavuzlar muhtemelen hala görünür durumdadır. Açılır menülerin haritanın üzerine gelmemesi için bunların altında yeterince boşluk bırakmayı unutmayın. Haritanın, dikey cetvelin 140 koordinatında bulunan yatay kılavuza hizalı ya da (tercihen) bunun altında olduğundan emin olun.

Not: Kendi oluşturduğunuz yerleşim düzeninde “How to find us” metin alanını başka bir konuma taşımanız gerekebilir.

5. Dosyada yaptığınız değişiklikleri kaydedin.

Bir sonraki kısımda FLA dosyasına başka ActionScript kodları eklemeye başlayacaksınız. Ayrıca bundan sonraki derslerde Loader bileşenlerinin başka örneklerini de kullanacaksınız. Şu anda TechBookstore Web sitesinin harita kısmına yüklenen içeriği göremezsiniz. Fakat siz Ders 9’da dosyayı test ederken içerik görünecektir. Eğer görünmezse contentPath parametrenizi kontrol etmeniz ve doğru ayarlandığından emin olmanız gerekir.

Script Assist’i Tanıyalım

ActionScript’in daha karmaşık özelliklerine geçmek üzere davranışların güvenli dünyasını terk etmek üzeresiniz. Ama paniğe kapılmayın, çünkü sizi doğrudan bu dilin derin sularına bırakmayacağız. Şimdiki birkaç uygulamada Script Assist’le yine karşılaşacaksınız ve Script Assist ActionScript dünyasında sizin kılavuzunuz ve yol arkadaşınız olacak; en azından ActionScript’e, ’e, onunla tek başınıza çalışacak kadar hâkim olana kadar. Script Assist’i, ActionScript script dilini öğrenirken kullanılan yardımcı tekerlekler gibi düşünebilirsiniz.

Ders 9’da ActionScript’in genel yapısını ve kullanımını öğrenecek, ayrıca Script Assist’i kullanmadan kendi script’lerinizi yazacaksınız. Bu bölümde, ilerlemeden önce bu dille ilgili birkaç noktayı kavramanız gerekiyor. Böylece herhangi bir anda Actions paneline göz attığınızda neler olup bittiğini daha iyi anlayabileceksiniz.

Bazı öğelerin neden bir örnek ismine sahip olmaları gerektiğini öğrenmiştiniz. Örnek isimleri (instence names), sembollere ya da ActionScript nesnelerine ne yapmaları gerektiğini söylerken kullandığınız birer yardımcı araçtır. Örnek isimleri, normal hayatta insan isimleriyle aynı amaca hizmet eder. Bununla birlikte, ActionScript uygulamalarında isimleri bizim seçmemiz gerekir, çünkü iki örnek aynı isme sahip olamaz. Bir oda dolusu çocukla birlikteyken çocuklardan birinden aspirin getirmesini istediğinizi düşünelim. Böyle bir durumda “Çocuk, bana bir aspirin getir!” demezsiniz, çünkü çocuklar içlerinden hangisini kast ettiğinizi bilemez. Onlara isimleriyle hitap etmeniz gerekir. “Suat, bana bir aspirin kap gel!”. Odada Suat adında başka bir çocuk olmadığı sürece Suat, (eğer keyfi yerindeyse) bir oda dolusu çocuğun arasında kafanız şişmiş durumdayken acilen içmeniz gereken aspirini kapıp getirecektir. Uzun lafın kısası, ne yapmaları gerektiğini söylemek için sembolleri ve ActionScript nesnelerini (Sound yani ses nesneleri gibi) adlandırırız.

Adlandırılmış olsun ya da olmasın tüm semboller hayatlarını Timeline’ın üzerinde bir yerde sürdürür. Onlara ne yapmaları gerektiğini söylemek için bir yol kullanmanız, yani ActionScript’e ilgili öğenin nerede olduğunu söylemeniz gerekir. Yollarla çalışırken özel bir yazım şekli olan “Noktalı Yazım”ı kullanırsınız. Diğer bir deyişle, bir öğeyi hedeflerken “/” karakterlerinin yerine “.” karakterlerini kullanırsınız. Örneğin, diyelim ki oturma odasında oturuyorsunuz ve eşinizden (eşinizin o anda bulunduğu) üst kattaki yatak odasında yer alan masanın üstündeki gözlüğünüzü isteyeceksiniz. Gözlüğünüzü istemek için eşinize seslendiğinizde bu durum noktalı yazımla şu şekilde gösterilebilir:

this.ustkat.yatakodasi.masa.es.gozluguAl();

Burada this, başlangıç noktanızı yani oturma odasını gösterir, ustkat, yatakodasi ve masa da yerleri gösterir. es, belirli işlemleri gerçekleştirebilen bir nesnedir (eğer üşengeç biri değilse) ve gozluguAl() ondan gerçekleştirmesini istediğiniz eylemdir. gozluguAl() aynı zamanda metot olarak da adlandırılır. Metotlar, nesnelerin gerçekleştirdiği işlemlerdir. Bu konuyla ilgili ayrıntıları Ders 9’da göreceğiz. Eğer eşiniz yoksa gözlüğünüzü kendiniz almanız gerekecektir. Bu da noktalı yazımla şöyle gösterilebilir:

this.gozluguAl(ustkat.yatakodasi.masa.gozluk);

Bu ikinci örnekte ustkat.yatakodasi.masa.gozluk , gözlüğünüzün bulunduğu yeri gösterir. this anahtar sözcüğü ise burada sizi göstermektedir.

Anahtar sözcükler kler (keywords), Flash tarafından ayrılmış ve ActionScript’te özel bir anlama sahip özel sözcüklerdir. Actions panelinde, bir uygulamanın nasıl çalışacağını kontrol etmek için kendi ActionScript kodlarınızı eklerken belirli sözcüklerinin renk değiştirdiğini göreceksiniz. Sözcüklerin yeni rengi, anahtar sözcüğün ne için kullanıldığına bağlıdır. Bununla birlikte, herhangi bir anda herhangi bir şey renk değiştirdiğinde, bunun sebebi, Flash’ın
bu öğeyi özel görevler için ayırmış olmasıdır. Bu yüzden sembollere ya da ActionScript nesnelerine Flash tarafından ayrılan isimleri (getTimer gibi) vermemeye dikkat etmeniz gerekir. Şimdilik endişelenmenize gerek yok. Bu derste ekleyeceğiniz ActionScript kodları Script Assist kullanılarak eklenecek ve düğmelerle movie clip Timeline’larını kontrol etmek için kullanılacaktır.

ActionScript, Ders 9’da göreceğimiz daha pek çok özelliğe sahiptir. Script Assist ile eklediğiniz ActionScript kodları önceki iki uygulamada eklediğiniz özellikleri test etmenizi sağlayacak ve ayrıca kitabın geri kalanında kullanılan etkileşim özellikleri için bir temel oluşturacaktır.

Timeline’ı Kontrol Etmek İçin Eylemleri Kullanmak

ActionScript, Flash’taki birçok özelliği kontrol etmek için kullanılabilir. ActionScript, ana Flash belgesinin Timeline’ını ya da movie clip sembollerinin Timeline’ının kontrol ederken sıkça kullanılır. Bu uygulamada ana belgenin Timeline’ını kontrol etmek için Actions araç kutusuyla bir eylem ekleyeceksiniz. Bu uygulamada da bookstore10.fla dosyasıyla çalışacaksınız.

1. actions katmanını seçin, sonra da Actions panelini açın.

Yerleşim düzeninde Actions paneli açık değilse, Window > Actions panel komutunu seçerek bu paneli açın. Actions panelini Windows’ta F9, Mac OS X’te Option+F9 klavye kısayollarını kullanarak da açabilirsiniz. Actions panelini genişletin. Bu dersteki ilk uygulamada, Tech Bookstore sitesindeki her bir sayfa için anahtar kareler oluşturmuştunuz. Bu uygulamada da her sayfaya bir stop(); eylemi ekleyeceksiniz.

2. Kare 1’den başlayarak actions katmanındaki anahtar karelerin her birini seçin ve Actions panelini kullanarak stop(); eylemini her bir anahtar kareye ekleyin.

Eğer Actions panelinde Script Assist hala açık durumdaysa Script Assist düğmesine basarak kapatın. stop(); eyleminin çalışması için özel parametrelere ihtiyaç duyulmadığından, bu eylemi Actions araç kutusunu kullanarak ekleyeceksiniz.

Actions panelindeki bütün ActionScript kodlarının en üstünde boş bir satır oluşturun. İmlecinizi boş satıra yerleştirin ve Actions araç kutusunda Global Functions > Timeline Control kategorisini genişletin. Timeline’ınıza stop(); eylemini eklemek için stop’a çift tıklayın. actions katmanında bir sonraki anahtar kareyi seçin ve buna da aynı eylemi ekleyin. stop(); eylemi, bu anahtar karelerden her birine ulaştığında oynatım kafasının durmasına sebep olacaktır. Bu, Tech Bookstore projesinin gezinti özelliklerinden biridir ve bunu Ders 9 ve Ders 10’da gerçekleştireceğiz.


3. FLA dosyasını test edin, sonra da dosyada yapmış olduğunuz değişiklikleri kaydedin.

Ctrl+Enter (ya da Mac’te Command+Enter) tuşlarına basarak belgeyi test ortamında test edin. Kitap mağazasını daha önce test etmiş olsaydınız, SWF dosyası bütün sayfaları oynatacaktı. Bunu şimdi test ettiğinizde, belgenin 1 numaralı karede (home sayfası) durduğunu göreceksiniz. Menü düğmelerini çalışır hale getirdiğiniz ve sitenin sayfalarında dolaşabildiğiniz zaman, gittiğiniz her yeni sayfa, oynatım kafası kareye ulaştığında duracaktır. Ayrıca test ortamındayken SWF dosyasına yüklenen JPEG resmine de dikkat edin. Artık JPEG resmi, daha önceki uygulamada oluşturduğunuz movie clip yer tutucusuna dinamik olarak yüklenecektir.

Not: Henüz sayfaların her birini dolaşamıyorsunuz. Ders 9’da düğmelerin ve menü sisteminin çalışmasını sağlayan ActionScript kodunu ekledikten sonra bunu yapabileceksiniz.

FLA dosyasında yaptığınız değişiklikleri File > Save komutunu seçerek kaydedin.

Bir Giriş Sayfası Düğmesi Oluşturmak

Bu uygulamada, SWF dosyasının Tech Bookstore’un home karesine geri dönmesini sağlayacak olan bir düğme oluşturacaksınız. Ders 4’te oluşturduğunuz görünmez düğmeyi çoğaltacak ve büyük bir logonun üzerine yerleştirerek bir hot spot (aktif nokta) gibi çalışmasını sağlayacaksınız. Görünmez düğmeyi çoğaltmanız gerekiyor, çünkü düğmede, Merge Drawing modunda yamayacağınız büyük bir delik bulunuyor. Orijinal görünmez düğmeyi değiştirmek istemiyoruz, çünkü değiştirdiğimiz takdirde düzgün çalışmayacaktır. Dolayısıyla yapılacak işleri minimuma indirmek için sembolü çoğaltmanız ve yeni kopyayı düzenlemeniz gerekiyor.

1. buttons katmanının üzerine yeni bir katman ekleyin ve bu katmanı home button olarak adlandırın.

buttons katmanını seçin ve bunun üzerine home button isimli yeni bir katman ekleyin. Bu yeni düğmeyi ayrı bir katmana yerleştireceksiniz, çünkü böylece buttons katmanındaki diğer düğmeleri gizlemenize gerek kalmadan bunu kilitleyebilecek ve gizleyebileceksiniz. Bu gerçekten de sadece organizasyon amacıyla yapılan bir işlem ve başka bir anlamı yok.

2. Kütüphanede btnInvisible düğme sembolünü sağ tıklayın (ya da Ctrl tuşunu basılı tutarak tıklayın) ve bağlam menüsünden Duplicate (Çoğalt) komutunu seçin. Yeni düğmeyi btnHotspot olarak adlandırın.

Bir sembolü çoğaltmanın geliştirme sürecini hızlandırmada harika bir yöntem olduğunu Ders 4’ten hatırlayacaksınız. Buradaki örnekte görünmez bir düğme için ihtiyaç duyduğunuz her şey mevcut. Tek yapmanız gereken, düğmedeki delikten kurtulmak. Sembolü çoğaltırken ve yeniden adlandırırken, sembol düzenleme moduna geçmek için sembole çift tıklayın.

3. Sembol düzenleme modunda, düğmedeki deliğin üzerinde bulunan mevcut dolguyla aynı renkte bir dikdörtgen çizin. Merge Drawing modunda olduğunuzdan emin olun.

Sembol düzenleme modunda düğmenizin Hit karesini seçin. Rectangle aracını seçin ve dış hat rengini No Color olarak ayarlayın. Dolgu rengi (Fill Color) kontrolüne tıklayın ve damlalığı şu anda Hit karesinde bulunan dikdörtgenin üzerine getirin. Tıklayarak rengi ayarlayın. Merge Drawing modunda olduğunuzdan emin olun ve grafikteki deliği yamamaya yetecek büyüklükte küçük bir dikdörtgen çizin. Dolgu renkleri birbiriyle eşleştiği için Merge Drawing modu grafiğin tamamını büyük bir dikdörtgene çevirecektir. Ana belgenin Timeline’ına dönmek için Scene 1’e tıklayın.

4. btnHotspot’un bir örneğini home button katmanının üzerine sürükleyin ve bir örnek ismi atayın.

Kütüphaneden btnHotspot’un bir örneğini sürükleyin ve mcLogo’nun üzerine bırakın. Free Transform aracını kullanarak düğmeyi, hem sol üst köşedeki logoya sığacak, hem de “Tech Bookstore” metnini içine alacak şekilde yeniden boyutlandırın.

Tools panelinde Selection aracı vurgulanmış durumdayken, yeni oluşturduğunuz görünmez düğmeye tıklayın ve Properties denetçisini, içinde <Instance Name> yazan metin alanına bir örnek ismi yazabilecek kadar genişletin.


<Instance Name> metin alanının içine tıklayın ve btnHome yazın. Artık ActionScript’i düğmenin Stage’deki bu örneğine göndermede bulunmak için kullanabilir ve düğmeye tıklandığında (bu aynı zamanda olay olarak da adlandırılır) SWF dosyasını belirli bir şekilde yönetmek için kullanılan kodu çalıştırabilirsiniz. Burada, düğmeye tıklandığında kitap mağazasının giriş (home) sayfasına döneceksiniz.

5. Script Assist’i kullanarak, oynatım kafasını home etiketli kareye döndürecek olan ActionScript kodunu ekleyin.

Burada ActionScript kodunu Script Assist’i kullanarak doğrudan düğmeye ekleyeceksiniz. btnHome’u seçin ve F9 tuşunu ya da Option+F9 tuşlarını (Mac) kullanarak Actions panelini açın. Script Assist düğmesine basarak Script Assist moduna geçin. Actions araç kutusunda Global Functions > Timeline Control komutunu seçin ve goto’yu çift tıklayın. Bu işlemi yaptığınızda varsayılan olarak düğmenize bir gotoAndPlay eylemi eklenecektir.

Go To And Stop radyo düğmesini seçerek eylemi değiştirin. Type alanındaki seçeneği Frame Label olarak değiştirin ve Frame açılır listesinden “home”u seçin. Script Assist tüm kare etiketlerinizi otomatik olarak “görür”, bu da eylemi ayarlama işlemini kolaylaştırır. İşiniz bittikten sonra Actions panelinizin görüntüsü aşağıdaki şekildeki gibi olacaktır.


İpucu: Mümkün olan yerlerde kare numaralarının yerine kare etiketlerini kullanmak isteyeceksiniz. FLA dosyalarınız büyüdüğünde ve karmaşık bir hale gelmeye başladığında hangi kare numarasında hangi içeriğin olduğunu hatırlamak daha da zorlaşacaktır. Ayrıca, içeriği taşımanız durumunda kare etiketini yeni konuma taşımak yerine ActionScript kodunuzu değiştirmeniz gerekecektir. Kare etiketlerini kullanmak işinizi kolaylaştırır ve karelere basit bir numara vermek yerine mantıklı isimler vermenizi sağlar.

6. home button katmanını kilitleyin ve gizleyin, sonra da kütüphaneyi temizleyin.

Timeline’da katman isminin yanında bulunan kilit simgesine ve göz simgesine tıklayarak katmanı kilitleyin ve gizleyin. Bu işlem aynı zamanda yanlışlıkla bu katmana başka örnekler eklemenizi ya da görünmez düğmeyi taşımanızı önleyecektir. Ayrıca, Tech Bookstore projesi üzerinde çalışırken görünmez düğmenin mavi rengini gizlemenizi de sağlayacaktır.

Kütüphaneyi mümkün olduğu kadar temiz tutmanız iyi olur. Kütüphanedeki btnHotspot sembolünü buttons klasörüne sürükleyin, mcMMPressLogo sembolünü movie clips klasörüne taşıyın, Loader bileşenini de components klasörüne taşıyın.

7. FLA dosyasında yaptığınız değişiklikleri kaydedin.

Her zaman olduğu gibi, bir sonraki uygulamaya geçmeden önce File > Save komutunu kullanarak yaptığınız değişiklikleri kaydedin.

El Şeklindeki İmleci Yok Etmek

Bir SWF dosyasında imleci bir düğmenin ya da hotspot’un üzerine getirdiğinizde, el şeklinde bir imleç belirir. Genellikle bu imlecin görünmesini istersiniz, çünkü bu imleç SWF dosyasının hangi kısmının etkileşimli ve tıklanabilir durumda olduğunu gösterir. Bununla birlikte, bir açılır listenin görünüp görünmeyeceğini kontrol eden görünmez düğmeler kullandığınızda, bunların üzerinde el şeklinde bir imlecin görünmesini genellikle istemezsiniz, çünkü el şeklindeki imleç, kullanıcılara, tıkladıklarında bir şeyler olacağını belirten bir geri bildirim mekanizmasıdır. Böyle bir durumda kullanıcılar parmakları morarıncaya kadar tıklasalar bile hiçbir şey olmayacaktır. Bu yüzden şimdiki uygulamada, menülerin etrafındaki görünmez düğmede, el şeklindeki imleci yok edeceksiniz. Böylece kullanıcılar orada bir düğme olduğunu anlayamayacak. Bu uygulamada da yine bookstore10.fla dosyasını kullanacaksınız.

1. El şeklindeki imlecin nasıl çalıştığını görmek için FLA dosyasını test edin.

Ctrl+Enter (ya da Mac’te Command+Enter) tuşlarına basarak FLA dosyasını test edin. İmleci bu sitenin üst kısmındaki alanın üzerine getirdiğinizde el şeklinde bir imleç belirir. Bu imleç dikkati dağıtabilir ve düğmenin Web sitesinin ziyaretçileri için aslında görünmez olmadığı anlamına gelir. Ziyaretçilerin bu düğmeyi bilmemesi gerektiği için, düğmeyi ziyaretçiler fare imlecini bu alanın üzerine getirdiğinde el şeklindeki imleç görünmeyecek şekilde değiştirmeniz gerekir.

2. btnInvisible sembol örneğini seçin. Görünmeyen düğmeye bir örnek ismi verin.

Önce görünmez katman düğmesini seçin ve kilidini açın. Eğer gizlenmiş durumdaysa düğmeyi görünür hale getirin. home düğmesine ait katmanla düğme katmanlarınızın gizlenmiş durumda olduklarından emin olun.

Selection aracını kullanarak Stage’de ’de bulunan ve açılır gezinti menülerinin görüntülenmesini sağlayan görünmez düğme örneğini seçin. Düğmeye btnReturnMenus örnek ismini verin.

3. btnReturnMenus üzerine gelindiğinde fare imlecini gizleyecek ActionScript kodunu ekleyin

actions katmanındaki 1 numaralı kareyi seçin. ActionScript kodunu bu kareye ekleyeceksiniz. Eğer açık değilse Actions panelini açın ve Script Assist’i geçici olarak kapatın. Belirli bir kareye bir davranış ekledikten sonra Script Assist’i kullanmak eğlenceli olabilir. Burada Script Assist’i kapatıyorsunuz, çünkü böylece imleci Actions penceresinin üst kısmına yerleştirebilecek ve Script Assist hangi kodu eklerse eklesin, bunu daha önceden mevcut olan bir şeyin ortasına falan değil de doğru yere yerleştireceğinden emin olabileceksiniz.

İmleci, Actions panelinin üst kısmındaki kendi satırında yanıp sönecek şekilde yerleştirin. Enter tuşuna basarak bir boşluk bırakmak ve imleci tekrar en üstteki konumuna yerleştirmek isteyebilirsiniz. Script Assist düğmesine basarak Script Assist’i tekrar açın.

Sağ tarafta bulunan Actions araç çubuğunda ActionScript 2.0 Classes > Movie > Button > Properties’i seçin ve useHandCursor seçeneğini çift tıklayın. Script Assist expression alanındaki not_set_yet ifadesini btnReturnMenus ile değiştirin. El şeklindeki imleci gizlemek için useHandCursor metninin sonuna = false yazın.

İşiniz bittikten sonra Actions pencerenizin görüntüsü aşağıdaki şekilde gösterildiği gibi olacaktır.


4. El şeklindeki imlecin menülerin etrafında görünmediğinden emin olmak için FLA dosyasını test edin.

FLA dosyasını test etmek için Ctrl+Enter (ya da Mac’te Command+Enter) tuşlarına basın. Bir önceki adımda eklediğiniz ActionScript kodu nedeniyle, imleci Stage’de görünmez düğmenin bulunduğu konuma getirdiğinizde el şeklindeki imleç belirmeyecektir.

5. Yaptığınız değişiklikleri kaydedin.

Dosyanızı kaydettikten sonra bir sonraki uygulamaya geçin.

Movie Clip Düğmesinin Çalışmasını Sağlamak

Daha önceki derslerde movie clip düğmesini oluşturmuş ve canlandırmıştınız. map.fla dosyasını hazırlarken, animasyonun sürekli olarak döngüyle oynatılmasını engellemek için stop eylemlerini bile kullanmıştınız. Bu uygulamada, düğmelerin kendilerine tıkladığınızda bunların uygun şekilde hareket etmesini sağlayacak olan bazı basit eylemler ekleyerek movie clip düğmelerini tamamlayacaksınız. Bu uygulamada da bookstore10.fla dosyasını kullanacaksınız.

1. Kütüphaneyi açın ve movie clip düğmelerini bulun. Movie clip’i düzenleyebilmek için mcSampleChapter düğmesine çift tıklayın.

Oluşturduğunuz düğmelerin önünde sample chapter (örnek bölüm) ve table of contents (içindekiler) yazıları görünmektedir. Bunları kütüphanede bulabilirsiniz. sample chapter düğmesine çift tıklayarak bunu sembol düzenleme modunda açın ve daha önce düğmeyi nasıl oluşturduğunuzu hatırlayın.

2. actions katmanındaki 1 numaralı kareyi seçin ve bir stop(); eylemi ekleyin. 14 ve 25 numaralı kareye de birer stop(); eylemi ekleyin.

1 numaralı kareyi seçin, sonra da Actions panelini maksimum boyutuna getirin ya da açın (F9). Script Assist düğmesine basarak Script Assist’i açın ve Script bölmesine stop(); yazın. Timeline’da 14 numaralı kareyi seçin, F6 tuşuna basarak bir anahtar kare ekleyin, sonra da Script bölmesine stop(); yazın.

25 numaralı karenin üzerindeyken F6 tuşuna basarak actions katmanına yeni bir anahtar kare ekleyin, sonra da Script bölmesine stop(); yazın.


3. actions katmanındaki _over durumu için play( ); yazın.

actions katmanına, _over ve _down durumlarının üzerine yeni anahtar kareler ekleyin. _over durumuna ait anahtar kareyi seçin ve Action panelindeki Script bölmesine play(); yazın. Bu eylem, oynatım kafasına devam etmesini ve bir sonraki kareyi/kareleri oynatmasını söyler.

_over karesine play(); eylemini e eklemenizin nedeni, Flash’ın, bir movie clip oluşturduğunuzda her bir kare etiketinde duracak şekilde programlanmış olmasıdır. Flash’ın durmasına izin verirseniz, parlaklık tween animasyonu oynatılmaz. Bu nedenle, Flash’a animasyonu oynatmasını söylemeniz gerekir. Kareye play(); eylemini bu nedenle ekliyorsunuz.

4. Oynatım kafasını _down karesine getirin ve actions katmanına play() eylemini ekleyin.

Kullanıcı düğmeye tıkladığında bir parlaklık tween’inin daha gerçekleşmesini istiyorsunuz. Bu nedenle, düğmenin bu kare etiketinde durmasını önlemek için bir play(); eylemine daha ihtiyacınız var.


actions katmanındaki 15 numaralı kareyi seçip F6 tuşuna basarak buna boş bir anahtar kare ekleyin. Actions panelini açın ve Script bölmesine play(); yazın.

5. Düzenleme çubuğundaki Scene 1’e tıklayarak ana Stage’e geri dönün. 1-4 arasındaki adımları mcToc düğmesi için de tekrarlayın.

1-4 arasındaki adımları diğer movie clip düğmesi için de tekrarlayın. Bu işlemleri tamamladıktan sonra, yine düzenleme çubuğunu kullanarak ana Stage’e geri dönün.

6. FLA dosyasında yaptığınız değişiklikleri kaydedin.

Ana Stage’deyken, File > Save komutunu seçerek dosyanızda yapmış olduğunuz değişiklikleri kaydedin. Dosyayı TechBookstore klasörüne kaydettiğinizden emin olun. Ders 9’da, kullanıcı imleci düğmenin üzerine getirdiğinde ve düğmeden uzaklaştırdığında tetiklenen başka olayları da öğreneceksiniz.

Script Gezgini’ni ve Raptiyeleri Kullanmak

Artık FLA dosyanızın birkaç farklı yerine ActionScript kodları eklediğinize göre, belgeye eklediğiniz script’leri bulmak için Script gezginini kullanmayı deneyebilirsiniz. Ne yazık ki, davranışları kullandığınız zaman ActionScript kodlarınızın hepsini aynı yerde tutamazsınız. Bu nedenle, FLA dosyasında ihtiyacınız olduğunda script’lerin nerede olduğunu bulmanıza yardımcı olan bu araçları iyi tanımanız faydalı olur. Script gezgini, belgedeki script’ler arasında dolaşmak için kullanılabilir. Burada FLA dosyanızdaki bütün farklı kod parçaları arasında gezinmenizi sağlayan bir ağaç yapısı bulunur. Kare ve nesne eylemlerinin hepsi, gezginin kodları organize etmek için kullandığı bu ağaç yapısının bir parçası olarak temsil edilir.

Actions panelinde script’leri iğnelemeniz de mümkündür. Script gezgininde bir kod parçasını seçerseniz, raptiye düğmesine tıklayarak ya da Script gezgininde koda çift tıklayarak script’i iğneleyebilirsiniz. Bunu yaptığınızda, kod kendi sekmesi olan açık bir belgeye benzer şekilde, Actions panelinde “açık” kalır.


Daha sonra yapmanız gereken tek şey, Actions panelinde düzenlemek amacıyla kod parçasına erişmek için sekmeye tıklamaktır. Script raptiyeleri, Script bölmesinin hemen altındaki farklı sekmelere tıklayarak kod parçalarına erişmenizi ve bunları düzenlemenizi kolaylaştırır. Aşağıdaki uygulamada, script iğneleme özelliğini nasıl kullanacağınızı öğreneceksiniz.

1. bookstore10.fla dosyasını kullanarak Actions panelini maksimum boya getirin ya da açın (F9 tuşuna basarak).

Actions paneli açılacaktır. r. Bu panelin sol tarafında Actions araç çubuğu ve Script gezgini, sağ tarafında da Script bölmesi yer alır. Bu iki alanı bir çubuk ayırır ve bu çubuğu kullanarak gerektiğinde bu alanların büyüklüklerini ayarlayabilirsiniz.

2. Script bölmesini ve Script gezginini ayıran çubuğu sürükleyerek Actions panelindeki alanların büyüklüklerini değiştirin.

Çubuğa tıklayıp bunu sürükleyerek Actions panelinin Script gezgini bölümünün büyüklüğünü ayarlayabilirsiniz. Kodları düzenlerken muhtemelen, çubuğun ortasındaki ok düğmesine tıklayıp kapatarak Script gezgini ve Actions araç çubuğu kısımlarını minimum boya getirmek isteyeceksinizdir.

3. Script gezgini maksimum boydayken, mcProductsMenu başlığının altındaki actions: Frame 11 alt başlığına tıklayın.

Bu öğelerin her birine tıkladığınızda, bununla ilişkili kod Script bölmesinde belirir. Script gezginindeki bir öğeye tıkladığınızda, belgenin oynatım kafası seçili script’in bulunduğu kareye gider. Script gezgini, FLA dosyasındaki kodların arasında fazla çaba harcamadan dolaşmanıza yardımcı olur. Düzenlemeniz gereken kodu bulduğunuzda, aşağıdaki adımda olduğu gibi bu script’leri iğneleyebilirsiniz.


4. Script gezgininde mcProductsMenu başlığı altındaki actions: Frame 11’i seçin ve Script bölmesinin altındaki Pin active script düğmesine tıklayın. Sonra da belgedeki ikinci bir script’i iğnelemeyi deneyin.

Üzerinde raptiye simgesi bulunan Pin active script düğmesine tıkladığınızda, siz iğnelenmiş script’i kapatıncaya kadar kod Actions panelinde kalır. Script gezgininde actions: Frame 11’e tıkladıktan sonra Pin active script düğmesine tıklayın. Stage’de bir script içeren bir kareyi ya da örneği seçtikten sonra Actions panelindeki script sekmesine sağ tıkladığınızda (ya da Mac’te Control tuşunu basılı tutup tıkladığınızda) açılan bağlam menüsünden Pin Script’i seçmeniz de mümkündür. Bu yöntemde, script Actions panelinde iğnelenir ve bunun sonucunda Script bölmesinin altına yeni bir sekmenin
eklendiğini görürsünüz.

Not: Script gezginindeki koda çift tıklayarak da script’i Actions panelinde iğneleyebilirsiniz.

İğnelenmiş bir script’i kapatmak için, iğnelenmiş script’lerden birini, sekmesini kullanarak ya da Script gezgininde seçin. İğnelenmiş script seçili durumdayken düğmedeki raptiyenin görünümü değişir. Bu düğmeye tıkladığınızda, script’in raptiyesi çıkarılır.

5. İğnelediğiniz kod parçalarının script sekmelerine tıklayın.

İğnelenmiş script’ler arasında dolaşmak için Script bölmesinin altındaki script sekmelerini kullanın. Script’ler arasında dolaşmanız FLA dosyasındaki oynatım kafasının hareket etmesine neden olmaz. İğnelenmiş script’ler, Flash belgesinde aradığınız kodu yerleştirmiş olabileceğiniz her yere bakmak zorunda kalmadan, çok daha kolayca bulmanızı sağlar. Farklı örneklere kod yerleştirmek için davranışları kullanıyorsanız, muhtemelen bu aracı çok faydalı bulacaksınız.

Not: Sekmeleri Actions paneline sığmayacak kadar çok iğnelenmiş script’iniz varsa, panelin sağında iki uçlu bir ok belirir. Bu düğmeye tıklarsanız, iğnelenmiş ilave script’leri gösteren bir menü açılır.

Bu uygulamada yaptığınız değişiklikleri kaydetmeniz gerekmiyor. Bu nedenle, bu işlemleri tamamladıktan sonra değişiklikleri kaydetmeden belgeyi kapatın.

Ders 9’da, ActionScript dili ve çalışma şekli hakkında daha fazla bilgi edineceksiniz. ActionScript hakkında ne kadar fazla bilgi sahibi olursanız, Flash 8 uygulamalarınızın o kadar işlevsel olmasını sağlayabilirsiniz.



Bu derste şunları öğrendiniz:

• Bir FLA dosyasındaki Timeline’a ve bir örneğe davranışlar ekledik.
• Bir belgeye eklediğimiz davranışlarda değişiklik yapmayı öğrendik.
• Bir JPEG resmini bir Loader bileşenine yükleyerek temel sunucu etkileşimi oluşturduk.
• ActionScript dilinin temelleri hakkında bilgi edindik.
• Bir SWF dosyasındaki oynatım kafasını kontrol etmek için stop(); eylemleri ekledik.
• Tech Bookstore sitesine yeni bir giriş sayfası (home) düğmesi ekledik.
• Bir düğmeden el şeklindeki imleci kaldırmak için Script Assist’i kullandık.
• Movie clip düğmesinin bir düğme olarak canlandırılması için gereken kodu ekledik.
• Belgemizdeki script’leri bulmak ve düzenlemek için Script gezginini ve iğnelenmiş script’leri nasıl kullanacağımızı öğrendik.

Tebrikler

Bir insan ancak bu kadar detaylı bilgi verebilirdi,gerçekten tebrik ederim.Ellerine ve kollarına sağlık.

açıklamalar çok uzun yaaa insan sıkılıoo bunları okurkenn :S ama yinede saoll eline sağlık

teşekkürler hocam...

abi sen süpersin ya

düzgün,rahat bir kulanım bekliyorsunuz.. (ki bir sır:kullanım görsel hafıza ve sayısal beceri de ister..)yaratıcılığınızı kullanmak istemek,pek tabii.a ma bilgi reklam görüntüleme grafik demek bi yerde ve posterleri de onlar yapar müze kürtaörlerine gelince,onlar bilgi verir..ama insanların istediklerini değil..

derslerin 9'a kadar devam ediceği bilgisi var 6'da kesilmiş. bi de linkler ölü yenileyebilirmisiniz tşk. elinize sağlık