Obtiene o define un objeto que representa los datos asociados a un componente. Cuando este valor está definido, se almacenan los datos del componente y se invalida el componente que contiene. A continuación, se vuelve a dibujar el componente que se ha invalidado.

La propiedad data representa un objeto que contiene el elemento del objeto DataProvider que representa la celda. Por lo general, la propiedad data contiene propiedades estándar, según el tipo de componente. En CellRenderer en un componente List o ComboBox, los datos contienen una etiqueta, un icono y propiedades de datos; un componente TileList: una propiedad label y una propiedad source; una celda DataGrid contiene valores para cada columna. La propiedad data también puede incluir datos especificados por el usuario relevantes para la celda en cuestión. Los usuarios pueden ampliar un objeto CellRenderer a un componente que utilice diferentes propiedades de los datos al procesar la celda.

Asimismo, los elementos labelField, labelFunction, iconField, iconFunction, sourceField y sourceFunction se pueden utilizar para especificar las propiedades que se utilizan para dibujar la etiqueta, el icono y el origen, respectivamente.

Obtiene o define propiedades de lista que se aplican a la celda, por ejemplo, los valores index y selected. Estas propiedades de lista se actualizan automáticamente una vez se ha invalidado la celda.

Obtiene o define un valor booleano que indica si la celda actual está seleccionada. Un valor true indica que la celda actual está seleccionada; mientras que un valor false indica todo lo contrario.

El valor predeterminado es false.

Crea una nueva instancia de CellRenderer.

Devuelve la asignación de estilos predeterminada del componente actual. La asignación de estilos contiene el tipo adecuado para el componente, en función del estilo que ese componente utilice. Por ejemplo, el estilo disabledTextFormat contiene un valor null o un objeto TextFormat. Puede utilizar estos estilos y llamar a setStyle() en el componente actual. El código siguiente sustituye el estilo predeterminado disabledTextFormat en el componente especificado:

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

Véase también

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 las dimensiones en las que se deberían representar los datos. Estas dimensiones afectan a los datos y a la celda que los contiene; el procesador de celdas las utiliza para garantizar que los datos entran dentro de la celda y no se desparraman en celdas adyacentes.

Parámetros

Para realizar el ejemplo, siga estos pasos:

1. Añada el componente TileList a la biblioteca.
2. Cree un nuevo símbolo denominado "BlueBackground" y, en sus propiedades de símbolo, marque la casilla "Exportar para ActionScript". Deje el nombre de clase como "BlueBackground".
3. Cree un nuevo símbolo denominado "OrangeBackground" y, en sus propiedades de símbolo, marque la casilla "Exportar para ActionScript". Deje el nombre de clase como "OrangeBackground".
4. Cree un nuevo símbolo denominado "GreenBackground" y, en sus propiedades de símbolo, marque la casilla "Exportar para ActionScript". Deje el nombre de clase como "GreenBackground"..
5. En cada símbolo, cree un rectángulo con una anchura y altura de 10 píxeles del color designado para el símbolo. Déjelo en la coordenada 0 del eje x y la coordenada 0 del eje y.
6. Guarde este código como CellRendererExample.as en el mismo directorio que el archivo FLA.
7. Defina la clase Document como CellRendererExample en el archivo FLA.

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);
    }
}