4

I have created a custom JSlider that is used to zoom in and out on an image. I want to add a scroll bar when the image becomes to large to fit into my 400x400 frame so that the user is able to pan across the image, there should not be a scroll bar if the image fits the frame. I am very new to Swing so any help would be greatly appreciated I cant seem to get anything to work.

public class GraphicsOnly extends JComponent implements ChangeListener {  
JPanel gui;
/** Displays the image. */
JLabel imageCanvas;
Dimension size;  
double scale = 1.0;  
private BufferedImage image;




public GraphicsOnly() {  
    size = new Dimension(10,10);  
    setBackground(Color.black);  
    try {                
        image = ImageIO.read(new File("car.jpg"));

     } catch (IOException ex) {

     }
}  

public void setImage(Image image) {
    imageCanvas.setIcon(new ImageIcon(image));
}



public void initComponents() {
    if (gui==null) { 
        gui = new JPanel(new BorderLayout());
        gui.setBorder(new EmptyBorder(5,5,5,5));
        imageCanvas = new JLabel();
        JPanel imageCenter = new JPanel(new GridBagLayout());
        imageCenter.add(imageCanvas);
        JScrollPane imageScroll = new JScrollPane(imageCenter);
        imageScroll.setPreferredSize(new Dimension(300,100));
        gui.add(imageScroll, BorderLayout.CENTER);
    }
}



public Container getGui() {
    initComponents();
    return gui;
}



public void stateChanged(ChangeEvent e) {  
    int value = ((JSlider)e.getSource()).getValue();  
    scale = value/100.0;  
    repaint();  
    revalidate();  
}  


 protected void paintComponent(Graphics g) {
     super.paintComponent(g);
     Graphics2D g2 = (Graphics2D)g;  
     g2.setRenderingHint(RenderingHints.KEY_ANTIALIASING,  
             RenderingHints.VALUE_ANTIALIAS_ON); 
     int w = getWidth();  
     int h = getHeight();  
     int imageWidth = image.getWidth();  
     int imageHeight = image.getHeight();  
     double x = (w - scale * imageWidth)/2;  
     double y = (h - scale * imageHeight)/2;  
     AffineTransform at = AffineTransform.getTranslateInstance(x,y);  
     at.scale(scale, scale);  
     g2.drawRenderedImage(image, at);  
     setImage(image);

 }


public Dimension getPreferredSize() {  
    int w = (int)(scale*size.width);  
    int h = (int)(scale*size.height);  
    return new Dimension(w, h);  
}  



private JSlider getControl() {  
    JSlider slider = new JSlider(JSlider.HORIZONTAL, 0, 500, 50);  
    slider.setMajorTickSpacing(50);  
    slider.setMinorTickSpacing(25);  
    slider.setPaintTicks(true);  
    slider.setPaintLabels(true);  
    slider.addChangeListener(this);  
    return slider;          
}  


public static void main(String[] args) {  
    GraphicsOnly app = new GraphicsOnly();  
    JFrame frame = new JFrame();  
    frame.setDefaultCloseOperation(JFrame.EXIT_ON_CLOSE);  
    frame.setContentPane(app.getGui());
    app.setImage(app.image);

   // frame.getContentPane().add(new JScrollPane(app));  
    frame.getContentPane().add(app.getControl(), "Last");  
    frame.setSize(700, 500);  
    frame.setLocation(200,200);  
    frame.setVisible(true);  
} 
}
Wheels99
  • 87
  • 7
  • Scale the image to a new one and display the scaled image in a label in a scroll pane and everything will look after itself. – Andrew Thompson Nov 05 '14 at 08:10
  • `try { image = ImageIO.read(new File("car.jpg")); } catch (IOException ex) { }` When (not if) that fails, the person debugging it will benefit from an `ex.printStackTrace();` in that catch block (or better still, logging).. – Andrew Thompson Nov 05 '14 at 08:14
  • See [`ImageViewer`](http://stackoverflow.com/a/13463684/418556) for an example of the approach outlined in the first comment. – Andrew Thompson Nov 05 '14 at 08:16
  • I have changed my code and implemented the Jlabel. It is now displaying the image correctly and if I shrink my window the scroll bar appears as wanted, however now my custom slider is not zooming in and out on the image and i cannot figure out why...? – Wheels99 Nov 05 '14 at 08:59

1 Answers1

5

This version works. There were a number of problems with the attempt seen above, including that it was now mixing component painting with custom painting. I adapted the paintComponent method to instead paint a scaled image.

enter image description here

import java.awt.*;
import java.awt.geom.AffineTransform;
import java.awt.image.BufferedImage;
import javax.swing.*;
import javax.swing.border.EmptyBorder;
import javax.swing.event.*;

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

public class GraphicsOnly extends JComponent implements ChangeListener {

    JPanel gui;
    /**
     * Displays the image.
     */
    JLabel imageCanvas;
    Dimension size;
    double scale = 1.0;
    private BufferedImage image;

    public GraphicsOnly() {
        size = new Dimension(10, 10);
        setBackground(Color.black);
        try {
            image = ImageIO.read(new URL("https://i.stack.imgur.com/7bI1Y.jpg"));
        } catch (Exception ex) {
            ex.printStackTrace();
        }
    }

    public void setImage(Image image) {
        imageCanvas.setIcon(new ImageIcon(image));
    }

    public void initComponents() {
        if (gui == null) {
            gui = new JPanel(new BorderLayout());
            gui.setBorder(new EmptyBorder(5, 5, 5, 5));
            imageCanvas = new JLabel();
            JPanel imageCenter = new JPanel(new GridBagLayout());
            imageCenter.add(imageCanvas);
            JScrollPane imageScroll = new JScrollPane(imageCenter);
            imageScroll.setPreferredSize(new Dimension(300, 100));
            gui.add(imageScroll, BorderLayout.CENTER);
        }
    }

    public Container getGui() {
        initComponents();
        return gui;
    }

    public void stateChanged(ChangeEvent e) {
        int value = ((JSlider) e.getSource()).getValue();
        scale = value / 100.0;
        paintImage();
    }

    protected void paintImage() {
        int w = getWidth();
        int h = getHeight();
        int imageWidth = image.getWidth();
        int imageHeight = image.getHeight();
        BufferedImage bi = new BufferedImage(
                (int)(imageWidth*scale), 
                (int)(imageHeight*scale), 
                image.getType());
        Graphics2D g2 = bi.createGraphics();
        g2.setRenderingHint(RenderingHints.KEY_ANTIALIASING,
                RenderingHints.VALUE_ANTIALIAS_ON);
        double x = (w - scale * imageWidth) / 2;
        double y = (h - scale * imageHeight) / 2;
        AffineTransform at = AffineTransform.getTranslateInstance(0, 0);
        at.scale(scale, scale);
        g2.drawRenderedImage(image, at);
        setImage(bi);
    }

    public Dimension getPreferredSize() {
        int w = (int) (scale * size.width);
        int h = (int) (scale * size.height);
        return new Dimension(w, h);
    }

    private JSlider getControl() {
        JSlider slider = new JSlider(JSlider.HORIZONTAL, 0, 500, 50);
        slider.setMajorTickSpacing(50);
        slider.setMinorTickSpacing(25);
        slider.setPaintTicks(true);
        slider.setPaintLabels(true);
        slider.addChangeListener(this);
        return slider;
    }

    public static void main(String[] args) {
        GraphicsOnly app = new GraphicsOnly();
        JFrame frame = new JFrame();
        frame.setDefaultCloseOperation(JFrame.EXIT_ON_CLOSE);
        frame.setContentPane(app.getGui());
        app.setImage(app.image);

        // frame.getContentPane().add(new JScrollPane(app));  
        frame.getContentPane().add(app.getControl(), "Last");
        frame.setSize(700, 500);
        frame.setLocation(200, 200);
        frame.setVisible(true);
    }
}
Andrew Thompson
  • 168,117
  • 40
  • 217
  • 433