Colorear filas de un DataGrid en Flash

Colorear filas de un DataGrid en Flash

Hace unos días estaba buscando como hacer para colorear un renglón de un DataGrid en Flash, ya que, según el status de cada campo, debía notarse de un color especifico; estuve buscando durante buen rato ya que en la ayuda de Flash no esta muy a la vista este apartado, así que dejo un ejemplo sencillo aquí por si alguien llega a necesitar algo similar (click en la imagen para bajar el Fla, necesitarás FlashMX 2004 Pro o superior para abrir el archivo):

datagrid.gif

_global.style.setStyle("themeColor", "white");
import mx.styles.CSSStyleDeclaration;
//creamos las columnas que dividirán nuestros datos
myGrid.addColumn("Indice");
myGrid.addColumn("Titulo");
myGrid.addColumn("Status");
//ajuste de tamaño de las columnas
myGrid.getColumnAt(0).width = 50;
myGrid.getColumnAt(1).width = 250;
//impedimos que se puedan retamañar
myGrid.getColumnAt(0).resizable = false;
myGrid.getColumnAt(1).resizable = false;
//insertamos valores simulados al datagrid
for(var i=0; i<5; i++){ myGrid.addItem({Indice:i+1,Titulo:("Titulo "+i),Status:i}) } //cambio de colores myGrid.setPropertiesAt(0, {backgroundColor:0xFFCCCC}); myGrid.setPropertiesAt(1, {backgroundColor:0xCCFFCC}); myGrid.setPropertiesAt(2, {backgroundColor:0xCCCCFF}); myGrid.setPropertiesAt(3, {backgroundColor:0xFFCCFF}); myGrid.setPropertiesAt(4, {backgroundColor:0xCCFFFF});

28 comentarios a “Colorear filas de un DataGrid en Flash

  1. Gracias por la info, me sirvió mucho…

    Tengo dos consultas:

    1:Si tengo varios datos y solo quiero usar dos colores, cual es el código ? ya que van apareciendo varias filas ya que se van ingresando datos

    Ej: rojo, azul rojo, azul, rojo, azul

    2-. Como puedo ordenar las columnas? Por ejemplo que el nombre salga primero con sus datos…

    Bueno y eso, saludos

    Atte. Marcel J.G.

  2. Pues bastante sencillo, haces un «for» que recorra la cantidad de registros en el «grid» y que a los «pares» les ponga un color y a los «nones» otro!

  3. joel e visto tus travajos echos en flash convertidos en .exe y quisiera saver que programa usastes.
    estubiera bueno que isieras un tutorial sobre eso.

  4. joel encontre una forma de combertir un swf a .exe sin singun otro programa sebe extraño pero si melo detecta como exe, adobe flash player 9.exe.
    no lo e probado con otro sistema operativo que no tenga nada de flash instalado para mi que boy a tener que instalar otro programa para que otra maquina me lo detecte.
    precionando ( ctrl + alt + supr ) me lo detecta como como exe
    esta es la churrada
    abrir el swf y se abre el contenido de el.
    ve a ( file / create projector ) y salvarlo con otro nombre
    haber que pasa despues ya que no tengo otra maquina

  5. @JFR: pues, yo uso un software llamado Zinc
    . Flash también puede publicar EXE’s, pero Zinc te permite hacer más cosas que las especificadas por Adobe

  6. hola joel este es mi problema
    ( tengo un swf y dentro de ese swf )
    ( hay otro swf )
    ( y dentro hay otro )
    el chiste es que el terser swf no carga, el primero y el segundo si los cargan usando loadMovie() cual es el problema ally

  7. @JFR: esa respuesta depende de como estés cargando tus películas, yo suelo crear un movieclip vació y lo utilizo como cargador, ponme un poco del codigo de como estas cargando esos swf y veo si encuentro el problema.

  8. demo = { el nombre del pajina jfr.com contiene un contenedor como dises un movieclip vacio llamado mostrar contiene esto
    boton_?.onPress = function()
    {
    loadMovie(«maletin/heladosdely.swf», mostrar)
    }

    todo vien no hay problemas

    si yo pongo un download o otro contenedor no funciona dentro de heladosdely

    ———————————heladosdely——————————————-
    ninguna de estas dos no funcionan

    boton_?.onPress = function()
    {
    loadMovie(«helados.swf», mostrar_1)
    }
    boton_?.onPress = function()
    {
    getURL («promociones.rar»)
    }

    ///////////////////////////////////////////////////////////////////////////////////////////
    pero en el primes swf como jfr.com si funcionan las dos anteriores.
    si yo corro el heladosdely sin llamarlo en un contenedor si me rrespatan las funciones no lo comprendo ?????????

  9. Bueno, a simple vista no está bien escrito getURL en donde tienes getURL(”download.rar”), otra cosa importante sería que pusieras toda la ruta donde está ubicado ese «download.rar», quizá ni exista el archivo!
    Pero si, parece que tu código no debiera tener problemas.

  10. pues e puesto tambien la rula y no me funciona, e puesto toda la rruta completa y no, solo funciona con el swf solo sin llamarlo con un contenedor
    si lo llamo con un contenedor no funciona
    en si esta asi
    web.swf con un contenedor llamado mostrar
    this.boton_4.onPress = function ()
    {
    controlador() // es un boton que llamo para eliminar la ventana o
    contenedor llamado mostrar
    loadMovie(«D:/work/web/maletin/UAEM.swf», mostrar)
    mostrar._y = 120
    mostrar._x = 40
    mostrar._xscale = 90;
    mostrar._yscale = 76;
    }
    todo bien llamo a uaem sin problemas, ahora le va a uaem

    licencia_de_arte.boton_13.onPress = function()
    {
    getURL(«D:\work\web\maletin\ProgramasArtes.rar»)
    }
    no funciona al pareser no nadamas ami tambien a otros chavos
    espero y me ayude con esto que escrivi y me ayudes con mi problema espero y no sea molesto todo esto para ti y gracias y disculpa por mi mala octografia en todo, pero eso no me a detenido >_<

  11. joel mis mil disculpas por no acer caso a las rutas de posicion del getURL
    de las adbertencias que me dise el (output) lo ciento por molestarte

  12. joel ahora si tengo un problema con loadMovie() es algo chistoso porque ami no me gusta usar tanto los frames, me gusta aser el escript en el primer frame este es el problema
    tengo dos _mc uno que se llama evolucion y el otro es un (mi sitio) pero me estoy topando con muchos problemas
    ——————————mi sitio.swf———————————————-
    dentro de este swf tiene este codigo
    botonera.boton_6.onPress = function ()
    {
    controlador()//un boton para eliminar mostrar
    loadMovie(«maletin/evolucion.swf», mostrar)
    mostrar._y = 120
    mostrar._x = 40
    mostrar._xscale = 90;
    mostrar._yscale = 76;
    }
    lo llama bien no hay problema
    ———————————-evolucion.swf—————————————-
    evolucion.swf tiene una serie de botones
    var contador = 0
    contenido.onEnterFrame = function()//contenido con clips de video
    {
    i = contador
    this.arbol.rrama_2.hoja.onPress = function()
    {
    contenido.arbol.rrama_2.play()
    }
    dentro de (contenido.arbol.rrama) hay un _root.contador += 1;
    el contador me sirve para en tal tiempo contador == 4 el arbol valla evolucionando por frames lo acabe todo terminado
    si rreprodusco el evolucion.swf si funciona
    si mi sitio.swf llama a evolucion.swf con un contenedor si funciona todo menos los _root., ningun _root.contador += 1 funciona espero y me ayudes denuevo

  13. mmmm, no me termina convenciendo que tengas un onPress dentro de un onEnterFrame.. pero bueno, tu problema se resuelve usando _level0 en lugar de _root, porque _root es solo la raíz de tu película, si esta cargada dentro de otra entonces esta por encima de _root, osea en _level0

  14. es una buena respuesta gracias,
    me podrias decir como funciona _level0 o como se usa lo que pasa es que yo estudie por mi propia cuenta y no fui a una escuela >_< gracias denuevo

  15. el _root es la raiz de tu película, pero puedes cargar películas usando por ejemplo loadMovieNum(«otro.swf»,2), el numero 2 indica que ese swf se cargará en el nivel 2 (osea _level2), y puedes referenciarte a las variables y películas de ese «otro.swf» usando _level2.peliculax_mc.variable, no es tan complicado, solo requiere un poquito de practica para entender.

  16. Joel no puedo hacer funcionar FileReference que puedo hacer,
    En internet no hay un tutorial para tontos de el
    Qué consejo me puedes dar, por si acaso es el mismo tutorial que a otros
    Chavos si les funciono y a otros no les funciono como a mí y lo modifique un poco

    import flash.net.FileReference;
    var fileUpload:FileReference = new FileReference();
    var path:String = «el sitio o extencion del sitio»
    var escucha:Object = {};
    var fileTypes:Array;
    var getFile:String;
    function init() {
    fileTypes = [{description:»Archivos de Imagen», extension:»*.jpg;*.gif;*jpeg;*.png», macType:»JPEG;jp2_;GIFF»}];
    boton_1.onPress = function() {doUpload()}
    boton_2.onPress = function() {doDownload()}
    fileUpload.addListener(escucha);
    escucha.onSelect = doSelect;
    escucha.onComplete = doComplete;
    escucha.onCancel = doCancel;
    escucha.onProgress = doProgress;
    data_mc.addEventListener(«change», setDownload);
    makeList();
    }
    function doComplete() {
    load_mc.barra_mc._xscale = 0;
    load_mc.label_txt.text = «Tranferencia Completa»;
    makeList();
    }
    function doProgress(archivo:FileReference, bLoaded:Number, bTotal:Number) {
    var porcentaje = Math.round((bLoaded*100)/bTotal);
    load_mc.label_txt.text = porcentaje+»% del archivo «+archivo.name;
    load_mc.barra_mc._xscale = porcentaje;
    }
    function doSelect(archivo:FileReference) {
    load_mc._visible = true;
    load_mc.barra_mc._xscale = 0;
    fileUpload.upload(path+»/uploadFile.php»);
    }
    function doDownload() {
    if (getFile != undefined) {
    fileUpload.download(path+»/»+getFile);
    }
    }
    function doUpload(event) {
    fileUpload.browse(fileTypes);
    }
    function setDownload(c:MovieClip) {
    getFile = c.target.selectedItem.Nombre;
    }
    function makeList() {
    data_mc.removeAll();
    var list_xml:XML = new XML();
    list_xml.ignoreWhite = true;
    list_xml.load(path+»/lista.php»);
    list_xml.onLoad = function() {
    var nodos = this.firstChild.childNodes;
    for (var a in nodos) {
    var size:Number = Math.ceil((nodos[a].attributes.tamanio/1024));
    data_mc.addItem({Nombre:nodos[a].attributes.name, Tamaño:size+» Kb»});
    }
    };
    }
    init();

  17. Hola Joel quisiera que me recomendaras un buen tutorial de php de fotografía o álbum, que tenga rollover y botones, no importa que sea video o manual esto es lo que e hecho :

    =1; $i–){
    $numeros = 14;
    if($i==9){$numeros=14;};
    if($i==8){$numeros=13;};
    if($i==7){$numeros=12;};
    if($i==6){$numeros=11;};
    if($i==5){$numeros=10;};
    if($i==4){$numeros=9;};
    if($i==3){$numeros=8;};
    if($i==2){$numeros=7;};
    if($i==1){$numeros=6;};
    echo ‘‘;
    if($i==1 or $i==4 or $i==7){
    echo »;
    }
    }
    ?>

    pienso usarlo con base de datos pero eso luego, En tu arsenal de tutoriales debes tener algo o no

  18. no subió lo demás a qui esta completo
    =1; $i–){
    $numeros = 14;
    if($i==9){$numeros=14;};
    if($i==8){$numeros=13;};
    if($i==7){$numeros=12;};
    if($i==6){$numeros=11;};
    if($i==5){$numeros=10;};
    if($i==4){$numeros=9;};
    if($i==3){$numeros=8;};
    if($i==2){$numeros=7;};
    if($i==1){$numeros=6;};
    echo ‘‘;
    if($i==1 or $i==4 or $i==7){
    echo »;
    }
    }
    ?>

  19. hola Joel tengo un problema con loadVariablesNum
    con loadVariablesNum me funciona esto afuera en el cuadro de dibujos de flash
    , hay un texto dinámico llamado news y en novedades.txt hay otro news todo bien
    loadVariablesNum(«novedades.txt», 0 );

    el problema es que tengo otro texto dinámico dentro de un clip esta dentro de un clip llamado ventana.news2 pero no funciona e intentado extraerlo al frame principal pero no funciona ni poniendo el loadVariableNum dentro del clip que me sugieres que agá

  20. no entiendo tu problema, tienes mi correo, porque no me envias el archivo?

    quisa sea cuestion de fuentes embebidas en el archivo.

  21. Pues funciona muy bien… en mi PC, pero cuando pongo el swf en mi Nokia se produce una malfunción que no sé resolver…(y no he sabido encontrar la solución en los foros…)

    Dentro del PDA, cuando seleccionas una fila en el Datagrid, no se ilumina el fondo, no se selecciona bien. Sólo se ilumina el fondo de la fila cuando es la que se encuentra en la parte superior de las filas visibles.

    Si alguien conocía este ‘bug’ y alguna forma de resolverlo, me sacaría del callejón dónde estoy metido.

    Gracias de antemano

  22. Excelente aporte, estoy tratando de aplicarlo, pero necesito aplicar color solo a filas con determinado valor, la columna Estatus puede tener tres valores diferentes y es la que debo evaluar, Tienes alguna sugerencia?

    Este es el codigo que estoy usando:

    var databaseFileLle:String = «Back.mdb»;
    var databasePasswordLle:String = «**********»;
    var pathLle:String = mdm.Application.path;
    mdm.Database.MSAccess.connectAbs(pathLle+databaseFileLle,databasePasswordLle);
    var successLle = mdm.Database.MSAccess.success();
    if (successLle == false) {
    var msgLle:String = «No se puede conectar a la bbdd»;
    mdm.Dialogs.prompt(msgLle);
    return;
    }
    //FUNCION PARA HACER LA CONSULTA A LA BBDD
    GridLlegadas.editable=true;
    function consultaLle(){
    GridLlegadas.removeAll();

    var sqlStringLle:String = «La cadena es muy larga por eso edito»;
    // Ejecutamos la consulta sql
    mdm.Database.MSAccess.select(sqlStringLle);
    // Comprobamos los errores
    var errorLle:Boolean = (mdm.Database.MSAccess.error() == «true»);
    if (errorLle) {
    var msgLle:String = «Ha ocurrido un error en la consulta!»;
    mdm.Dialogs.prompt(msgLle);
    return;
    }
    //Obtenemos los datos de la consulta
    var dataSetLle:Array = mdm.Database.MSAccess.getData();

    var datosLle:Object;
    var newItemsArrayLle:Array = new Array();

    for (var i = 0; i<dataSetLle.length;i++){
    datosLle = {};
    datosLle.Logo = dataSetLle[i][1];
    datosLle.NumVue = dataSetLle[i][2];
    datosLle.CodLug = dataSetLle[i][4];
    datosLle.Hor = dataSetLle[i][5];
    datosLle.Pue = dataSetLle[i][6];
    datosLle.Est = dataSetLle[i][7];
    newItemsArrayLle.push(datosLle);
    }
    GridLlegadas.dataProvider = newItemsArrayLle;
    }

    //FUNCION PARA MONTAR EL DATAGRID
    function layoutGUILle():Void {
    // Montamos el encabezado del datagrid
    GridLlegadas.setStyle("fontSize",30);

    GridLlegadas.columnNames = [ "Logo", "NumVue", "CodLug", "Hor", "Pue", "Est"];
    GridLlegadas.vScrollPolicy = "No";
    GridLlegadas.selectable= false;
    GridLlegadas.editable= false;

    GridLlegadas.rowHeight = 80;
    GridLlegadas.resizableColumns = false;
    GridLlegadas.sortableColumns = false;

    GridLlegadas.getColumnAt(0).width = 200;
    GridLlegadas.getColumnAt(0).headerText = "Aerolínea";
    GridLlegadas.getColumnAt(0).cellRenderer = "EleImagen";
    GridLlegadas.getColumnAt(0).setStyle("textAlign","Center");
    GridLlegadas.getColumnAt(1).width = 100;
    GridLlegadas.getColumnAt(1).headerText = "Vuelo Nº";
    GridLlegadas.getColumnAt(1).setStyle("textAlign","Center");
    GridLlegadas.getColumnAt(2).width = 100;
    GridLlegadas.getColumnAt(2).headerText = "Destino";
    GridLlegadas.getColumnAt(2).setStyle("textAlign","Center");
    GridLlegadas.getColumnAt(3).width = 100;
    GridLlegadas.getColumnAt(3).headerText = "Hora";
    GridLlegadas.getColumnAt(3).setStyle("textAlign","Center");
    GridLlegadas.getColumnAt(4).width = 100;
    GridLlegadas.getColumnAt(4).headerText = "Puerta";
    GridLlegadas.getColumnAt(4).setStyle("textAlign","Center");
    GridLlegadas.getColumnAt(5).width = 200;
    GridLlegadas.getColumnAt(5).headerText = "Estatus";
    GridLlegadas.getColumnAt(5).setStyle("textAlign","Left");
    GridLlegadas.setShowHeaders(false)
    GridLlegadas.setStyle("alternatingRowColors", [0xFFFFFF, 0xF9FCFD]);
    }
    layoutGUILle();
    consultaLle();

  23. Para poner un color determinado en una fila ( en funcion de un valor es muy sencillo veras:
    Primero averiguamos el numero de lineas que tiene el Datagrid , en mi caso lo llamo «tabla» con una colimna que se llama «Aficiones» y en funcion del valor de esa columna se coloreara de forma diferente el codigo es el siguiente:

    for (var i:Number = 0; i<tabla.length; i++) {

    if(tabla.getItemAt(i).Aficiones == "FUTBOL"){tabla.setPropertiesAt(i, {backgroundColor:0xCCCCFF});}

    if(tabla.getItemAt(i).Aficiones == "TEATRO"){tabla.setPropertiesAt(i, {backgroundColor:0xFFFF99});}

    if(tabla.getItemAt(i).Aficiones == "CICLISMO"){tabla.setPropertiesAt(i, {backgroundColor:0xFF00FF});}

    // Espero haberte ayudado UN SALUDO

    }

  24. Hola Joel me tiene loco el tema del datagrid. te mando el códico con la conexion a la bd y todo funciona bien pero a nivel de _root. La película se encuentra en nivel 5, o sea _level5 pero lo he probado en todos lados y no consigo que me muestre los datos. Si lo probás a nivel0 todo funciona perfecto. Un abrazo y desde ya muchas gracias.

    stop();
    //Importamos las clases para el Iterator y los Estilos
    import mx.data.components.datasetclasses.DataSetIterator
    import mx.styles.CSSStyleDeclaration
    System.useCodepage = true;

    //Estilo de la cabecera del grid
    var headerStyles = new CSSStyleDeclaration();
    headerStyles.setStyle(«textAlign», «center»);
    pelis_grid.setStyle(«headerStyle», headerStyles);
    pelis_grid.setStyle(«alternatingRowColors», Array(0xFFFFFF, 0xECF2F8));

    //Declaramos variables
    enviar_lv = new LoadVars();
    recibir_lv = new LoadVars();
    var recibirdat:LoadVars = new LoadVars();
    var ordenarHacia:String = new String(«asc»);
    var ordenarPor:String = new String();
    var miXML:XML = new XML();
    var pelisGrid:Array = new Array();
    var alOrdenar:Object = new Object();
    var alClicar:Object = new Object();
    var alSeleccionar:Object = new Object();
    var selec_str:String = new String();

    /***************************** EMPEZAMOS *********************************/

    //Cargamos el XML
    miXML.ignoreWhite = true;
    miXML.onLoad = function(success){
    //Cargamos y llenamos el array

    if (success){

    for (i=0; i<miXML.firstChild.firstChild.childNodes.length; i++){
    pelisGrid.addItem({Categoria:miXML.firstChild.firstChild.childNodes[i].childNodes[0].firstChild,
    Teoría:miXML.firstChild.firstChild.childNodes[i].childNodes[1].firstChild,
    Práctica_10:miXML.firstChild.firstChild.childNodes[i].childNodes[2].firstChild,
    Práctica_15:miXML.firstChild.firstChild.childNodes[i].childNodes[3].firstChild,
    Impuesto:miXML.firstChild.firstChild.childNodes[i].childNodes[4].firstChild,
    Por_clase:miXML.firstChild.firstChild.childNodes[i].childNodes[5].firstChild})
    }
    //Asignamos al DataSet y al DataGrid
    datos.items = pelisGrid;
    datos.filtered = false;
    pelis_grid.dataProvider = datos.dataProvider;

    //Propiedades del DataGrid
    pelis_grid.getColumnAt(0).width = 120;
    pelis_grid.getColumnAt(1).width = 100;
    pelis_grid.getColumnAt(2).width = 100;
    pelis_grid.getColumnAt(3).width = 100;
    pelis_grid.getColumnAt(4).width = 100;
    pelis_grid.getColumnAt(5).width = 100;
    pelis_grid.getColumnAt(0).setStyle("textAlign", "left");
    pelis_grid.getColumnAt(1).setStyle("textAlign", "center");
    pelis_grid.getColumnAt(2).setStyle("textAlign", "center");
    pelis_grid.getColumnAt(3).setStyle("textAlign", "center");
    pelis_grid.getColumnAt(4).setStyle("textAlign", "center");
    pelis_grid.getColumnAt(5).setStyle("textAlign", "center");
    //Deshabilitamos ordenación de las columnas, pero no las columnas
    for (i=0; i<3; i++){
    pelis_grid.getColumnAt(i).sortOnHeaderRelease = false;
    System.useCodepage = true;
    }
    }
    }
    miXML.load("http://www.systemcif.com.ar/Sistema/administrador/precios/mostrar_precio.php&quot;);

    /**************************** FUNCIONES *******************************/

    function modificar() {
    //enviar_lv.id = selec_str;
    enviar_lv.id = categoria_txt.text;
    enviar_lv.teoria = teoria_txt.text
    enviar_lv.practica_10 = prac10_txt.text;
    enviar_lv.practica_15 = prac15_txt.text;
    enviar_lv.impuesto = impuesto_txt.text;
    enviar_lv.x_clase = clases_txt.text;

    enviar_lv.sendAndLoad("http://www.systemcif.com.ar/Sistema/administrador/precios/modificar_precio.php&quot;, recibir_lv, "POST");
    }

    /**************************** EVENTOS *******************************/
    recibir_lv.onLoad = function(){
    gotoAndPlay(9);
    //Vaciamos todo y recargamos el DataGrid con los datos modificados
    pelisGrid.splice(0, pelisGrid.length);
    datos.clear();
    datos.filtered = false;
    pelis_grid.dataProvider = datos.dataProvider;

    _root.miXML.load("www.systemcif.com.ar/administrador/Sistema/precios/mostrar_precio.php");
    }

    // FILTRAMOS
    alClicar.click = function(objeto){

    if (objeto.target == modificar_btn){
    modificar();
    }
    }

    modificar_btn.addEventListener("click", alClicar);

    alSeleccionar.change = function(objeto){
    if (objeto.target == pelis_grid){
    selec_str = objeto.target.getItemAt(objeto.target.selectedIndex).Categoria;
    categoria_txt.text = objeto.target.getItemAt(objeto.target.selectedIndex).Categoria;
    teoria_txt.text = objeto.target.getItemAt(objeto.target.selectedIndex).Teoría;
    prac10_txt.text = objeto.target.getItemAt(objeto.target.selectedIndex).Práctica_10;
    prac15_txt.text = objeto.target.getItemAt(objeto.target.selectedIndex).Práctica_15;
    impuesto_txt.text = objeto.target.getItemAt(objeto.target.selectedIndex).Impuesto;
    clases_txt.text = objeto.target.getItemAt(objeto.target.selectedIndex).Por_clase;

    }
    }
    pelis_grid.addEventListener("change",alSeleccionar);

Comentarios cerrados.

Comentarios cerrados.