Tutorial :Datagrid item rendering



Question:

I was trying to render a html text of some where around 10 strings concatenated together with with in a Datagrigd column . I am able to render it but not to the size of the cell . Im trying to embed this in a HBox and then place it in the cell . But Iam not able to resize to the cell as i see that the HBox is getting shrunk even though there is enough space with in the cell . Can somebody help me out in fitting this HBox to the size of the Datagrid cell .

I tried using UpdateDisplayList() but its getting into infinite loop and the screen is getting freeze . Please find the code below .

Below is the class iam making a call to the renderer .can somebody please help me out.

package components.myReports { import mx.collections.ArrayCollection; import mx.containers.HBox; import mx.containers.VBox; import mx.controls.DataGrid; import mx.controls.dataGridClasses.DataGridColumn; import mx.core.ClassFactory; import renderers.HtmlTextRenderer;

public class MyReportsComponent extends VBox  {      [Bindable]  

// public var metersList:ArrayCollection = model.Lookups.getInstance().metersList;

    private var _reportsList:ArrayCollection;        private var myReports:ArrayCollection = new ArrayCollection([              {name:"Christina Coenraets",description:"myReports1", dateRefreshed:"05-18-2009", dateCreated:"05-18-2009" , scheduledTime: "05-18-2009",operations:"" },              {name:"Christina Coenraets",description:"myReports1", dateRefreshed:"05-18-2009", dateCreated:"05-18-2009" , scheduledTime: "05-18-2009",operations:""},              {name:"Christina Coenraets",description:"myReports1", dateRefreshed:"05-18-2009", dateCreated:"05-18-2009" , scheduledTime: "05-18-2009",operations:""},              {name:"Christina Coenraets",description:"myReports1", dateRefreshed:"05-18-2009", dateCreated:"05-18-2009" , scheduledTime: "05-18-2009",operations:""},              {name:"Christina Coenraets",description:"myReports1", dateRefreshed:"05-18-2009", dateCreated:"05-18-2009" , scheduledTime: "05-18-2009",operations:""},              {name:"Christina Coenraets",description:"myReports1", dateRefreshed:"05-18-2009", dateCreated:"05-18-2009" , scheduledTime: "05-18-2009",operations:""},              {name:"Christina Coenraets",description:"myReports1", dateRefreshed:"05-18-2009", dateCreated:"05-18-2009" , scheduledTime: "05-18-2009",operations:""},              {name:"Christina Coenraets",description:"myReports1", dateRefreshed:"05-18-2009", dateCreated:"05-18-2009" , scheduledTime: "05-18-2009",operations:""},              {name:"Christina Coenraets",description:"myReports1", dateRefreshed:"05-18-2009", dateCreated:"05-18-2009" , scheduledTime: "05-18-2009",operations:""},              {name:"Christina Coenraets",description:"myReports1", dateRefreshed:"05-18-2009", dateCreated:"05-18-2009" , scheduledTime: "05-18-2009",operations:""},              {name:"Christina Coenraets",description:"myReports1", dateRefreshed:"05-18-2009", dateCreated:"05-18-2009" , scheduledTime: "05-18-2009",operations:""},              {name:"Christina Coenraets",description:"myReports1", dateRefreshed:"05-18-2009", dateCreated:"05-18-2009" , scheduledTime: "05-18-2009",operations:""},              {name:"Christina Coenraets",description:"myReports1", dateRefreshed:"05-18-2009", dateCreated:"05-18-2009" , scheduledTime: "05-18-2009",operations:""},              {name:"Christina Coenraets",description:"myReports1", dateRefreshed:"05-18-2009", dateCreated:"05-18-2009" , scheduledTime: "05-18-2009",operations:""}            ]);            public function MyReportsComponent()      {          //TODO: implement function          super();                    }        public function set reportsList(arr:ArrayCollection):void{            _reportsList = arr        }            override protected function createChildren():void  {          var dataGrid:DataGrid ;        var dataGridColumn:DataGridColumn;        var mainContainer:HBox;        this.removeAllChildren();          mainContainer = new HBox();        mainContainer.width = this.parent.width;        mainContainer.minHeight = 1000;        mainContainer.horizontalScrollPolicy = "off";        mainContainer.verticalScrollPolicy = "of";        mainContainer.percentHeight = 100;        mainContainer.percentWidth = 75;          dataGrid =  new DataGrid();          var row:Array=new Array("name","description","dateRefreshed","dateCreated","scheduledTime","operations");                     var colName:String;         var gridcolumns:Array=new Array();         for(var i:int=0;i<row.length;i++)              {                  dataGridColumn=new DataGridColumn();                dataGridColumn.dataField=row[i].toString();                trace(row[i].toString());               if(row[i].toString()== "operations")                  {                                        dataGridColumn.itemRenderer = new ClassFactory(HtmlTextRenderer);                                             dataGridColumn.width = 200;                  }else {                    dataGridColumn.width = 70;                  }               dataGridColumn.resizable=true;                   gridcolumns.push(dataGridColumn);           }           dataGrid.columns = gridcolumns;                 dataGrid.width = 700;        dataGrid.height= 400;        dataGrid.dataProvider = myReports;        mainContainer.addChild(dataGrid);        this.addChild(mainContainer);        this.validateNow();        }    }  

}

Renderer-----

package renderers { import mx.containers.HBox; import mx.controls.TextArea;

public class HtmlTextRenderer extends HBox  {      private var text:Array=new Array("Edit","Delete","Run","EMail","RetrieveFile","Public","Private","SharedReport","ScheduledReport");      private var html:String =  null;      public var operations:TextArea;         public function HtmlTextRenderer()      {          //TODO: implement function          super();      }      override protected function createChildren():void       {          super.createChildren();                     for(var i:int = 0 ;i < text.length ;i++)          {                               html+=targetHTML(text[i].toString());            }               operations = new TextArea();          operations.htmlText =  html;           this.percentWidth = 100;          this.percentHeight = 100;          this.addChild(operations);               }        private function targetHTML(name:String):String      {                     return "<a href='event:" + name +  "'>" + name + "</a>";      }        /* override protected function updateDisplayList(unscaledWidth:Number, unscaledHeight:Number):void{            super.updateDisplayList(unscaledWidth,unscaledHeight);          } */          private function updateSize()      {          var w:int = this.measuredWidth +100;          trace("The width of the Text is "+this.measuredWidth);          this.width = w;          this.parent.width = w;        }        }       

}


Solution:1

Have you tried just having the item renderer simply be a textArea?


Note:If u also have question or solution just comment us below or mail us on toontricks1994@gmail.com
Previous
Next Post »