CellRenderer  - AS3 Flash

Obtém ou define um Objeto que representa os dados associados a um componente. Quanto esse valor é definido, os dados do componente são armazenados e o componente que os contém é invalidado O componente invalidado é, em seguida, automaticamente redesenhado.

A propriedade de dados representa um objeto que contém o item no DataProvider que a célula representa. Em geral, a propriedade de dados contém propriedades padrão, dependendo do tipo de componente. Na CellRenderer em um componente de List ou de ComboBox os dados contêm um rótulo, um ícone e propriedades de dados; uma TileList: um rótulo e uma propriedade de fonte; uma célula DataGrid contém valores para cada coluna. A propriedade de dados pode conter também dados especificados pelo usuário, relevantes para a célula específica. Os usuários podem estender uma CellRenderer para um componente, para utilizar propriedades diferentes dos dados na renderização de uma célula.

Além disso, os elementos labelField, labelFunction, iconField, iconFunction, sourceField e sourceFunction podem ser usados para especificar as propriedades usadas para desenhar o rótulo, o ícone e a fonte, respectivamente.

Obtém ou define as propriedades de lista que são aplicadas à célula; por exemplo, o index e os valores selecionados. Essas propriedades de lista são atualizadas automaticamente, após a célula ser invalidada.

Obtém ou define um valor booliano que indica se a célula atual está selecionada. Um valor true indica que a célula atual foi selecionada; um valor false indica que não foi.

O valor padrão é false.

Cria uma nova ocorrência de CellRenderer.

Recupera o mapa de estilos padrão do componente atual. O mapa de estilos contém o tipo que é apropriado para o componente, de acordo com o estilo que o componente usa. Por exemplo, o estilo disabledTextFormat contém o valor null ou um objeto TextFormat. Você pode usar estes estilos e chamar setStyle() no componente atual. O código a seguir substitui o estilo disabledTextFormat padrão no componente especificado:

componentInstance.setStyle("disabledTextFormat", new TextFormat());

Elementos da API relacionados

import fl.controls.*;
import fl.containers.*;
import fl.controls.listClasses.*;
import fl.controls.dataGridClasses.*;
import fl.controls.progressBarClasses.*;
import fl.core.UIComponent;
import fl.data.DataProvider;

var dp:DataProvider = new DataProvider();
dp.addItem( { label: "BaseScrollPane",    data:BaseScrollPane } );
dp.addItem( { label: "Button",             data:Button } );
dp.addItem( { label: "CellRenderer",    data:CellRenderer } );
dp.addItem( { label: "CheckBox",         data:CheckBox } );
dp.addItem( { label: "ColorPicker",     data:ColorPicker } );
dp.addItem( { label: "ComboBox",         data:ComboBox } );
dp.addItem( { label: "DataGrid",         data:DataGrid } );
dp.addItem( { label: "HeaderRenderer",    data:HeaderRenderer } );
dp.addItem( { label: "ImageCell",        data:ImageCell } );
dp.addItem( { label: "IndeterminateBar",data:IndeterminateBar } );
dp.addItem( { label: "Label",             data:Label } );
dp.addItem( { label: "List",             data:List } );
dp.addItem( { label: "NumericStepper",     data:NumericStepper } );
dp.addItem( { label: "ProgressBar",     data:ProgressBar } );
dp.addItem( { label: "RadioButton",     data:RadioButton } );
dp.addItem( { label: "ScrollPane",         data:ScrollPane } );
dp.addItem( { label: "Slider",             data:Slider } );
dp.addItem( { label: "TextArea",         data:TextArea } );
dp.addItem( { label: "TextInput",         data:TextInput } );
dp.addItem( { label: "TileList",         data:TileList } );
dp.addItem( { label: "UILoader",         data:UILoader } );
dp.addItem( { label: "UIComponent",     data:UIComponent } );

var cb:ComboBox = new ComboBox();
cb.move(10,10);
cb.setSize(300,25);
cb.prompt = "Select a component to view its styles";
cb.rowCount = 12;
cb.dataProvider = dp;
cb.addEventListener(Event.CHANGE, showStyleDefinition);
addChild(cb);

var dg:DataGrid = new DataGrid();
dg.setSize(425,300);
dg.move(10,50);
dg.columns = [ new DataGridColumn("StyleName"), new DataGridColumn("DefaultValue") ];
addChild(dg);

function showStyleDefinition(e:Event):void {
    var componentClass:Class = e.target.selectedItem.data as Class;
    var styles:Object = componentClass["getStyleDefinition"].call(this);
    trace(styles.toString());
    var styleData:DataProvider = new DataProvider();
    for(var i:* in styles) {
        trace(i + " : " + styles[i]);
        styleData.addItem( { StyleName:i, DefaultValue:styles[i] } );
    }
    styleData.sortOn("StyleName");
    dg.dataProvider = styleData;
}

Especifica as dimensões nas quais os dados devem ser renderizados. Essas dimensões afetam tanto os dados quanto a célula que os contém; o renderizador de célula usa-as para garantir que os dados se encaixam na célula e não vazam para as células adjacentes.

Parâmetros

Para executar o exemplo, siga estas etapas:

1. Inclua o componente TileList na biblioteca.
2. Crie um novo símbolo, chamado "BlueBackground", e nas propriedades do símbolo verifique a caixa que diz "Exportar para ActionScript". Deixe o nome da classe como "BlueBackground".
3. Crie um novo símbolo, chamado "OrangeBackground", e nas propriedades do símbolo verifique a caixa que diz "Exportar para ActionScript". Deixe o nome da classe como "OrangeBackground".
4. Crie um novo símbolo, chamado "GreenBackground", e nas propriedades do símbolo verifique a caixa que diz "Exportar para ActionScript". Deixe o nome da classe como "GreenBackground".
5. Em cada símbolo crie um retângulo com 10 pixels de largura e 10 pixels de altura, da cor do nome do símbolo. Deixe-o na coordenada x 0 e coordenada y 0.
6. Grave este código como CellRendererExample.as no mesmo diretório do arquivo FLA.
7. Defina a classe do Documento no arquivo FLA como CellRendererExample.

package
{ 
    import fl.controls.TileList;
    import fl.core.UIComponent;
    import fl.data.DataProvider;
    import fl.events.ListEvent;
    import flash.display.Sprite;
    import flash.events.Event;
    
    public class CellRendererExample extends Sprite
    {
        public function CellRendererExample() {
            var dp:DataProvider = new DataProvider();
            var totalEntries:uint = 42;
            var i:uint;
            for(i=0; i<totalEntries; i++) {
                dp.addItem( { label:"Item "+i } );            
            }
            
            var myTileList = new TileList();
            myTileList.dataProvider = dp;
            myTileList.allowMultipleSelection = true;
            myTileList.columnWidth = 125;
            myTileList.rowHeight = 25;
            myTileList.columnCount = 3;
            myTileList.rowCount = 6;
            myTileList.move(10,10);
            myTileList.setStyle('cellRenderer', MyRenderer);    
            myTileList.addEventListener(ListEvent.ITEM_CLICK, onClick);
            addChild(myTileList);
        }
        private function onClick(e:ListEvent):void {
            var cr:MyRenderer = e.target.itemToCellRenderer(e.item) as MyRenderer;
            trace(cr.customProperty);    
        }
    }
}

import fl.controls.listClasses.CellRenderer;

class MyRenderer extends CellRenderer
{
    public var customProperty:String = "foo";
    
    public function MyRenderer() {
        var originalStyles:Object = CellRenderer.getStyleDefinition();
        setStyle("upSkin",BlueBackground);
        setStyle("downSkin",GreenBackground);
        setStyle("overSkin",OrangeBackground);
        setStyle("selectedUpSkin",originalStyles.selectedUpSkin);
        setStyle("selectedDownSkin",originalStyles.selectedDownSkin);
        setStyle("selectedOverSkin",originalStyles.selectedOverSkin);
    }
}