1 Reply Latest reply on Jun 26, 2009 10:53 AM by ConsistencyHobgoblin

    Images from SQL Server in Flex DataGrid via SOAP.


      I have created a Web Service in C# that delivers thumbnails from SQL Server as byte arrays.  It works.  In C# I can create a client that will display the images using the web service.  I am trying to convert the byte array to a bitmap and use that as the source to a datagrid column with an <mx:Image> in the itemRenderer.  I have tryed several different approaches.


      Using the web service and displaying text is straight forward and I have no problem there.  When I try to use the byte array to create bitmap data and use it in a bitmap object as the source for the <mx:Image> the image is blank.  I wonder if this is an encoding or endean issue.  I'm not sure if there is a stream object as in C# that can be used without file I/O.  I can't see how to use the loader as it requires the result be available in a completion event and therefore limits returning it from a function.  Any direction would be appreciated.  Here is my code:





































































      <?xml version="1.0" encoding="utf-8"?>



      xmlns:mx="http://www.adobe.com/2006/mxml" layout="absolute" creationComplete="requestAllGenre();" width="640" height="480" xmlns:display="flash.display.*">




      <mx:ComboBox id="cboGenre" dataProvider="{colGenres}" labelField="GenreDescription" x="254" y="10" width="140"></mx:ComboBox>



      <mx:Label x="211" y="12" text="Genre:"/>



      <mx:DataGrid x="49.5" y="38" width="541" height="409" id="grdContent" allowMultipleSelection="false" editable="false" enabled="true" resizableColumns="true" showHeaders="true" sortableColumns="false" wordWrap="true" dataProvider="{colContents}">






           <mx:DataGridColumn headerText="Thumbnail" dataField="ThumbnailByteArray">








                     <mx:Component id="disp" >



                          <mx:HBox horizontalAlign="center">



                               <mx:Image id="img" source="{outerDocument.byteArrayToBitmap(data.ThumbnailByteArray)}" >





























           <mx:DataGridColumn headerText="Title" dataField="ContentName">








           <mx:DataGridColumn headerText="Description" dataField="ContentDescription">














      <mx:WebService id="ContentServ" showBusyCursor="true"wsdl="http://localhost:3628/ContentManWebService/ContentServ.asmx?wsdl" >




           <mx:operation name="GetAllGenre" resultFormat="object" result="genreResult(event)" >








           <mx:operation name="GetAllContent" resultFormat="object" result="contentResult(event)" >












      import mx.effects.Pause;



      import mx.utils.Base64Encoder;



      import mx.utils.Base64Decoder;



      import mx.core.Application;



      import mx.collections.ArrayCollection;



      import mx.controls.Alert;



      import mx.rpc.events.ResultEvent;



      import mx.graphics.codec.JPEGEncoder;



      import mx.events.FlexEvent;



      import flash.display.Bitmap;



      import flash.display.BitmapData;



      import flash.display.DisplayObject;



      import flash.display.Graphics;



      import flash.display.Sprite;



      import flash.events.Event;








      private var colGenres:ArrayCollection;






      private var colContents:ArrayCollection;




      private var bmpThumbnail:Bitmap;



      private var bImageRendered:Boolean;



      private var nWhileCount:int = 0;




      public function byteArrayToBitmap(ba:ByteArray):Bitmap {



           var bdatThumb:BitmapData = new BitmapData(75, 95, false);

           ba.position = 0;


      new Rectangle(75, 95),ba);



           var bmpThumbnailLocal:Bitmap = new Bitmap(bdatThumb);



           return bmpThumbnailLocal








      private function requestAllGenre():void{







      private function requestAllContent():void{







      // Gets called when the XML is successfully loaded.



      private function genreResult(event:ResultEvent):void{    

           colGenres = event.result

      as ArrayCollection;

           cboGenre.selectedIndex = 0;






      // Gets called when the XML is successfully loaded.



      private function contentResult(event:ResultEvent):void{

           colContents = event.result

      as ArrayCollection;






      private function btnSearch_OnClick(event:Event):void{














      <mx:Button x="402" y="10" label="Search" id="btnSearch" click="btnSearch_OnClick(event)" toolTip="Click to Find Matching Content"/>