9 Replies Latest reply on Nov 15, 2011 5:18 PM by Flex harUI

    Updating image source property but new image doesn't paint

    rexdtripod

      Making a slide show.  Slides are swf's on a remote server.  First one loads no problem at runtime when the program loads.  On hitting the "next slide" button I update the image object's source property with the url of the next slide.  The next slide is retreived from the server, but the image object doesn't repaint itself.  It does repaint if the user takes an action like resizing the slide show container, something I allow the user to do.  When the container resizes the new slide magically appears.  But if no action is taken, the slide just stays hidden.

       

      I've tried image.validateNow().  No dice.  Any suggestions?

        • 1. Re: Updating image source property but new image doesn't paint
          Flex harUI Adobe Employee

          mx:Image or Spark?  What is the container around it?  Are the SWFs the same size?

          • 2. Re: Updating image source property but new image doesn't paint
            rexdtripod Level 1

            Thanks for responding.

             

            Spark.  Container around it is Spark Group.  SWF's same size. 

             

            Try the experiment.  Throw some swf's on a server somewhere and feed a Spark Image url's to the swf's.  Each time you change the source property the swf's will be retreived but they won't display.  Image area just goes blank.  The swf is there, it just won't paint.  It'll paint if you do something else to the container - like run an animated resize effect on it.  Just magically pops up.

             

            Trying an experiment now to see if it does the same thing with .jpgs.  Back in a bit...

            • 3. Re: Updating image source property but new image doesn't paint
              rexdtripod Level 1

              Doesn't happen with jpg's.  There is a period where the image component goes blank while the URL request for the next jpg is being fulfilled, but when the next jpg is retrieved the image repaints.  My swf's are not large.  On average they're 50k - about twice the size of the jpg's.  I'd use jpg's but they look bad.  I allow my user to resize and I have a nice resize effect on them.  Swf's handle this really well.  Look great.

               

              I've tried invalidateDisplayList() and validateNow().  I'm guessing it's some sort of sync issue in the UI where repaint occurs before all data is retreived?  Not sure.  Anything I can do to tell the image to repaint explicitly?

              • 4. Re: Updating image source property but new image doesn't paint
                Flex harUI Adobe Employee

                Did you set trustedSource=false?

                • 5. Re: Updating image source property but new image doesn't paint
                  rexdtripod Level 1

                  Nope.  Appears it's a read only property anyway.  Swf's are loading which I'm guessing indicates source is trusted.  BitmapImage imageDisplay just not repainting.

                  • 6. Re: Updating image source property but new image doesn't paint
                    rexdtripod Level 1

                    Hmmmm.  I've set up a completeHandler which lets me know when a new image is loaded.  Then I set a break point inside it and it shows different values for the trustedSource property depending on time and image type loaded. 

                     

                    trustedSource for the jpg's are always true no matter when I check (first to the last one).  trustedSource for swf's is "true" for the first one and then "false" for subsequent ones.  jpg's and swf's are actually in the same directory on the server.  Not sure why swf's after the first one are coming up trustedSource "false"?

                    • 7. Re: Updating image source property but new image doesn't paint
                      Flex harUI Adobe Employee

                      Are they all coming from the same domain?

                      • 8. Re: Updating image source property but new image doesn't paint
                        rexdtripod Level 1

                        Yes.  Same domain as app.  And, as I say, jpg's and swf's in same directory.  jpg's display.

                         

                        As additional measure I placed a wide open crossdomain.xml file in the app root as well.

                         

                        The debug console reflects that the swf's are definitely loaded.  As I click through slides I get:

                         

                         

                        [SWF] /assets/swf/1.swf - 135,064 bytes after decompression

                        [SWF] /assets/swf/2.swf - 122,241 bytes after decompression

                        [SWF] /assets/swf/3.swf - 128,397 bytes after decompression

                        [SWF] /assets/swf/4.swf - 124,763 bytes after decompression

                        and so on.  No security violation messages and no swf not found messages.  This is consistent with the rest of the behavior.  If I run an animated resize on the image, all slides appear fine.  They are definitely making it to the client.  This is not a security violation problem.  Is it just a paint bug?  Can anyone else try the experiment and report results? 


                        This should get you started.  Just throw some swf's on a server and configure the proper URL in the code below:

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

                        <s:Application xmlns:fx="http://ns.adobe.com/mxml/2009"

                              xmlns:s="library://ns.adobe.com/flex/spark"

                              xmlns:mx="library://ns.adobe.com/flex/mx" minWidth="955" minHeight="600"

                              initialize="application1_initializeHandler(event)">

                        <fx:Script>

                          <![CDATA[

                           import mx.events.FlexEvent;

                           private var slideURL:String = "http://path to your server side swf folder";

                           private var numSlide:Number = 1;

                           private var suffix:String = ".swf";  

                          

                           protected function application1_initializeHandler(event:FlexEvent):void

                           {

                               slide.source = slideURL + String(numSlide) + suffix;

                           }

                          

                           protected function button_next_clickHandler(event:MouseEvent):void

                           {

                            numSlide++;

                            slide.source = slideURL + String(numSlide) + suffix;

                           }

                          

                          ]]>

                        </fx:Script>

                        <fx:Declarations>

                          <!-- Place non-visual elements (e.g., services, value objects) here -->

                        </fx:Declarations>

                        <s:Image id="slide"

                            width="400" height="300"

                            horizontalCenter="0" verticalCenter="0"/>

                        <s:Button id="button_next"

                             label="Next"

                             verticalCenter="200" horizontalCenter="0"

                             click="button_next_clickHandler(event)"/>

                        </s:Application>

                        • 9. Re: Updating image source property but new image doesn't paint
                          Flex harUI Adobe Employee

                          Spark Image may not be able to handle SWFs.  You may have to swap it out for SWFLoader.