Bir bileşenin görünümü, anahat, dolgu rengi, simgeler ve diğer bileşenler gibi grafiksel öğelerden oluşur. Örneğin, ComboBox bir List bileşeni içerir ve List bileşeni de bir ScrollBar bileşeni içerir. Grafiksel öğeler birlikte ComboBox'ın görünümünü oluşturur. Ancak bileşenin görünümü, geçerli durumuna göre değişir. Örneğin, etiketi olmadan bir CheckBox uygulamanızda görüntülenirse, şöyle görünür:
CheckBox normal basılmamış durumunda
CheckBox'ın üzerinde fare düğmesini tıklatıp basılı tutarsanız, CheckBox'ın görünümü şöyle değişir:
CheckBox basılmış durumunda
Fare düğmesini serbest bıraktığınızda, CheckBox orijinal görünümüne geri döner, ancak bu defa seçilmiş olduğunu gösteren bir onay işaretiyle birlikte görüntülenir.
CheckBox seçili durumunda
Bileşeni çeşitli durumlarında temsil eden simgelerin hepsine birden topluca bileşenin
kaplamaları denir.
Tıpkı diğer Flash sembollerinde olduğu gibi, Flash uygulamasında kaplamalarını düzenleyerek bileşenlerin herhangi bir durumunda veya tüm durumlarında görünümünü değiştirebilirsiniz. Bileşenin kaplamalarına iki şekilde erişebilirsiniz. Bunun en kolay yolu, bileşeni Sahne Alanı'na sürükleyip çift tıklatmaktır. Bu işlem sonucunda CheckBox için şöyle görünen bir bileşen kaplamalarının paleti açılır.
CheckBox'ın kaplamaları
Bir bileşenin kaplamalarına ayrı ayrı Kütüphane panelinden de erişebilirsiniz. Bir bileşeni Sahne Alanı'na sürüklediğinizde, bunu aynı zamanda, içindeki varlıkların bulunduğu bir klasör ve içerdiği diğer tüm bileşenlerle birlikte kütüphaneye kopyalamış olursunuz. Örneğin, Sahne Alanı'na bir ComboBox sürüklerseniz, Kütüphane paneli ComboBox'ta yerleşik olan List, ScrollBar ve TextInput bileşenlerini, bu bileşenlerin her birinin kaplamasını içeren bir klasörü ve bu bileşenlerin paylaştığı öğeleri içeren bir Paylaşılan varlıklar klasörünü de içerir. Kaplamalar klasörünü (ComboBoxSkins, ListSkins, ScrollBarSkins veya TextInputSkins) açıp düzenlemek istediğiniz kaplamanın simgesini çift tıklatarak bu bileşenlerden herhangi birinin kaplamalarını düzenleyebilirsiniz. Örneğin, ComboBox_downSkin öğesi çift tıklatıldığında, aşağıda gösterildiği gibi kaplama sembol düzenleme modunda açılır:
ComboBox_downSkin
Yeni bir kaplama oluşturma
Belgenizdeki bir bileşen için yeni bir görünüm oluşturmak istiyorsanız, bileşenin kaplamalarını düzenleyerek görünümü değiştirin. Bileşenin kaplamalarına erişmek üzere kaplamaların paletini açmak için Sahne Alanı üzerinde bileşeni çift tıklatın. Ardından düzenlemek istediğiniz kaplamayı sembol düzenleme modunda açmak için çift tıklatın. Örneğin, TextArea bileşeninin varlıklarını sembol düzenleme modunda açmak için Sahne Alanı üzerinde TextArea bileşenini çift tıklatın. Yakınlaştırma denetimini %400 olarak ayarlayın ve görünümünü değiştirmek için sembolü düzenleyin. İşleminiz bitince, değişiklik belgedeki bileşenlerin tüm örneklerini etkiler. Alternatif olarak, Kütüphane panelindeki belirli bir kaplamayı Sahne Alanı'nda sembol düzenleme modunda açmak için çift tıklatabilirsiniz.
Bileşen kaplamalarını şu yöntemlerle değiştirebilirsiniz:
Tüm örnekler için bir kaplama oluşturma
Bir bileşenin kaplamasını düzenlediğinizde, varsayılan olarak bileşenin belgedeki tüm örnekleri için de görünümü değiştirirsiniz. Aynı bileşen için farklı görünümler oluşturmak isterseniz, değiştirmek istediğiniz kaplamaları çoğaltıp bunlara farklı adlar vermeniz, düzenlemeniz ve sonra uygun stilleri ayarlayıp uygulamanız gerekir. Daha fazla bilgi için bkz.
Bazı örnekler için kaplamalar oluşturma
.
Bu bölümde, kullanıcı arabirimi bileşenlerinin her biri için bir veya birkaç kaplamanın nasıl değiştirileceği açıklanmaktadır. Kullanıcı arabirimi bileşeninin kaplamalarından bir veya birkaçını değiştirmek için bu prosedürlerden birini izlerseniz, belgedeki tüm örnekler için kaplamayı değiştirirsiniz.
Bazı örnekler için kaplamalar oluşturma
Aşağıdaki genel prosedürü kullanarak bir bileşenin bazı örnekleri için kaplama oluşturabilirsiniz:
-
Kütüphane panelinde bileşenin Varlıklar klasöründe kaplamayı seçin.
-
Kaplamayı çoğaltın ve kaplamaya benzersiz bir sınıf adı atayın.
-
Kaplamaya istediğiniz görünümü vermek için düzenleyin.
-
Kaplama stiline yeni kaplama atamak üzere bileşen örneği için
setStyle()
yöntemini çağırın.
Aşağıdaki prosedür, iki Button örneğinden biri için yeni bir selectedDownSkin oluşturur.
-
Yeni bir Flash dosyası (ActionScript 3.0) belgesi oluşturun.
-
Bileşenler panelinden iki Button öğesini Sahne Alanı'na sürükleyin ve bunlara
aButton
ve
bButton
örnek adlarını verin.
-
Kütüphane panelini ve sonra panelin içindeki Bileşen Varlıkları ve ButtonSkins klasörlerini açın.
-
selectedDownSkin kaplamasını seçmek için tıklatın.
-
Bağlam menüsünü açmak için sağ tıklatın ve Çoğalt öğesini seçin.
-
Sembolü Çoğalt iletişim kutusunda, yeni kaplamaya benzersiz bir ad (örneğin,
Button_mySelectedDownSkin
) verin. Sonra Tamam'ı tıklatın.
-
Kütüphane > Bileşen Varlıkları > ButtonSkins klasöründe, Button_mySelectedDownSkin öğesini seçin ve bağlam menüsünü açmak için sağ tıklatın. Bağlantı Özellikleri iletişim kutusunu açmak için Bağlantı öğesini seçin.
-
ActionScript için Dışa Aktar onay kutusunu tıklatın. İlk Karede Dışa Aktar onay kutusunu seçili bırakın ve sınıf adının benzersiz olduğundan emin olun. Tamam'ı tıklatın ve sonra sınıf tanımının bulunamadığını ve oluşturulacağını belirten uyarıya yanıt olarak tekrar Tamam'ı tıklatın.
-
Kütüphane panelindeki Button_mySelectedDownSkin kaplamasını sembol düzenleme modundan açmak için çift tıklatın.
-
Özellik denetçisindeki Dolgu rengi seçicisinde renk görüntüleninceye kadar kaplamanın ortasında mavi dolguyu tıklatın. Renk seçiciyi tıklatın ve kaplama dolgusu için #00CC00 rengini seçin.
-
Belge düzenleme moduna geri dönmek için, Sahne Alanı'nın yukarısındaki düzenleme çubuğunun sol tarafındaki Geri düğmesini tıklatın.
-
Özellik denetçisinde, her düğmenin Parametreler sekmesini tıklatın ve toggle parametresini
true
değerine ayarlayın.
-
Zaman Çizelgesi'nin Kare 1 öğesindeki Eylemler paneline şu kodu ekleyin:
bButton.setStyle("selectedDownSkin", Button_mySelectedDownSkin);
bButton.setStyle("downSkin", Button_mySelectedDownSkin);
-
Kontrol Et > Filmi Test Et'i seçin.
-
Her düğmeyi tıklatın. bButton nesnesinin aşağı kaplamasının (seçili ve seçimi kaldırılmış) yeni kaplama sembolünü kullandığını unutmayın.
