List bileşenini özelleştirme

Geliştirme sırasında ve çalışma zamanında List bileşenini yatay olarak ve dikey olarak dönüştürebilirsiniz. Geliştirme sırasında, Sahne Alanı'nda bileşeni seçin ve Serbest Dönüştürme aracını veya Değiştir > Dönüştür komutlarından herhangi birini kullanın. Çalışma zamanında setSize() yöntemini veya height , width , scaleX ve scaleY gibi List sınıfının ilgili özelliklerini kullanın.

Bir liste yeniden boyutlandırıldığında, listenin satırları yatay olarak daraltılır ve içindeki metinler kırpılır. Dikey olarak, liste gerektiğinde satır ekler veya kaldırır. Kaydırma çubukları, otomatik olarak gerektiği şekilde konumlandırılır.

List bileşeniyle stilleri kullanma

List bileşeninin görünümünü değiştirmek için stil özelliklerini ayarlayabilirsiniz. Stiller, bileşen çizildiğinde bileşenin kaplamaları ve dolgusu için değerleri belirtir.

Çeşitli kaplama stilleri, kaplama için kullanılmak üzere farklı sınıflar belirtmenizi sağlar. Kaplama stillerini kullanma hakkında daha fazla bilgi için bkz. Kaplamalar Hakkında .

Aşağıdaki prosedür, List bileşeni için contentPadding stilinin değerini ayarlar. İçerik etrafında dolgu elde etmek için, bu ayarın değerinin, List öğesinin boyutundan çıkarıldığına dikkat edin, böylece List öğesindeki metnin kırpılmasını önlemek için List öğesinin boyutunu artırmanız gerekebilir.

  1. Yeni bir Flash dosyası (ActionScript 3.0) belgesi oluşturun.

  2. List bileşenini Bileşenler panelinden Sahne Alanı'na sürükleyin ve bu bileşene aList örnek adını verin.

  3. Ana Zaman Çizelgesi'nde Kare 1 öğesini seçin, Eylemler panelini açın ve contentPadding stilini ayarlayıp List öğesine verileri ekleyen şu kodu girin:

    aList.setStyle("contentPadding", 5); 
    aList.setSize(145, 200); 
    aList.addItem({label:"1956 Chevy (Cherry Red)", data:35000}); 
    aList.addItem({label:"1966 Mustang (Classic)", data:27000}); 
    aList.addItem({label:"1976 Volvo (Xcllnt Cond)", data:17000}); 
    aList.rowCount = aList.length;
  4. Kontrol Et > Filmi Test Et'i seçin.

List bileşeniyle kaplamaları kullanma

List bileşeni, görsel durumlarını temsil etmesi için şu kaplamaları kullanır:

List kaplamaları

ScrollBar öğesi için kaplama oluşturma hakkında daha fazla bilgi için bkz. UIScrollBar bileşenini özelleştirme . Focus Rect kaplaması için kaplama oluşturma hakkında bilgi için bkz. TextArea bileşenini özelleştirme

Not: Bir bileşendeki ScrollBar kaplaması değiştirildiğinde, ScrollBar öğesini kullanan diğer tüm bileşenler için de ScrollBar kaplaması değiştirilir.

List hücresinin farklı durumları için ikinci bir kaplamalar paletini açmak için Cell Renderer kaplamasını çift tıklatın.

List Cell Renderer kaplamaları

Bu kaplamaları düzenleyerek List öğesinin hücrelerinin görünümünü değiştirebilirsiniz. Aşağıdaki prosedür, normal devre dışı durumunda List öğesinin görünümünü değiştirmek için Up kaplamasının rengini değiştirir.

  1. Yeni bir Flash dosyası (ActionScript 3.0) belgesi oluşturun.

  2. List bileşenini Bileşenler panelinden Sahne Alanı'na sürükleyin ve bu bileşene aList örnek adını verin.

  3. Kaplamalar paletini açmak için List öğesini çift tıklatın.

  4. Cell Renderer kaplamalarının paletini açmak için Cell Renderer kaplamasını çift tıklatın.

  5. Up_Skin kaplamasını düzenlemek üzere açmak için çift tıklatın.

  6. Kaplamanın dolgu alanını tıklatarak seçin. Özellik denetçisinde, kaplamanın geçerli dolgu rengiyle bir Dolgu rengi seçici görüntülenir.

  7. Up_Skin kaplamasının dolgusuna uygulamak için Dolgu rengi seçicisini kullanarak #CC66FF rengini seçin.

  8. 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.

  9. List öğesine veri eklemek için Zaman Çizelgesi'nin Kare 1 öğesindeki Eylemler paneline şu kodu ekleyin:

    aList.setStyle("contentPadding", 5); 
    aList.setSize(145, 200); 
    aList.addItem({label:"1956 Chevy (Cherry Red)", data:35000}); 
    aList.addItem({label:"1966 Mustang (Classic)", data:27000}); 
    aList.addItem({label:"1976 Volvo (Xcllnt Cond)", data:17000}); 
    aList.rowCount = aList.length;
  10. Kontrol Et > Filmi Test Et'i seçin.

    List öğesi, aşağıdaki gibi görüntülenir:

    özel Up_Skin renkli List hücreleri
    özel Up_Skin renkli List hücreleri

    contentPadding stilinin ayarlanması sonucunda kareler oluşturulur.