|
|
|
|
| Ana Sayfa | Haberler | Duyurular | Güncel Yazılımlar | Eğitim CD | Eğitim Kitapları | Programlar | Adobe Forum | |
|
Buton-Menü-Klavye girdileri Bu bölümde bahsedilecek konuları şu ana başlıklar altında toplayabiliriz: 1- Basit butonlar 2- Komplike ve animasyonlu butonlar 3- Butonlara tween uygulaması 4- Pop-up menü ( Çekme menüsü ) oluşturma 5- Buton izleme seçenekleri 6- Key-press ( Klavye girdileri ) olayları 7- Buton over alanına film klibi ekleyerek animasyonlu buton oluşturma Butonlar sadece başka bir sayfaya yönlendirme amacıyla kullanılmazlar. Film klip leri içinde actionscriptlerle beraber kullanıldığında çok çarpıcı sonuçlar elde edilir. Bu amaçla gizli butonlar sıklıkla tercih edilir.
Gizli butonlarda up, over, down alanları boş bırakılıp sadece hit bölgesine dolgu içeren bir alan eklenir. Flash`ta bu buton sahneye sürüklendiğinde açık mavi renkte gözlenir.Filmi browser`da açıldığında ise hiçbir imaj görülmez, fakat mouse ile üzerine gelindiğinde el imajı ortaya çıkar.Bu butona eklenen tüm komutlar kusursuz olarak çalışır. Şöyle bir menü görüntüsü düşünün: Ana butona basıldığında alt grup butonlar açılıyor ve bu gruplara ulaşmak için fareye basma hareketini bırakmadan sürükleme yöntemi ile diğer butonlara ulaşma animasyonunu oluşturmak istiyorsunuz. Alt butonlar üzerine gelindiğinde fare bırakılıyor ve bağlantılı adrese ulaşılıyor. Ana butona basıldığında ortaya çıkan menü basma hareketinden vazgeçildiği an kayboluyor. İşte bu tür bir menü için "Track as Menu Item" seçeneğini kullanmalısınız. Örnek dosyamızda heriki izleme seçeneğini aynı anda göreceksiniz. Kullanılan semboller, kodlar hatta timeline aynı olmasına rağmen izleme seçeneğinin değiştirilmesiyle tamamen farklı bir animasyon elde edilmiştir. Bir klavye girdisi için flash`ta 2 yöntemi kullanabilirsiniz: 1- Örnekteki gibi basit bir keypress olayı yaratmak 2- Key nesnesini kullanmak. Key nesnesi actionscript bölümünde anlatılacaktır Uygulamalar: Buton-Menü- Klavye Girdileri-1
Buton üzerinde bir basma efekti oluşturacağız. Uygulama 1- İnsert > New Symbol komutunu verin. Davranış olarak buttonu seçin. 2- Bu katman gölge için kullanılacaktır. Up üzerine tıklayarak işaretleyin. Oval aracını seçin. Color bölümünde Stroke Color seçeneğini kapatın.Yani şekilde dış kenar olmayacak. Dolgu için çok koyu olmayan bir gri renk seçin. 3- Şeklin kenarını yuvarlatmak için:
Round Rectangle Radius düzenleyicisine tıklayın. Açılan panelde:
Köşe yarıçapı için 10 değerini girin. Tamam`a basın. 4- Şimdi Up seçili iken arzu ettiğiniz boyutta bir şekil çizin.
5- Over, Down ve Hit alanında keyframe
olmadığından 3 kez peşpeşe F6`ya basarak bu üç alana birer keyframe
ekleyin. Görüntü özelliklerini hiç değiştirmeyin.
7- Şimdi,en üst katmandaki up alanındaki resmi seçin. Windows > Panels >Fill komutu ile paneli açın. Burada lineer gradient`i işaretleyin. Solda açık mavi sağda ise koyu mavi rengi seçin. Gradient rengi hazırladıktan sonra boya kutusunu seçip şekil üzerine tıklayın. Şekil gradient renkle boyanmış oldu. Yeniden up alanını seçin üç kez F6`ya basarak over,down ve hit alanına keyframeler ekleyin. 8- Over alanını tıklayın. Sahnedeki şekili seçip Modify > Transform > Flip Horizontal komutunu verin. Gradient tersine dönecektir. Bunu yapmamızın nedeni mouse buton üzerine geldiğinde bir efekt oluşturması içindir. Down alanındaki şekle dokunmayın. 9- Artık gölge ve basılma efekti vermeye hazırız. Alttaki katmanın tekrar görünmesini sağlayın. Bunun için katman üzerindeki çarpı şekilini bir kez tıklamanız yeterlidir. Üst katmandaki up alanındaki şekili seçin, klavyede sol yön tuşuna 3 kez, üst yön tuşuna 3 kez basın. Bu iki kez de yapılabilir. Alttan gölge efekti çıkacaktır.
10- Şimdi over alanına gelin, aynı işlemleri uygulayarak görüntüyü 3 piksel sola ve yukarıya ilerletin. 11- Down alanında hiçbir işlem yapmayın. Alttaki gölge görülmeyeceğinden basma efekti ortaya çıkacaktır. Hit kısmına da dokunmanıza gerek yok. Burası sadece sıcak alan sağlar. 12- En üste bir katman daha ekleyelim. Burası yazı için kullanılacak. Up kısmını işaretleyip yazımızı yazalım. Fare ile tutarak butonun tam ortasına yerleştirelim.
Yazıyı sağ klik ve copy komutu ile kopyalayalım. Over alanını tıklayıp işaretleyelim, CTRL+Shift+V ile aynı alana kopyalayalım. Bu sayede yazıları tam üstüste getirme sıkıntısından kurtuluruz. Aynı işlemi down alanında da yapalım. Fakat bu alan kaydırılmadığından yazıyı üstteki işlemin tersine 3 piksel sağa ve aşağıya alalım. Rengini beyaza yakın bir gri tona çevirelim. Hit alanına yazı eklemeye gerek yoktur. Timeline`daki görüntü şöyle olmalıdır:
Şayet butonda ses olmasını istiyorsanız önce File > İmport komutu ile kütüphaneye bir ses dosyasını alın ve down alanlarından biri işaretli iken mouse ile kütüphaneden sahne içine sürükleyin. İlgili frame üzerine ses eklendiğini gösteren bir şekil göreceksiniz. F12 ye basarak filminizi test edin.
Buton-Menü- Klavye Girdileri-2
Bir grafikten animasyonlu butona geçişi göreceğiz. Uygulama 1- Sahneye önce buton için bir yazı yanına da animasyon için bir şekil oluşturun.
Şekildeki yazının direkt bir sembol olduğuna dikkat edin. Siyah halka oval aracı seçilip Fill Color bölümü kapatılarak yapılmıştır. Ortadaki kırmızı dairede ise Stroke Color bölümü kapatılmıştır. Line aracı ile beyaz renkli bir üçgen yapıl mış ve içi boya kutusu ile beyaz renkle doldurulmuştur. Şu anda elimiz de sadece bir grafik mevcut. Şimdi bundan buton ve animasyonlar oluşturacağız. 2- Sahnedeki yazı ve tüm şekilleri seçerek F8`e basın, davranış olarak butonu seçin. 3- Şimdi sahnede bir buton oluştu.
Bunun üzerine çift tıklayarak sembol düzenleme moduna geçin. Timeline`da
sadece Up durumu için bir imajın olduğuna dikkat edin. 4- Up durumu için bir animasyon oluşturmaya başlayabiliriz. Up durumu işaretli iken sahnedeki siyah halkayı seçin.
F8`e basarak onu bir grafik sembolüne çevirin. 5- Şimdi kırmızı daire ve oku seçin. Birden fazla seçim yaparken Shift tuşuna devamlı basmayı unutmayın. Yoksa birden fazla seçim yapamazsınız.
F8`e basarak onu da grafik sembolüne çevirin. Bunları niye yapıyoruz? Amaç bu 2 grafiği ayrı katmanlara alarak animasyon uygulamaktır. 6- Şimdi Shift tuşuna basılı tutarak hem siyah hem de kırmızı daire grafiğini seçin.
Dikkatli olun kaydet yazısını seçmeyin. F8`e basarak bu iki grafiği movie clip`e dönüştürün. 7- Bu klibi düzenlemeye başlayalım. Yeni klibimizi kütüphaneden sahneye alalım. Siyah halka grafiği ni seçerek sağ klik ve cut komutuyla kesin. Yeni bir katman ekleyin ve ilk frame`i seçerek CTRL+Shift+V komutu ile kestiğimiz yerin tam üzerine yapıştırın.
8- Şu anda görüntü aynı olmakla beraber grafikler ayrı katmanlara alınmış ve animasyon eklenmeye uygun hale gelmiştir. 9- Siyah halka katmanında 20.frame`e bir keyframe ekleyin. Aynı yerde 10.frame`e de bir keyframe ekleyin. 10- 10. frame seçili iken scale
aracına tıklayın ve şeklin alt tutamaçından yukarı doğru çekerek onu
1 ve 10. framelere motion tween komutunu verin. Bu işlemler sayesinde siyah halkamız yatay bir eksende dönme hareketi yapabilecektir. 11- Alttaki kırmızı daire katmanında da 20.frame`e bir keyframe ekleyin. 1.frame`e motion tween komutunu verin. Properties paneline bakın. Rotate kısmındaki auto seçeneğini CW, times alanına da 1 yazın. Bu yolla animasyon saat yönünde ve 1 kez gerçekleşecektir.
12- Animasyonun yenilenmesi sırasında duraklama yaratmak için heriki katmana birkaç frame ekleyin.
Up durumu için animasyonunuz hazır. Şimdi over durumu için animasyon hazırlayacağız. 13- Kütüphaneden butonumuza çift tıklayarak açalım. Up alanı seçili iken 3 kez F6`ya basarak over, down, hit durumu için birer keyframe ekleyelim. Hit durumunda grafiğin üzerini dikdörtgen aracı ile kapatalım ki sıcak alanımız oluşsun. 14- Over alanını tıklayın. Şu anda sahnede gördüğünüz Up durumundaki şekil ve animasyonların aynısıdır. Bunu değiş tirmeye başlayalım. Kaydet yazısını yazı aracı ile seçerek rengini maviye çevirelim.
15- Yazının yanındaki daire şekilleri içeren klibi seçip yeniden F8`e basıp movie klip seçeneğini işaretleyerek ayrı bir film haline getirelim. Bu yeni film klibimizi sahnede açalım. Bir kez CTRL+B`e basarak filmi 2 grafik şeklinde parçalaya lım.
Burada amaç hala up durumundaki filmi parçalayıp yeni bir film oluşturmaktır. 16- Ortadaki kırmızı daireyi seçip kesin, yeni bir katman ekleyerek 1.frame`ini işaretleyip CTRL+Shift+V ile yapıştıra lım. Yine iki grafiği ayrı katmana aldık. 17-Üst katmanda kırmızı daireyi seçin ve scala aracı ile bunu büyülterek siyah halka çevresine kadar getirin.
18- Heriki katmanda da 15.frame`lere bir keyframe ekleyin ,yine heriki şekili 3-4 piksel sola itin ki animasyonda bir yuvarlanma efekti oluşsun. Heriki katmana motion tween uygulayın. Heriki motion içinde frame panelini seçerek rotate için CW, times için 1 rakamını seçin. Alt kutuları boşaltın. 19- 15. framelerden birine stop aksiyonu ekleyin ki, over durumunda devamlı bir dönme hareketi olmasın.
20- Down durumu için isterseniz animasyonu değiştirebilirsiniz ama genelde buna pek gerek olmaz. F12`ye basarak filminizi test edin. Kaynak: FlashDersleri.COM |
|
