Wifi görüntüsünü oluşturma ve sinyal gücünü metinsel olarak yazan animasyonu kare kare animasyon yöntemiyle yapalım.

Wifi sinyali animasyonu - kare kare animasyon

A.S 2.0 biçimde çalışma sayfamızı açtıktan sonra animasyon için hazırlıklarımıza başlıyoruz.

Wifi animasyonu yapımı

Kaynak FLA ve SWF dosyasını indir (CS 4)

Sahnemize 350 * 350 boyutlarında kenarlığı olmayan, arkaplan rengi parlak turuncu olacak şekilde dairemizi çiziyoruz. Hizalama panelini kullanarak sahnenin ortasına hizalıyoruz. İlk daire çizildikten sonra bir kopyasını alıp seçili özelliğini kaldırmadan, boyutlarını 300 * 300 yapıp arkaplan rengine beyaz veriyoruz.

Bu işlemi dairenin boyutlarını 50 piksel düşürerek 50 * 50 boyutlarına kadar bir parlak turuncu bir beyaz daire olacak şekilde iç içe ortalanmış şekilde hazırlıyoruz. ( Not: İlk çizdiğimiz daireyi seçili hale getirdikten sonra boyut ve renk değiştirme işlemlerinde seçili özelliğini kaldırmıyoruz. Yapacağımız işlem kopyala - yapıştır, boyut değiştir, renk ver )

wifi animasyonu

Tüm daireler hazırlandıktan sonra sağ ve soldan iki adet çizgi çekip çizginin altında kalan tüm daire parçalarını seçip siliyoruz. Daire parçalarını sildikten sonra çizgileride siliyoruz. Çizginin üstünde kalan kısımda ise sadece beyaz parçaları seçip sliyoruz. Geride sadece parlak turuncu renginde olan yuvarlak ve yaylarımız kalıyor. Buraya kadar anlatılan tüm işlemi 1. katmanın 1. karesinde yapıyoruz.

kare kare animasyon

 

Şeklimiz wifi simgesi halini aldıktan sonra tamamını seçip, şeklin bir kopyasını yeni bir katmana yapıştırıp katmanı bir alta kaydıyoruz. Bu katmanı arkaplan olarak kullanacağız. Arkaplan katmanına yapıştırdığımız şeklin rengini renk panelinden siyah ve alfa değerini %8 yapıyoruz.

wifi animasyonu

ilk katmanda yer alan şekilimizi seçip katmanlara dağıt deyip katmanlara isim verip katmanların sıralamasını ayarlıyoruz.

kare kare animasyon

Yuvarlak katmanı ve arkaplan katmanı animasyonun sonuna kadar görünür kalacak. 1. yay ise 30. kareden itibaren 30 kare görünecek, 2. yay 60. kareden itibaren 30 kare görünecek, 3. yay ise 90. kareden itibaren 30 kare görünecek. Her bir yayın 30 karede bir görünmesini sağlayarak kare kare animasyon yöntemiyle wifi görünümünü elde etmiş oluyoruz.

Her yay görüntülendiğinde sinyalin kuvveti hakkında bilgi veren metnimizide ekleyerek animasyonu tamamlıyoruz. Bunun içinse en üste yeni katman açarak ismini sinyal kuvveti veriyoruz. 30. kareye "sinyal : zayıf", 60. kareye "sinyal:iyi", 90. kareye "sinyal:mükemmel" yazıp tamamlıyoruz.

wifi animasyonu

  • Yazı Etiketleri :
  • wifi animasyonu
  • kablosuz bağlantı animasyonu
  • kare kare animasyon
Css ile yatay ve dikey menu oluşturma, kutu modeli içerisinde kullanma
Yazıyı Oku

Css ile yatay ve dikey menu oluşturma, kutu modeli içerisinde kullanma

Css ile position: fixed kullanımı
Yazıyı Oku

Css ile position: fixed kullanımı

Css kutu modeli örneği ve float
Yazıyı Oku

Css kutu modeli örneği ve float

Nesne tabanlı programlama metot çağırma uygulamaları
Yazıyı Oku

Nesne tabanlı programlama metot çağırma uygulamaları

Css kutu modeli örneği ve konumlandırma
Yazıyı Oku

Css kutu modeli örneği ve konumlandırma

Css ile çoklu arkaplan uygulaması
Yazıyı Oku

Css ile çoklu arkaplan uygulaması

Menu