9 Replies Latest reply on Jan 18, 2010 9:51 AM by msakrejda

    How to use LIVE images within a flex app

    jimmyoneshot Level 1

      My App is composed of links to other websites. Currently these links are in the form of images which are basically static screenshots of the websites.

       

      What I want is for these images to instead be live i.e. what the website looks like currently. So if the website changes it's background colour etc this will change within the image making it a live screenshot. This is something my client wants so that the app is is basically self updatable. Can anyone help me out on how to do this please?

        • 1. Re: How to use LIVE images within a flex app
          msakrejda Level 4

          You can use an iframe hovered over the app (some have built components around embedding this in Flex) to display the HTML directly, or you can automatically regenerate the screenshots server-side at some interval (nightly, hourly, every minute--depending on what you need).

          1 person found this helpful
          • 2. Re: How to use LIVE images within a flex app
            jimmyoneshot Level 1

            Hmm. That sounds interesting but I'd struggle to do it code wise as I've never done that. Are there any examples you know of that show this being done?

             

            Cheers.

            • 3. Re: How to use LIVE images within a flex app
              jimmyoneshot Level 1

              Also I'm just checking out Iframe for the first time and it seems to be more of a way to embed website pages allowing you to make use of them within a flex app. All I want is live images of the site which once clicked will open up that particular site in an new instance of internet explorer if that makes sense.

               

              Could this be achieved with IFrame?

              • 4. Re: How to use LIVE images within a flex app
                msakrejda Level 4

                For that kind of thing, you may want to stick with just images in

                Flex, and make sure they're up-to-date by polling the web sites

                server-side and re-generating the images. I think it could be achieved

                with iframe and clickable transparent overlays, but scaling down the

                pages (especially images) could be tricky. You'll need to find a way

                to script a browser to generate screenshots on the server, which will

                also be tricky, but considerably less so. The other alternative is to

                parse the HTML and build thumbnails yourself in Flex, but that's just

                insane.

                1 person found this helpful
                • 5. Re: How to use LIVE images within a flex app
                  jimmyoneshot Level 1

                  I see what you mean about the clickable transparent overlays as this would stop the user interacting with the images which is what I want and I also see what you mean about it being hard to scale the images as it seems iframe has it's own scrollbars and includes the entire screen rather than thumbnails.

                   

                  My further problem is that I need to display these images in a tilelist that the user can scoll up and down and the images need to be drag and droppable between 2 tilelists. Yikes. They already are drag and droppable at the moment and are all displayed within a tilelist but I just need to make them live.

                   

                  Now I'm scared. Ha.

                  • 6. Re: How to use LIVE images within a flex app
                    msakrejda Level 4

                    Yeah, it won't be trivial, unfortunately. If I were you, I'd

                    investigate the server-side automated screenshot-refresh solution. On

                    Linux servers, you should be able to do something with imagemagick and

                    shell scripts, provided X is available. On a Windows system, you may

                    be able to do something through OLE automation of IE...

                    • 7. Re: How to use LIVE images within a flex app
                      jimmyoneshot Level 1

                      Yep I was hoping for a trivial solution to be honest.

                       

                      I didn't want to use any server side solutions as it's basically a desktop app which I wanted to be completely stand alone plus I'm very inexperienced at using flex with server side code etc.

                       

                      I'll look further into iframe though and see what I can come up with. Thanks for your help though.

                      • 8. Re: How to use LIVE images within a flex app
                        msakrejda Level 4

                        Ah, with a desktop app (AIR--if a straight Flash desktop app, this

                        does not apply), you should be able to use the HTML component, shrink

                        it with scaleX and scaleY, put an overlay on that for clicking, and

                        that should be enough. If you want to get fancy, you could then

                        capture that image (see, e.g., what AlivePDF does), cache it, and

                        re-use it until you decide it's out of date, so you don't need to

                        re-render all the pages.

                         

                        Sorry, when people ask Flex questions, I typically assume

                        browser-based unless explicitly stated otherwise. I think others do

                        too.

                        • 9. Re: How to use LIVE images within a flex app
                          jimmyoneshot Level 1

                          Excellent mate. I'm sure that'd work to get the images in. My fault for not mentioning that it was a desktop air app.

                           

                          The only tricky part will be putting them in a tilelist but I'll experiment and see what I can come up with and will post a new topic if I have problems.

                           

                          Thanks a lot. All the best.