2 Replies Latest reply on Dec 3, 2009 9:47 AM by BoydMills

    changing the background image of a canvas at runtime

    BoydMills Level 1

      =========

       

       

      [

      Bindable]protected var bgImage:Image;

       

      private

      private

       

       

      function GetConfigurationResult( event:WsVCIGetConfigurationDataResultEvent):void

      {

       

       

      var simage:String = event.result.Image;

       

      var decoded:ByteArray;

       

      decoder.decode( simage );

      decoded = decoder.toByteArray( );

      bgImage.data = decoded;

      setStyle(

      "backgroundImage", "assets/images/marshes2.jpg" );

       

       

      }

      =========

      The code above is the result event from a call to a web service to get the contents of an image file from and SQL database.

       

      Works ok up to bgImage.data = decoded;

       

      But using "setStyle" has no parameter for passing the bytearray data block of the image.

       

      The above code, calling [ ("backgroundImage", "assets/images/marshes2.jpg" ] does something, but not what I want.

       

      The web service is called from the canvas [ initialize="init();"] function.

       

      When I set canvas feature [ backgroundImage="{bgImage}" ] it resolves, but I get some error trap from some low level image handling module.

       

       

      How do I resolve a background  image during load at runtime?

        • 1. Re: changing the background image of a canvas at runtime
          BoydMills Level 1

          I think my original post was a little short on detail.

           

          The object bgImage:Image is populated by extracting the contents of an image file stored in an SQL database extracted by way of a web service.

           

          That all works, I get the bytearray of the image into my variable.

           

          I do this in other places where I am displaying an Image on top of (within ?) a canvas.

           

          My issue here is to use this bytearray that is the data section of an image file as the background for the canvas itself.

           

          Every example I have found requires the canvas background be loaded from an explicity file or be changed by refereing to a different explicity file.  What I need here is to load the background after making the round trip to a web service.

           

          Any words of wisdom?

           

           

          Boyd

          • 2. Re: changing the background image of a canvas at runtime
            BoydMills Level 1

            Since setStyle takes a string and an object for inputs, one would expect that the following would work

             

            ===========

             

             

            private function GetConfigurationResult( event:WsVCIGetConfigurationDataResultEvent):void

            {// retrieve the 64base encoded image from the web service by ResultEvent

            var

             

             

            bgImage:Image =new Image();

             

             

             

            var simage:String = event.result.Image;

             

            var decoded:ByteArray;

            var

             

             

            decoder:Base64Decoder = new Base64Decoder();

             

            decoder.decode( simage );

            decoded = decoder.toByteArray( );

            bgImage.data = decoded;

             

             

            setStyle(

            "backgroundImage", bgImage );

            }

            ============

            But this generates the following error:

            ==========

            Error: Unable to load 'Image52'.
            at mx.skins::RectangularBorder/updateDisplayList()[C:\autobuild\3.2.0\frameworks\projects\fr amework\src\mx\skins\RectangularBorder.as:237]
            at mx.skins.halo::HaloBorder/updateDisplayList()[C:\autobuild\3.2.0\frameworks\projects\fram ework\src\mx\skins\halo\HaloBorder.as:222]
            at mx.skins::ProgrammaticSkin/validateDisplayList()[C:\autobuild\3.2.0\frameworks\projects\f ramework\src\mx\skins\ProgrammaticSkin.as:421]
            at mx.managers::LayoutManager/validateDisplayList()[C:\autobuild\3.2.0\frameworks\projects\f ramework\src\mx\managers\LayoutManager.as:622]
            at mx.managers::LayoutManager/doPhasedInstantiation()[C:\autobuild\3.2.0\frameworks\projects \framework\src\mx\managers\LayoutManager.as:677]
            at Function/http://adobe.com/AS3/2006/builtin::apply()
            at mx.core::UIComponent/callLaterDispatcher2()[C:\autobuild\3.2.0\frameworks\projects\framew ork\src\mx\core\UIComponent.as:8628]
            at mx.core::UIComponent/callLaterDispatcher()[C:\autobuild\3.2.0\frameworks\projects\framewo rk\src\mx\core\UIComponent.as:8568]

             

            ==============

             

             

            But passing a filename to setStyle works!!!!

             

            But I need the image to come from a database!!!!!!

             

            Help!