Animated gif layered above background image

I have a static background image which is displayed in a JPanel. I need to display animated gifs at certain positions on the base image. For every new frame of the animation, the paint method is called whcih attempts to load the entire base image + all the new animated images which is extremely slow!. It also means the animated gif keeps on getting loaded, and seldom gets beyond the first frame.
Im sure many people have had to do something like this. Is the solution to draw the gifs on the glasspane (or use layered panes), and to have a seperate paint method? or is their a simple approach like setting a special clip area.

thanks for the help...
The size of the background image is approx 400*400 pixels (gif or jpg), and the icons are 25*25, and have between 1 and 6 frames.
Here comes the code... I havent finished with the mediatracker stuff, but youll get the idea Im sure.
  public void paint(Graphics g) {
    MediaTracker tracker = new MediaTracker(this);
    tracker.addImage(image,0);
    try {tracker.waitForID(0);}
    catch (InterruptedException e){}
    g.drawImage(image, 0, 0, this); //draw background image (approx 400*400 pixels)
    int ICON_ID = -1;
    Image img;
    //draw all the icons...
    //all icons have between 1 and 6 frames. 25*25 pixels.   
    for (int i = 0; i < icon_IDs.size(); i++) {
      try {
        ICON_ID = new Integer(icon_IDs.elementAt(i).toString()).intValue();
        Point p = dm.getIconPosition(ICON_ID);
        if (isAlarm(ICON_ID)) {        //ITS AN ALARM - use animated gif
          img = getAlarmImage(ICON_ID);
        else                          //NORMAL ICON - no animation
          img = DataDefinition.getImageIcon(dm.getIconType(ICON_ID)).getImage();
        tracker.addImage(img,0);
        try {tracker.waitForID(0);}
        catch (InterruptedException e){}
        int width = DataDefinition.getSize(dm.getIconType(ICON_ID)).width;
        int height = DataDefinition.getSize(dm.getIconType(ICON_ID)).height;
        g.setClip(p.x, p.y, p.x+width, p.y+height);
        g.drawImage(img, p.x, p.y, p.x+width, p.y+height, 0,0,img.getWidth(this),img.getHeight(this),this);
      catch (SQLException sqle) {
        System.out.println("Could not find position of icon : " + ICON_ID);
  }

Similar Messages

  • Animated GIF as a background image on a C5-00?

    Is there any way to get animated GIFs runnig as a background image on a C5-00? At the moment, it just shows a still picture....

    Yes, Captivate 7. I'm re-working an old Dreamweaver HTML CBT program to bring it up to today's standards using Captivate. I previously had small cartoon hands pointing to the right or left to click to go to the next or previous slide.The pointing hands are static, but on rollover I had an animated gif of the pointing hand moving in the direction it pointed. I'm certain I can figure out a workaround, just wanted to see if there was a built-in way to have an animation be the 'over' state.

  • Gif loader for background image

    I simply want to run an animated gif while my background image loads for a slideshow.
    I've searched the web and this forum for hours and can't get the various bits of code tips (ajax, jquery) to work because I'm a totaly idiot when it comes to code...i've tried cutting and pasting in many different configurations but can't get anything to work properly.
    Can someone help me out to get this to work?
    I have this slideshow:
    http://www.piquecollaborative.com/fox.html
    and want an animated gif to run during load of each page
    gif is this:
    http://www.piquecollaborative.com/images/loading.gif
    here is my code for the page(s)
    <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
    <html xmlns="http://www.w3.org/1999/xhtml">
    <head>
    <meta http-equiv="Content-Type" content="Matthew Fox Residence by PIQUE architecture, Peter Jahnke, Eric Meglasson" />
    <meta name="keywords" content="pique llc, architecture, emerging architects, young architects, northwest, peter jahnke, eric meglasson, keith ballantyne, collective studio, collected design" />
    <title>PIQUE: Fox House</title>
    <style type="text/css">
    .projectpage {
        font-family: "Trebuchet MS", Arial, Helvetica, sans-serif;
        color: #333;
    body,td,th {
        font-family: "Trebuchet MS", Arial, Helvetica, sans-serif;
        color: #333;
        font-size: 12px;
    body {
        background-image: url(images/fox-01.jpg);
        background-repeat: no-repeat;
    #title {
        position:absolute;
        width:350px;
        height:65px;
        z-index:1;
        left: 10px;
        top: 10px;
    #apDiv1 {
        position:absolute;
        width:108px;
        height:161px;
        z-index:2;
        top: 3px;
        left: 8px;
    #apDiv2 {
        position:absolute;
        width:237px;
        height:160px;
        z-index:3;
        left: 118px;
        top: 3px;
        text-align: right;
    #text {
        position:absolute;
        width:351px;
        height:194px;
        z-index:4;
        left: 10px;
        top: 90px;
        background-image: url(images/fox-01.jpg);
    #project-text {
        position:absolute;
        width:355px;
        height:300px;
        z-index:5;
        top: 288px;
        text-align: justify;
        left: 13px;
    #right-arrow {
        position:absolute;
        width:90px;
        height:330px;
        z-index:6;
        left: 915px;
        top: 270px;
    </style>
    <script type="text/javascript">
    function MM_preloadImages() { //v3.0
      var d=document; if(d.images){ if(!d.MM_p) d.MM_p=new Array();
        var i,j=d.MM_p.length,a=MM_preloadImages.arguments; for(i=0; i<a.length; i++)
        if (a[i].indexOf("#")!=0){ d.MM_p[j]=new Image; d.MM_p[j++].src=a[i];}}
    function MM_swapImgRestore() { //v3.0
      var i,x,a=document.MM_sr; for(i=0;a&&i<a.length&&(x=a[i])&&x.oSrc;i++) x.src=x.oSrc;
    function MM_findObj(n, d) { //v4.01
      var p,i,x;  if(!d) d=document; if((p=n.indexOf("?"))>0&&parent.frames.length) {
        d=parent.frames[n.substring(p+1)].document; n=n.substring(0,p);}
      if(!(x=d[n])&&d.all) x=d.all[n]; for (i=0;!x&&i<d.forms.length;i++) x=d.forms[i][n];
      for(i=0;!x&&d.layers&&i<d.layers.length;i++) x=MM_findObj(n,d.layers[i].document);
      if(!x && d.getElementById) x=d.getElementById(n); return x;
    function MM_swapImage() { //v3.0
      var i,j=0,x,a=MM_swapImage.arguments; document.MM_sr=new Array; for(i=0;i<(a.length-2);i+=3)
       if ((x=MM_findObj(a[i]))!=null){document.MM_sr[j++]=x; if(!x.oSrc) x.oSrc=x.src; x.src=a[i+2];}
    </script>
    </head>
    <body class="projectpage" onload="MM_preloadImages('images/arrow-rt-inv.png')">
    <div id="title"><img src="images/fox-title.gif" width="350" height="65" /></div>
    <div class="projectpage" id="text">
      <div id="apDiv2">Fox House<br />
        central Oregon<br />
        single family residence<br />
        4175 sqft<br />
        2010<br />
        Timberline construction, Elemental engineering </div>
      <div id="apDiv1">name:<br />
        location:<br />
        type:<br />
        size:<br />
        year:<br />
        collaborators: </div>
    <img src="images/line-dot-small.png" width="361" height="5" /><br />
    <br />
    <br />
    <br />
    <br />
    <br />
    <br />
    <br />
    <img src="images/line-dot-small.png" width="361" height="5" /> </div>
    <div id="project-text">
      <p> This home sits on a bluff  overlooking rolling sagebrush meadows   in Oregon&rsquo;s  High Desert  with views of the Cascade Mountains dominating    the western horizon. The owners, Matthew and Margherita Fox requested   an  extremely durable and energy efficient home for their family.  The   request  for a net zero house necessitated extensive use of photovoltaic   panels, ground  source heat-pumps, careful consideration of day   lighting and shading  strategies, and a super-insulated structure.  </p>
      <p>Italian architect and  childhood friend Maria Chiara Trevisan   created the original vision for the structure  as a gift to the Foxes.    The three masses, originally conceived as  parallelepipedo (rectangular   cubes) resting at various angles in the earth,  evolved into three   shelled structures clad in stone, a loose reference to the  Three   Sisters mountains which dominate the home&rsquo;s view.</p>
      <p>Photos by Nicole Werner, Bob Woodward, Peter Jahnke</p>
    </div>
    <div id="right-arrow"><a href="fox02.html"><img src="images/arrow-rt.png" alt="" name="Image1" width="48" height="48" border="0" id="Image1" onmouseover="MM_swapImage('Image1','','images/arrow-rt-inv.png',1)" onmouseout="MM_swapImgRestore()" /></a></div>
    </body>
    </html>
    can anyone help me get a leg up on this?  Sorry to be such a noob.  This is not my trade and i have more respect for you all now than ever before!  sorry again,

    You might want to reconsider the use of absolutely positioned div's for layout purposes...
    it often leads to big difficulties.http://www.apptools.com/examples/pagelayout101.php
    Regarding your loading gif, try defining a container for the picture
    and position your loading gif as a centered non-repeating background for container
    and insert your image in the container.

  • Animated Gif with large base image & small animated part.

    Hello guys
    I'm not really sure how to explain that, due to my limited English comprehansion. I will try with images.
    I can easily create animated gif out of multiple layers, given each layer is identical, with small changes accuring over time.
    But I yet to figure out an animated gif, that uses one large image for the base, and only small part of it is animated.
    I always get the animated part working, without the large base applying across all the frames. All it does, is flashes once
    the frame is reached and then moves on to being transparent, showing only the small animated part.
    For example, this is a GIF made with Galaxy S4, of my friend playing with his phone, imported into PS CS6. On the Galaxy,
    after I record the GIF, I can use my finder to touch, mask and freez parts I don't want to move, and leave only small, animated bit.
    When I import it to PS, it shows one layer with full image, and bunch of frames with the animation part only.
    http://i.imgur.com/UAiopQA.jpg
    http://i.imgur.com/7XOGGV6.jpg
    Problem is, once the image is open with PS, I'm not able to export it to keep it working in the same manner. Given the Samsung's
    gifs are 8 to 10mb, it's hard to edit it, to make it more size friendly.
    The gif clearly works the way I describe, so there is a setting or method I don't know about.
    If PS is not best tool for editing GIF, what other apps would you recommand I use for it?
    Thank you for the taking the time to read
    best regards
    Monica

    This has been an ongoing issue for me since I switched from Powerpoint to Keynote. Most of the animated gifs with transparent backgrounds that I used with Powerpoint are no longer transparent in Keynote. You may want to search for those earlier threads on this topic...
    To summarize: I've had to open up my animated gifs in After Effects and use the Color Key effect to restore transparency, with mixed success.
    Good luck!

  • Animated gif with transparent background

    When I import in Keynote an animated gif with transparent background. The background becomes white. I did the following tests:
    If I extract a single image from the animated gif and import it in keynote the background is actually transparent but it becomes white when I import the whole gif.
    I also checked with other applications (NeoOffice) and the animated gif does come out with a transparent background.
    Do I do something wrong in Keynote ?

    This has been an ongoing issue for me since I switched from Powerpoint to Keynote. Most of the animated gifs with transparent backgrounds that I used with Powerpoint are no longer transparent in Keynote. You may want to search for those earlier threads on this topic...
    To summarize: I've had to open up my animated gifs in After Effects and use the Color Key effect to restore transparency, with mixed success.
    Good luck!

  • Using animated gifs with transparent background.

    Hi guys,
    Keynotes 6.2.
    I have been onto apple support with this problem.
    I add a transparent animated gif to my project.
    It show as a movie correctly in the presentation but when exported as quicktime or HTML the movies fail.
    We eventually found out that quicktime does not support animated gifs. ( support.apple.com/kb/ht3775 )
    So I exported the animation onto a folder with all the frames separately and brought them into final cut pro.
    I then followed these tutorials on how to export with transparent background. ( http://provideocoalition.com/mspencer/video/fcp-x-and-alpha-channels and http://www.larryjordan.biz/fcp-export-transparency ).
    I now have a quicktime movie that if I bring back into Final Cut Pro it has a transparent background.
    However when I bring into keynotes it still has a black background. (presumably keynotes does not recognise the  Apple Prores 444).
    Any ideas how I can achieve what I need. ?
    I am using a program called crazytalk animator and can output with transparent background. Animated Gif or a series of image stills BMP, JPEG, TGA or PNG.
    Cheers
    SteveW

    This has been an ongoing issue for me since I switched from Powerpoint to Keynote. Most of the animated gifs with transparent backgrounds that I used with Powerpoint are no longer transparent in Keynote. You may want to search for those earlier threads on this topic...
    To summarize: I've had to open up my animated gifs in After Effects and use the Color Key effect to restore transparency, with mixed success.
    Good luck!

  • Adding animated gif to a still image, how do I do this?

    I used to know how to do it, but I've forgotten.
    Example:  The person who told me how to do it had taken an animated gif (butterfly) and placed it on her breast in a still photo of herself.  I know that she used Image Ready and as I recall, she created the same number of frames of the still image as the animated butterfly and then she somehow merged the two together.  Can someone help, is there a tutorial somewhere?  I'm using 7.0 by the way.
    Thanks,
    Ray
    P.S.  I also remember that it had something to do with linking the layers so that you just needed to place the first frame in the sequence and link all the other layers to it, but I'm totally lost now!

    I don't believe that PS 7.0 supports animation, 'least I don't know how to use this function if it does.  That is why I remember using Image Ready to do it.  In Image Ready you can use any animated gif file to do what I want, I just can't remember how I did it.  I do remember that I had to take my background image and duplicate it to get the same number of frames as the animated gif file, but I don't remember how I merged the two together.  It had something to do with placing the first frame of the animated gif where I wanted it on my background and then using the link tool in the layer box to link them together, that way I didn't have to place each individual frame of the animation on to the background and avoid an alignment nightmare.  I sure wish I would've taken notes!
    Thank you for your suggestions.
    Ray

  • How to export animated gif with transparent background and glow effect?

    I've been having issues lately with creating animated gifs in flash. I finally figured out a way to export a gif with a transparent background but I'm now having an issue with it again because I'm using a glow effect. When the gif is exported the glow effect changes into a very poor quality and becomes less of a glow and more like a solid color. I've even exported a png sequence from flash and put it into photoshop then created a gif from there but I'm still having the same issue. Is there anyway I can properly export this in gif form so the quality is the same as when I test it in flash?
    I've provided an image of what my issue looks like and the settings (I've messed around with the settings and this is the best I can come up with) . This is in photoshop but the result is similar in flash. The left one is what it originally looks like and the right is what it will look like after exporting. As you can see as I said before the glow changes into more of a solid color kind of like a border. Any help would be greatly appreciated, thanks in advance!

    A GIF is limited to 256 colors while a glow effect likely wants to tie up thousands (let's just say 'lots') of variations of tone.

  • Animated .gif file correction and image ready help.

    Hi,
    I have an animated gif created in an early verison of Image Ready & Photoshop. I need to make some changes. I have two problems.
    A: Can't figure how to do it in the current version of Photoshop.
    B: Open in the old image ready version, can't find the Layers pallet. I turn it on and off and it doesn't appear.
    Trying to recreate a rotating .gif file any pointers or how to's?
    Thanks,
    John

    You didn't say which version of ImageReady, but cs5 should open
    most animated gifs from ImageReady and show the frames in the
    Window>Animation panel. Some may not work right depending on
    how old the version of ImageReady was that created them.
    (you may have to resave the animation in ImageReady as a psd file)
    In ImageReady try Window>Workspace>Reset Palette Locations and the layers
    palette should be visible.
    In ImageReady, in the actions palette, are several actions to rotate (spin) images.
    MTSTUNER

  • How do i export a flash movie as an animated gif with transparent background?

    each export has the background in it.
    I have looked into the publish setting for gif but no option there, or in the background colour setting in the main design window has any Alpha or Transparency setting.

    Thought that issue went away. The only workaround I found was exporting a PNG sequence with transparency, importing it all back into a better animated GIF exporter like Fireworks as an image sequence and exporting it from there again. It will give you the best quality, control over the timeline, looping and various per-frame AGIF functionality.
    But yes, it's a multi-step headache.

  • Animated gifs appear to have image bleedthrough in Internet Explorer 9

    I have been using Photoshop on a Mac for several years to make animated gif files for our company website and for our customers as well and have never had a problem until recently. On some Windows computers, these files are now appearing with ghost images bleeding through from one frame to another. I have made sure that all layers that are not needed in a particular frame are turned off and I have tried various ways of saving the gif out of Photoshop but have had no luck. I did discover if I turned the option for transparency off in the Save for Web and Devices box the image bleed issue would go away, but then white lines appeared in my gifs instead. After doing some research it appears the image bleed problem is happening in the Internet Explorer 9 browser, but does not happen in any other browser I have tested - Safari, Firefox on Mac and Firefox on Windows. Has anyone run across this issue and found any way to resolve it? It's hard to explain to my customers that their files are fine when what they see on their screens is not. Thanks!

    Joel,
    You are doing nothing wrong and it is not a Photoshop issue, but a Microsoft one from what I understand after researching this earlier this year. If you were to check you would NOT have this problem in Firefox on a Windows computer, only IE. I believe it started with version 8, but can't swear to that, but I know for sure it was in IE 9. At any rate the way to "fix" it is to change the Compatibility View Mode in IE. Depending on how this view is set you may see any number of issues including the lines that you descrbe. I've included a screen shot showing where to change this. (The small icon next to the address bar.) On my computer when the icon is blue it displays incorrectly, when it is gray things look as they should. Or you can use Firefox and avoid the problem all together. We even had issues where it made our web content reflow around the graphics incorrectly if we didn't have this set correctly. What's bad about it is that it's hard to explain to your customer why their stuff looks wrong and Microsoft has known about this issue for quite a while and hasn't fixed it.
    Glad you posted on here so I could post back a fix. I usually do when I find a solution, but it took us several months to come up with what was happening and I'd forgotten to post back.

  • Animated gif only saving an image

    I have created an animated gif. 20 frames in the animation docker at the bottom of screen.
    http://imgh.us/PS_screen2.jpg     and http://imgh.us/PS_screen1.jpg  the last image is what the outcome is. Only a gif images 21kb big.  I have no idea what has gone wrong. Even when I play the animation in both the PS screen as well as in the save to web screen  -  it shows the frames being highlited in the animated frame docker=t but DOES NOT actaullay animate.PLEASE someonw help as all the forums just say save as gif in web whch is what I have done about 20 times now but still get one gif image at the end.

    Can anyone assist in this frustrating problem I am having. I have read so many google assists and theay all say the same thing.But when following thos instructions, All I still get is an image and not an animated gif.

  • Animated .gif as background of spryTabbedPanels tab selected

    So I am creating a website and want to use an animated .gif as the background of the tabs (make it look like the one you have selected is "smoking") however, whenever I try to use an animated .gif as the background-image of the .TabbedPanelsTabSelected, it doesn't show up at all, let alone animate. Is there some part of the Javascript that is interfering with this working? or is just not something I can do? I would be happy to provide code if its needed.

    Hi Steven;
      FWIW: PB does not support animated pictures in its tag page feature (or menus either BTW).
    However, if you make your own tab page using a Custom Visual User Object you could have animated pictures.
    Regards ... Chris

  • What best adobe programs to (design) and (create) animated gif or image ?

    Hello,
    first thank you very much for helping me,
    i am about creating an animated gif like the background you can see in war craft 3 frozen throne for a game,
    i have to design it first with high quality so i need to know best adobe programs can do that, although i need to know the easiest, so i need to know both of them the best and the easiest so if didn't made it with the best i can made it with the easiest pro, and please put in mind that i need a program to design the image from nothing so i will draw it or design it i don't know depending on the program it self but i will not use it for editing or use an image already there, i need an elite pro that allow to create the image from nothing.
    after that i need to create an animated gif for the image (gif not good for high quality images so if you know better please tell),
    for example "Her hair moves with the moving wind" so i need to move it, i don't know how so i need a program to make it move too.
    last thing at the end i need the file type be accepted in html(5) adobe games programs like flash builder or flash pro for example, i know flash pro can animate it but will not design it, thank you again.

    It may require a few different apps.  Clearly the number one app is you and your ability to conceptualize.  And, it depends on what type of animation you ultimately want produced.  Game graphics is a lot different than a web banner animated .gif.  I'm thinking Illustrator, Photoshop, Edge Animate, and After Effects.

  • Animated gif to be a Treenode image, can it?

    I would like to put the animated gif as a treenode image.
    But it doesn't show.
    Is there any way?

    I didn't read all the code here, only the heading, but maybe this could help:
    http://www.java2s.com/Code/Java/Swing-Components/AnimatedIconTreeExample.htm

Maybe you are looking for

  • "Unkown Error (-50)" when trying to change iPod settings via iTunes

    Hello everyone. I got an 5.5 iPod Video (30gb) for christmas and I can't update the name of the Ipod nor change the settings for music, TV shows, movies, podcasts, pictures or even reset it! I can however sync music, tv shows, movies and pocasts (not

  • Problem in executing cursor for loop

    hi all, I am facing following problem. We are using cron utility on unix to run pl/sql stored procedure. This procedure in turn calls separate procedures. However any one of the procedure does not end in pl/sql even though it has completed its intend

  • Does itunes offer edited music to download

    My 14 year old son wants an ipod for Christmas. I am concerned with him downloading the unedited music. Is there an option of downloaded edited music only?   Other OS  

  • Keystorking in a word/phrase

    This might be a question for the 'Tiger' Discussions but I'm working on a project in Numbers right now so maybe there's a Numbers specific answer. Anyway... I'm finding that I'm typing in the same phrase over and over again. I'm wondering that if, to

  • What is this light blue bar? (iOS 7)

    I have an iPhone 4s running iOS 7. On the lock screen, there is a small light blue bar (about an inch wide) right at the top of the screen, in the center, above the time display. What is this blue bar for? :confused: