Display moving image in Java Swing

Question

I\'m trying to display a high-width image in Java Swing (say 2000x100, like a heart rate strip). I need to show only a window of 500 width while it is slightly moving toward

Answer 1

To join the ends, paint the image twice as seen in this answer. The first paint would be the end of the image. The second paint would be the start of the image, offset by the width the end goes to.

E.G.

import java.awt.*;
import java.awt.event.*;
import java.awt.image.BufferedImage;
import javax.swing.*;

import java.net.URL;
import javax.imageio.ImageIO;

public class HeartBeat {

    public static void main(String[] args) throws Exception {
        URL url = new URL("http://i.stack.imgur.com/i8UJD.jpg");
        final BufferedImage bi = ImageIO.read(url);
        Runnable r = new Runnable() {

            @Override
            public void run() {
                final BufferedImage canvas = new BufferedImage(
                        bi.getWidth(), bi.getHeight(),
                        BufferedImage.TYPE_INT_RGB);
                final JLabel animationLabel = new JLabel(new ImageIcon(canvas));
                ActionListener animator = new ActionListener() {

                    int x = 0;

                    @Override
                    public void actionPerformed(ActionEvent e) {
                        Graphics2D g = canvas.createGraphics();

                        // paint last part of image in left of canvas
                        g.drawImage(bi, x, 0, null);
                        // paint first part of image immediately to the right
                        g.drawImage(bi, x + bi.getWidth(), 0, null);

                        // reset x to prevent hitting integer overflow
                        if (x%bi.getWidth()==0) x = 0;

                        g.dispose();
                        animationLabel.repaint();
                        x--;
                    }
                };
                Timer timer = new Timer(40, animator);
                timer.start();
                JOptionPane.showMessageDialog(null, animationLabel);
                timer.stop();
            }
        };
        // Swing GUIs should be created and updated on the EDT
        // http://docs.oracle.com/javase/tutorial/uiswing/concurrency
        SwingUtilities.invokeLater(r);
    }
}

Answer 2

The end of image should be concatenated with the beginning of the image. So it always repeats showing

Check out the Marquee Panel. You can add a JLabel with an ImageIcon to the MarqueePanel.

The MarqueePanel provides various method to customize the scrolling.

Edit:

The basic code would be:

MarqueePanel panel = new MarqueePanel();
panel.setWrap(true);
panel.setWrapAmount(0);
panel.setPreferredWidth(250);

JLabel label = new JLabel( new ImageIcon( "heartbeat.jpg" ) );
panel.add( label );

frame.add( panel );

If you want the image to fully appear at the left when it is displayed you can change the startScrolling() method and use scrollOffset = 0;.