2 Replies Latest reply on Aug 14, 2006 12:45 AM by FrankAtcomm

    dynamic vbox backgroundcolor in renderer

    FrankAtcomm
      Hello,

      I have a datagrid with three colums:

      <mx:DataGrid id="dgImportSearchResults" click="doImportSelected();" width="250" x="0" bottom="0" top="225">
      <mx:columns>
      <mx:DataGridColumn headerText="Nr" width="60" itemRenderer="renderer_dg_importstatus" />
      <mx:DataGridColumn headerText="Destination" dataField="destination"/>
      <mx:DataGridColumn headerText="Bedrijf" dataField="supplier"/>
      </mx:columns>
      </mx:DataGrid>

      As you can see the first one uses a renderer to show different things within the same cell.
      This is the code for the renderer:

      <?xml version="1.0"?>
      <mx:HBox xmlns:mx=" http://www.adobe.com/2006/mxml" horizontalAlign="center" horizontalGap="5">
      <mx:VBox id="importcolor" height="100%" width="10" backgroundColor="{data.showcolor}" />
      <mx:Text id="importnr" width="100%" selectable="false" text="{data.importnr}" />
      </mx:HBox>

      The importnr is shown ok, but the backgroundColor doesn't do a thing ... it just stays black although the datafield showcolor contains #ff0000 or #00ff00.

      What am I doing wrong ?

      Thanks,
      Frank
        • 1. Re: dynamic vbox backgroundcolor in renderer
          FrankAtcomm Level 1
          I got the tip to use stylename at flexcoders, but also with no luck so far. Any ideas here ?

          <?xml version="1.0"?>
          <mx:HBox xmlns:mx=" http://www.adobe.com/2006/mxml" horizontalAlign="center" horizontalGap="5">
          <mx:Script>
          <![CDATA[
          import mx.controls.Alert;

          private function showErrorDialog(error:String):void {
          Alert.show(error, 'Alert Box', Alert.OK);
          }
          ]]>
          </mx:Script>

          <mx:Style>
          .status0 { backgroundColor: #FF0000; }
          .status1 { backgroundColor: #00FF00; }
          </mx:Style>

          <mx:VBox id="importcolor" height="100%" width="10" styleName="{data.showstyle}" click="showErrorDialog(data.showstyle);" />
          <!--backgroundColor="{data.showcolor}" -->
          <mx:Text id="importnr" width="100%" selectable="false" text="{data.importnr}" />
          </mx:HBox>
          • 2. dynamic vbox backgroundcolor in renderer
            FrankAtcomm Level 1
            found a solution myself...

            <mx:Script>
            <![CDATA[
            private function setImportStyle(doStyle:String):void {
            importcolor.styleName = doStyle;
            }
            ]]>
            </mx:Script>

            <mx:Style>
            .status0 { backgroundColor: #FF0000; }
            .status1 { backgroundColor: #00FF00; }
            </mx:Style>

            <mx:VBox id="importcolor" height="100%" width="10" render="setImportStyle(data.showstyle);" />
            <!--backgroundColor="{data.showcolor}" -->
            <mx:Text id="importnr" width="100%" selectable="false" text="{data.importnr}" />