ColorPicker bileşenini kullanma

ColorPicker bileşeni, kullanıcının renk örneği listesinden bir renk seçmesine olanak tanır. ColorPicker öğesinin varsayılan modu, kare düğmede tek bir renk gösterir. Kullanıcı düğmeyi tıklattığında, geçerli renk seçiminin onaltılık değerini görüntüleyen bir metin alanıyla birlikte renk örneği panelinde kullanılabilir renklerin listesi görüntülenir.

colors özelliğini, görüntülemek istediğiniz renk değerleriyle ayarlayarak ColorPicker öğesinde görüntülenen renkleri ayarlayabilirsiniz.

ColorPicker bileşeniyle kullanıcı etkileşimi

ColorPicker, kullanıcının bir renk seçip bu rengi uygulamadaki başka bir nesneye uygulamasına olanak sağlar. Örneğin, arka plan rengi veya metin rengi gibi uygulama öğelerini kullanıcının kişiselleştirmesine olanak sağlamak istiyorsanız, ColorPicker öğesi dahil edebilir ve kullanıcının seçtiği rengi uygulayabilirsiniz.

Kullanıcı paneldeki renk örneğini tıklatarak veya metin alanına onaltılık değerini girerek bir renk seçer. Kullanıcı bir renk seçtikten sonra, metne veya uygulamadaki başka bir nesneye bu rengi uygulamak için ColorPicker öğesinin selectedColor özelliğini kullanabilirsiniz.

Kullanıcı ColorPicker örneğinin üzerine işaretçiyi getirirse veya bu örneğe basarsa, ColorPicker örneği odağı alır. ColorPicker öğesinin renk örneği paneli açık olduğunda bu paneli denetlemek için şu tuşları kullanabilirsiniz:

Anahtar

Açıklama

Home

Renk örneği panelinde seçimi ilk renge taşır.

Yukarı Ok

Renk örneği panelinde seçimi bir satır yukarı taşır.

Aşağı Ok

Renk örneği panelinde seçimi bir satır aşağı taşır.

Sağ Ok

Renk örneği panelinde seçimi bir renk sağa taşır.

Sol Ok

Renk örneği panelinde seçimi bir renk sola taşır.

End

Renk örneği panelinde seçimi son renge taşır.

ColorPicker bileşeni parametreleri

Her ColorPicker örneği için Özellik denetçisinde veya Bileşen denetçisinde şu geliştirme parametrelerini ayarlayabilirsiniz: selectedColor ve showTextField . Bu parametrelerin her biri, aynı adda, karşılık gelen ActionScript özelliğine sahiptir. Bu parametrelerin olası değerleriyle ilgili bilgi için, Adobe® Flash® Professional CS5 için ActionScript® 3.0 Başvurusu bölümündeki ColorPicker sınıfına bakın.

ColorPicker bileşeniyle uygulama oluşturma

Şu örnek, geliştirme sırasında bir uygulamaya ColorPicker bileşeni ekler. Bu örnekte, ColorPicker öğesindeki rengi her değiştirdiğinizde changeHandler() işlevi ColorPicker öğesinde seçtiğiniz rengin yer aldığı yeni bir kutu çizmek için drawBox() işlevini çağırır.

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

  2. Bir ColorPicker öğesini Bileşenler panelinden Sahne Alanı'nın ortasına sürükleyin ve bu öğeye aCp örnek adını verin.

  3. Eylemler panelini açın, ana Zaman Çizelgesi'nde Kare 1'i seçin ve şu ActionScript kodunu girin: 

    import fl.events.ColorPickerEvent; 
 
var aBox:MovieClip = new MovieClip(); 
drawBox(aBox, 0xFF0000);    //draw a red box 
addChild(aBox); 
 
aCp.addEventListener(ColorPickerEvent.CHANGE,changeHandler); 
 
function changeHandler(event:ColorPickerEvent):void { 
    drawBox(aBox, event.target.selectedColor); 
} 
 
function drawBox(box:MovieClip,color:uint):void { 
            box.graphics.beginFill(color, 1); 
            box.graphics.drawRect(100, 150, 100, 100); 
            box.graphics.endFill();         
}

  4. Kontrol Et > Filmi Test Et'i seçin.

  5. ColorPicker öğesini tıklatın ve kutuyu renklendirmek için bir renk seçin.

ActionScript kullanarak ColorPicker oluşturma

Bu örnek, Sahne Alanı'nda bir ColorPicker oluşturmak için ColorPicker() yapıcısını ve addChild() öğesini kullanır. ColorPicker öğesinin görüntüleyeceği renkleri belirtmek üzere kırmızı (0xFF0000), yeşil (0x00FF00) ve mavi (0x0000FF) renk değerlerine colors özelliğine ayarlar. Ayrıca bir TextArea oluşturur ve ColorPicker öğesinde her farklı bir renk seçtiğinizde örnek, eşleşmek için TextArea öğesindeki metnin rengine dönüşür.

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

  2. ColorPicker bileşenini Bileşenler panelinden Kütüphane paneline sürükleyin.

  3. TextArea bileşenini Bileşenler panelinden Kütüphane paneline sürükleyin.

  4. Eylemler panelini açın, ana Zaman Çizelgesi'nde Kare 1'i seçin ve şu ActionScript kodunu girin: 

    import fl.controls.ColorPicker; 
import fl.controls.TextArea; 
import fl.events.ColorPickerEvent; 
 
var aCp:ColorPicker = new ColorPicker(); 
var aTa:TextArea = new TextArea(); 
var aTf:TextFormat = new TextFormat(); 
 
aCp.move(100, 100); 
aCp.colors = [0xff0000, 0x00ff00, 0x0000ff]; 
aCp.addEventListener(ColorPickerEvent.CHANGE, changeHandler); 
 
aTa.text = "Lorem ipsum dolor sit amet, consectetuer adipiscing elit. Vivamus quis nisl vel tortor nonummy vulputate. Quisque sit amet eros sed purus euismod tempor. Morbi tempor. Class aptent taciti sociosqu ad litora torquent per conubia nostra, per inceptos hymenaeos. Curabitur diam. Suspendisse at purus in ipsum volutpat viverra. Nulla pellentesque libero id libero."; 
aTa.setSize(200, 200); 
aTa.move(200,100); 
 
addChild(aCp); 
addChild(aTa); 
 
function changeHandler(event:ColorPickerEvent):void { 
    if(TextFormat(aTa.getStyle("textFormat"))){ 
        aTf = TextFormat(aTa.getStyle("textFormat")); 
    } 
    aTf.color = event.target.selectedColor; 
    aTa.setStyle("textFormat", aTf); 
}

  5. Kontrol Et > Filmi Test Et'i seçin.