smoothly move a JButton component to mouse click position in java - java

I have a little better than beginner level understanding of Java and I am having trouble with a student assignment. I had to turn a class (student.java) "into a button" - which I have done (that's why instead of creating a new instance of JButton, my code creates a new instance of "student"). I need to have the button relocate its position to wherever the user clicks the mouse. I have successfully done that, so my assignment requirements have been met.
However, I would like to have the button move smoothly to the location of the mouse click, as opposed to abruptly jumping from the previous position to the new position. Below is my code. The maths inside of the mouseClicked() method is what I have tried, but it has no effect on the motion of the button.
null layout is required
must use MouseListener (not ActionListener)
button must be an instance of class student
Any tips would be greatly appreciated. Thank you!
public myJPanel(){
super();
setLayout(null);
setBackground(Color.decode("#F5F2EB"));
setVisible(true);
setPreferredSize(new Dimension(640,480));
setMinimumSize(new Dimension(640,480));
setMaximumSize(new Dimension(640,480));
Font f = new Font("Copperplate Gothic Bold", Font.BOLD, 16);
student btn = new student("First","Last", num, "");
add(btn);
btn.setBounds(100, 150, 400, 90);
btn.setText(btn.getInfo());
btn.setBackground(Color.decode("#89A690"));
btn.setForeground(Color.decode("#F5F2EB"));
btn.setOpaque(true);
btn.setFont(f);
btn.setBorder(BorderFactory.createEmptyBorder(20, 40, 20, 40));
// move btn object
addMouseListener(new MouseAdapter() {
public void mouseClicked(MouseEvent e) {
int x = e.getX(); //mouse click x position
int y = e.getY(); //mouse click y position
int px = btn.getX() - x; //previous btn x position(to get distance between old / new position)
int py = btn.getY() - y; //previous btn y position(to get distance between old / new position)
double speed = 5; //speed
double ang = (float)Math.atan2(py, px) * 180 / Math.PI; //angle
x += Math.cos(ang * Math.PI/180) * speed; //move to x
y += Math.sin(ang * Math.PI/180) * speed; //move to y
btn.setLocation(x,y); //relocate button to new location
}});

You need some kind of animation concept in your code, simply updating the location will not move it smoothly. Changes you require
remove setLocation() code from mouse listener
a timer to trigger calculation and update of button position
interpolation of current position given elapsed time, angle etc.
Example. Here I've calculated total distance, and then interpolated "distance so far" based on time and speed.
Also note use of Math.toDegrees() and Math.toRadians(), although you don't really need them at all unless you want to use ang as degrees elsewhere...
public class Foo {
private static class Animate extends JPanel {
private JButton btn;
private int startX;
private int startY;
private long startTime;
private double ang;
private double distance;
public Animate() {
super();
setLayout(null);
btn = new JButton("Dr Horse");
btn.setBounds(100, 150, 40, 10);
add(btn);
addMouseListener(new MouseAdapter() {
public void mouseClicked(MouseEvent e) {
startX = btn.getX();
startY = btn.getY();
startTime = System.nanoTime();
int px = btn.getX() - e.getX();
int py = btn.getY() - e.getY();
distance = Math.sqrt(px * px + py * py);
ang = Math.toDegrees(Math.atan2(py, px));
}
});
Timer timer = new Timer(1000 / 20, new ActionListener() {
#Override
public void actionPerformed(ActionEvent e) {
double duration = (System.nanoTime() - startTime) / 1e6;
int speed = 50;// pixels per second
double distanceSoFar = Math.min(speed * duration / 1000d, distance);
int x = startX - (int) (distanceSoFar * Math.cos(Math.toRadians(ang)));
int y = startY - (int) (distanceSoFar * Math.sin(Math.toRadians(ang)));
btn.setLocation(x, y);
}
});
timer.setRepeats(true);
timer.start();
}
}
public static void main(String[] args) {
JFrame frame = new JFrame();
frame.getContentPane().add(new Animate());
frame.setSize(500, 400);
frame.setVisible(true);
}
}

Related

How can I draw a circle that compounds your cursor movement?

I am trying to draw a circle with my cursor while I am moving it. I know the circle wont be perfect but that does not really matter I just need the circle to compound on top of my organic cursor movements. I originally tried to do this with java's awt robot class but that ended up being futile because anytime I moved my mouse massive lines would extend infinitely far from where I made that movement. Here are two sets of code I tried (keep in mind I am calling these from a nativeMousePress event so I am holding down the left click the whole time).
int radius = 100;
for (double i = 0; i < (2 * Math.PI) + Math.PI / 6; i = i + Math.PI / 6) {
PointerInfo pointerA = MouseInfo.getPointerInfo();
Point a = pointerA.getLocation();
int yStart = (int) a.getY();
int xStart = (int) a.getX();
robot.mouseMove((int) ((xStart) + (radius * Math.cos(i))), (int) ((yStart) + (radius * Math.sin(i))));
robot.delay(68);
}
Here is my another attempt I had. I also want to mention that I need the delay in between each stroke.
robot.mouseMove(getX() + 40, getY() + 20);
robot.delay(1000);
robot.mouseMove(getX() + 20, getY() + 40);
robot.delay(1000);
robot.mouseMove(getX() - 20, getY() + 40);
robot.delay(1000);
robot.mouseMove(getX() - 40, getY() + 20);
robot.delay(1000);
robot.mouseMove(getX() - 40, getY() - 20);
robot.delay(1000);
robot.mouseMove(getX() - 20, getY() - 40);
robot.delay(1000);
robot.mouseMove(getX() + 20, getY() - 40);
robot.delay(1000);
robot.mouseMove(getX() + 40, getY() - 20);
public int getX() {
PointerInfo pointerA = MouseInfo.getPointerInfo();
Point a = pointerA.getLocation();
return (int) a.getX();
}
public int getY() {
PointerInfo pointerA = MouseInfo.getPointerInfo();
Point a = pointerA.getLocation();
return (int) a.getY();
}
Ok now here is the image that shows what happens when I barely move my mouse. This happens with both sets of code even though each set of code makes the circle slightly different.
Now to reiterate what I am trying to do I want to be able to move my mouse freely around the canvas while the code tries to make circles which should likely lead to a compounding effect. The issue is when I tried to use the robot class it completely bugs out and makes massive lines every which way if you attempt to move the mouse. I already asked other people about this and no one could figure out a solution to this so I am wondering if there is another class I can access that can do what I am looking for. Anyways here is a picture of what I assume it would look like if I moved my cursor to the right and if my circle code worked. (I already figured out how to do the loop effect)
Lastly I wanted to mention that I dont want a solution that provides code that can make the shape I showed above because thats not the point since I plan to do more complex things with this later. I just really need to know how to automate moving my cursor while having its movements compound with my active mouse movements.
The java.awt.Robot generates inputs events automatically. In your code, for one human input event, robot is generating 12 input events over 68x12 milliseconds. So while robot is still generating 12 events if human gives more input events then mouse pointer location will jump back and forth between robot inputs and human inputs. The problem is both robots and human are giving mouse coordinates at the same time.
one solution could be to ignore human events while robot is generating click events. But distinguishing between robot generated events and human generated events will be very hard task. And things will get complicated.
I think the easiest option will be to draw one circle for one human mouse drag input. Think it as circle/spring pattern brush. Like they have air brush in drawing tools.
I know you don't want the code. But to convey my points better here is minimal code for the approach:
import java.awt.Color;
import java.awt.Frame;
import java.awt.Graphics;
import java.awt.event.MouseEvent;
import java.awt.event.MouseMotionListener;
import java.awt.event.WindowAdapter;
import java.awt.event.WindowEvent;
public class Test extends Frame implements MouseMotionListener {
private int x1, y1, x2, y2;
private double i, radius = 10;
private Object lock = new Object();
public void init() throws Exception {
addWindowListener(new WindowAdapter() {
public void windowClosing(WindowEvent we) {
dispose();
System.exit(0);
}
});
addMouseMotionListener(this);
setBounds(50, 50, 500, 550);
setVisible(true);
}
public static void main(String[] argv) throws Exception {
new Test().init();
}
public void update(Graphics g) {
paint(g);
}
public void paint(Graphics g) {
g.setColor(Color.black);
g.drawLine(x1, y1, x2, y2);
}
public void mouseDragged(MouseEvent me) {
me.consume();
//do this to avoid multiple circles drawing at the same time
synchronized (lock) {
int x = me.getX();
int y = me.getY();
if (x1 == 0) x1 = x;
if (y1 == 0) y1 = y;
i=Math.PI+(Math.PI/6)*2;
for (int j = 0; j < 13; j++, i +=(Math.PI / 6)) {
x2 = (int) (x + (radius * Math.cos(i)));
y2 = (int) (y + (radius * Math.sin(i)));
paint(getGraphics());
x1 = x2;
y1 = y2;
radius += 0.3;
}
try {
Thread.sleep(150); //change delay to suite ease of use
} catch (InterruptedException e) {
e.printStackTrace();
}
}
}
public void mouseMoved(MouseEvent me) { //reset
synchronized(lock) {
radius = 10;
x1 = 0;
y1 = 0;
}
}
}
And the output:

How to get Specific Array List Item

I have a little issue with selecting from an array list. I am writing some code to enable me fix about 10 JButtons in a circle, I got that right, but then ..... I want to set an actionListener on each of the Buttons, but I don't get it, all the buttons inherit the actions required for one. How do I make it specific,... here's my code.... Thanks in advance!
private JButton quest;
public Beginner() {
int n = 10; // no of JButtons
int radius = 200;
Point center = new Point(250, 250);
double angle = Math.toRadians(360 / n);
List<Point> points = new ArrayList<Point>();
points.add(center);
for (int i = 0; i < n; i++) {
double theta = i * angle;
int dx = (int) (radius * Math.sin(theta));
int dy = (int) (radius * Math.cos(theta));
Point p = new Point(center.x + dx, center.y + dy);
points.add(p);
}
draw(points);
}
public void draw(List<Point> points) {
JPanel panels = new JPanel();
SpringLayout spring = new SpringLayout();
// Layout used
int count = 1;
for (Point point : points) {
quest = new JButton("Question " + count);
quest.setForeground(Color.BLUE);
Font fonte = new Font("Script MT Bold", Font.PLAIN, 20);
quest.setFont(fonte);
add(quest);
count++;
spring.putConstraint(SpringLayout.WEST, quest, point.x, SpringLayout.WEST, panels);
spring.putConstraint(SpringLayout.NORTH, quest, point.y, SpringLayout.NORTH, panels);
setLayout(spring);
panels.setOpaque(false);
panels.setVisible(true);
panels.setLocation(10, 10);
add(panels);
// action Listener to be set on individual buttons
quest.addActionListener(new ActionListener() {
public void actionPerformed(ActionEvent a) {
if (quest.equals(points.get(5)))
;
String c = "Hello!";
JOptionPane.showMessageDialog(null, c);
}
});
}
}
The problem is that expression
if (quest.equals(points.get(5)));
does nothing. I guess it should be rewritten like this
if (quest.equals(points.get(5))) {
String c = "Hello!";
JOptionPane.showMessageDialog(null, c);
}
The way I am understanding the question is that you have multiple buttons and you would like each button to have it's own action associated with it. There are a couple ways to go about doing this. Either you create a new ActionListener for each JButton depending which button you are creating.
You can also create a large case/switch or if/else within the ActionListener that gets determined by which button was selected. To do this you can call the getActionCommand() function for the ActionEvent object.
quest.addActionListener(new ActionListener() {
public void actionPerformed(ActionEvent a) {
if (a.getActionCommand().equals("Question 1"))
{
String c = "Hello!";
JOptionPane.showMessageDialog(null, c);
}
else if(a.getActionCommand().equals("Question 2"))
{
//have it do something else
}
//and so on so forth
}
});
You need to rethink the entire design. You have this line:
if (quest.equals(points.get(5))) {
But points is a list containing Point objects; points.get(5) returns a Point.
quest is a JButton. How can a JButton instance equal a Point instance?

paintComponent problems displaying

I am having a terrible time trying to display the triangles that I am trying to draw. I have looked over the web and and many of the options that I have found I implemented that haven't fixed my display issue. My button panel displays perfectly but my JPanel for drawing either isn't being used or isn't being drawn on. Any help that you guys can give would be great I've been staring for a few days and haven't had any luck. I have more code to implement but I want to get the bare-bones of my code running before I add too much. Here's my code thanks for any help ahead of time.
import java.awt.BorderLayout;
import java.awt.Color;
import java.awt.Dimension;
import java.awt.Graphics;
import java.awt.geom.Point2D;
import javax.swing.*;
public class RotateAndShiftTriangles extends JPanel{
int rWidth, rHeight, centerX, centerY, prevMove = -1, maxX, maxY;
float pixelSize;
double radians;
static Point2D pA, pB, pC;
//Default constructor
RotateAndShiftTriangles(){
rWidth = Integer.parseInt(JOptionPane.showInputDialog("Enter the rWidth of the panel: "));
rHeight = Integer.parseInt(JOptionPane.showInputDialog("Enter the rHeight of the panel: "));
}
// main method of the program that all it really does is call the create method
public static void main(String [] argv){
RotateAndShiftTriangles tri = new RotateAndShiftTriangles();
tri.create();
}
public void create(){
// Initializing graphics
JFrame win = new JFrame();
Dimension d = new Dimension(800, 600);
maxX = d.width - 1;
maxY = d.height - 1;
pixelSize = Math.max(rWidth/maxX, rHeight/maxY);
centerX = maxX/2; centerY = maxY/2;
win.setSize(d);
win.setMinimumSize(d);
win.setPreferredSize(d);
win.getContentPane().setLayout(new BorderLayout());
Point2D centerPoint = new Point2D.Double(centerX, centerY);
JPanel draw = new JPanel();
JPanel buttonPanel = new JPanel();
JButton shiftButton = new JButton("Shift");
JButton rotateButton = new JButton("Rotate");
JButton shiftandRotateButton = new JButton("Shift and Rotate");
JButton resetButton = new JButton("Reset");
JButton backButton = new JButton("Back");
// setting layout
win.add(this);
win.add(draw, BorderLayout.CENTER);
buttonPanel.add(shiftButton);
buttonPanel.add(rotateButton);
buttonPanel.add(shiftandRotateButton);
buttonPanel.add(resetButton);
buttonPanel.add(backButton);
win.add(buttonPanel, BorderLayout.SOUTH);
win.pack();
win.setLocationRelativeTo(win.getParent());
// makes window visible and sets the default closing operations
win.setVisible(true);
win.setDefaultCloseOperation(WindowConstants.EXIT_ON_CLOSE);
}
// Page 19 mappings to take the logical coords and change them to ints.
int iX(float x){
return Math.round(centerX + x/pixelSize);
}
int iY(float y){
return Math.round(centerY - y/pixelSize);
}
// Standard paintComponent method
protected void paintComponent(Graphics g){
super.paintComponent(g);
g.setColor(Color.blue);
g.drawRect(0, 0, maxX, maxY);
float side = 0.95F * pixelSize, sideHalf = 0.5F * side,
h = sideHalf * (float)Math.sqrt(3), xA, yA, xB, yB, xC, yC, xA1, yA1, xB1, yB1, xC1, yC1, p, q;
q = 0.05F;
p = 1 - q;
xA = centerX - sideHalf;
yA = centerY - 0.5F * h;
xB = centerX + sideHalf;
yB = yA;
xC = centerX;
yC = centerY + 0.5F * h;
pA.setLocation(xA, yA);
pB.setLocation(xB, yB);
pC.setLocation(xC, yC);
for (int i=0; i<50; i++)
{
g.drawLine(iX(xA), iY(yA), iX(xB), iY(yB));
g.drawLine(iX(xB), iY(yB), iX(xC), iY(yC));
g.drawLine(iX(xC), iY(yC), iX(xA), iY(yA));
xA1 = p * xA + q * xB;
yA1 = p * yA + q * yB;
xB1 = p * xB + q * xC;
yB1 = p * yB + q * yC;
xC1 = p * xC + q * xA;
yC1 = p * yC + q * yA;
xA = xA1; xB = xB1; xC = xC1;
yA = yA1; yB = yB1; yC = yC1;
}
}
}
win.add(this);
win.add(draw, BorderLayout.CENTER);
You add your triangle panel to the window. When you don't specify a constraint it will default to BorderLayout.CENTER.
Then you add the "draw" component, which replaces your panel since only one component can be added to the "CENTER".
Try adding your triangle panel to the BorderLayout.NORTH. However, when you do this you will also need to override the getPreferredSize() method of your triangle panel, otherwise the preferred size will be (0, 0) and there will be nothing to paint.
Read the section from the Swing tutorial on Custom Painting for more information and examples that do this.
Edit:
Taking a second look at your code, I'm not even sure why you created the "draw" panel. You don't add any components to it. So just get rid of the "draw" panel and let your "triangle" panel display in the BordeLayout.CENTER, but you still need to implement the getPreferredSize() method otherwise the pack() method will ignore the "triangle" panel.

JFrame Simple Application

I am working on creating a game for fun that basically is a simplistic representation for evolution.
Essentially, when I click on my moving ball it changes color. The goal is to continuously change until it matches the background color meaning the ball is successfully hidden. Eventually I will add more balls but I am trying to figure out how to change its color upon a mouse click. I have created the moving ball animation so far.
How can I change the ball color when I click on the ball?
Code:
public class EvolutionColor
{
public static void main( String args[] )
{
JFrame frame = new JFrame( "Bouncing Ball" );
frame.setDefaultCloseOperation( JFrame.EXIT_ON_CLOSE );
BallPanel bp = new BallPanel();
frame.add( bp );
frame.setSize( 1800, 1100 ); // set frame size
frame.setVisible( true ); // display frame
bp.setBackground(Color.YELLOW);
} // end main
}
class BallPanel extends JPanel implements ActionListener
{
private int delay = 10;
protected Timer timer;
private int x = 0; // x position
private int y = 0; // y position
private int radius = 15; // ball radius
private int dx = 2; // increment amount (x coord)
private int dy = 2; // increment amount (y coord)
public BallPanel()
{
timer = new Timer(delay, this);
timer.start(); // start the timer
}
public void actionPerformed(ActionEvent e)
// will run when the timer fires
{
repaint();
}
public void mouseClicked(MouseEvent arg0)
{
System.out.println("here was a click ! ");
}
// draw rectangles and arcs
public void paintComponent( Graphics g )
{
super.paintComponent( g ); // call superclass's paintComponent
g.setColor(Color.red);
// check for boundaries
if (x < radius) dx = Math.abs(dx);
if (x > getWidth() - radius) dx = -Math.abs(dx);
if (y < radius) dy = Math.abs(dy);
if (y > getHeight() - radius) dy = -Math.abs(dy);
// adjust ball position
x += dx;
y += dy;
g.fillOval(x - radius, y - radius, radius*2, radius*2);
}
}
Take a look at How to Write a Mouse Listener.
Don't make decisions about the state of the view in the paintComponent, painting can occur for any number of reasons, many you don't control. Instead, make theses decisions within the actionPerformed method of your Timer
You may also wish to consider changing your design slightly. Rather then having the balls as JPanels, you create a virtual concept of a ball, which contains all the properties and logic it needs and use the JPanel to paint them. You could then store them in some kind of List, each time you register a mouse click you could iterate the List and check to see if any of the balls were clicked
Have look at Java Bouncing Ball for an example
Instead of hard-coding the color (g.setColor(Color.red);), why not create an attribute:
g.setColor(currentColor);
Then when you click in the circle area, change currentColor.

Zoomable JScrollPane - setViewPosition fails to update

I'm trying to code a zoom-able image in a JScrollPane.
When the image is fully zoomed out it should be centered horizontally and vertically. When both scroll bars have appeared the zooming should always happen relative to the mouse coordinate, i.e. the same point of the image should be under the mouse before and after the zoom event.
I have almost achieves my goal. Unfortunately the "scrollPane.getViewport().setViewPosition()" method sometimes fails to update the view position correctly. Calling the method twice (hack!) overcomes the issue in most cases, but the view still flickers.
I have no explanation as to why this is happening. However I'm confident that it's not a math problem.
Below is a MWE. To see what my problem is in particular you can do the following:
Zoom in until you have some scroll bars (200% zoom or so)
Scroll into the bottom right corner by clicking the scroll bars
Place the mouse in the corner and zoom in twice. The second time you'll see how the scroll position jumps towards the center.
I would really appreciate if someone could tell me where the problem lies. Thank you!
package com.vitco;
import javax.swing.*;
import java.awt.*;
import java.awt.event.MouseAdapter;
import java.awt.event.MouseWheelEvent;
import java.awt.image.BufferedImage;
import java.util.Random;
/**
* Zoom-able scroll panel test case
*/
public class ZoomScrollPanel {
// the size of our image
private final static int IMAGE_SIZE = 600;
// create an image to display
private BufferedImage getImage() {
BufferedImage image = new BufferedImage(IMAGE_SIZE, IMAGE_SIZE, BufferedImage.TYPE_INT_RGB);
Graphics g = image.getGraphics();
// draw the small pixel first
Random rand = new Random();
for (int x = 0; x < IMAGE_SIZE; x += 10) {
for (int y = 0; y < IMAGE_SIZE; y += 10) {
g.setColor(new Color(rand.nextInt(255),rand.nextInt(255),rand.nextInt(255)));
g.fillRect(x, y, 10, 10);
}
}
// draw the larger transparent pixel second
for (int x = 0; x < IMAGE_SIZE; x += 100) {
for (int y = 0; y < IMAGE_SIZE; y += 100) {
g.setColor(new Color(rand.nextInt(255),rand.nextInt(255),rand.nextInt(255), 180));
g.fillRect(x, y, 100, 100);
}
}
return image;
}
// the image panel that resizes according to zoom level
private class ImagePanel extends JPanel {
private final BufferedImage image = getImage();
#Override
public void paintComponent(Graphics g) {
super.paintComponent(g);
Graphics2D g2 = (Graphics2D)g.create();
g2.scale(scale, scale);
g2.drawImage(image, 0, 0, null);
g2.dispose();
}
#Override
public Dimension getPreferredSize() {
return new Dimension((int)Math.round(IMAGE_SIZE * scale), (int)Math.round(IMAGE_SIZE * scale));
}
}
// the current zoom level (100 means the image is shown in original size)
private double zoom = 100;
// the current scale (scale = zoom/100)
private double scale = 1;
// the last seen scale
private double lastScale = 1;
public void alignViewPort(Point mousePosition) {
// if the scale didn't change there is nothing we should do
if (scale != lastScale) {
// compute the factor by that the image zoom has changed
double scaleChange = scale / lastScale;
// compute the scaled mouse position
Point scaledMousePosition = new Point(
(int)Math.round(mousePosition.x * scaleChange),
(int)Math.round(mousePosition.y * scaleChange)
);
// retrieve the current viewport position
Point viewportPosition = scrollPane.getViewport().getViewPosition();
// compute the new viewport position
Point newViewportPosition = new Point(
viewportPosition.x + scaledMousePosition.x - mousePosition.x,
viewportPosition.y + scaledMousePosition.y - mousePosition.y
);
// update the viewport position
// IMPORTANT: This call doesn't always update the viewport position. If the call is made twice
// it works correctly. However the screen still "flickers".
scrollPane.getViewport().setViewPosition(newViewportPosition);
// debug
if (!newViewportPosition.equals(scrollPane.getViewport().getViewPosition())) {
System.out.println("Error: " + newViewportPosition + " != " + scrollPane.getViewport().getViewPosition());
}
// remember the last scale
lastScale = scale;
}
}
// reference to the scroll pane container
private final JScrollPane scrollPane;
// constructor
public ZoomScrollPanel() {
// initialize the frame
JFrame frame = new JFrame();
frame.setDefaultCloseOperation(WindowConstants.EXIT_ON_CLOSE);
frame.setSize(600, 600);
// initialize the components
final ImagePanel imagePanel = new ImagePanel();
final JPanel centerPanel = new JPanel();
centerPanel.setLayout(new GridBagLayout());
centerPanel.add(imagePanel);
scrollPane = new JScrollPane(centerPanel);
scrollPane.setVerticalScrollBarPolicy(ScrollPaneConstants.VERTICAL_SCROLLBAR_ALWAYS);
scrollPane.setHorizontalScrollBarPolicy(ScrollPaneConstants.HORIZONTAL_SCROLLBAR_ALWAYS);
frame.add(scrollPane);
// add mouse wheel listener
imagePanel.addMouseWheelListener(new MouseAdapter() {
#Override
public void mouseWheelMoved(MouseWheelEvent e) {
super.mouseWheelMoved(e);
// check the rotation of the mousewheel
int rotation = e.getWheelRotation();
boolean zoomed = false;
if (rotation > 0) {
// only zoom out until no scrollbars are visible
if (scrollPane.getHeight() < imagePanel.getPreferredSize().getHeight() ||
scrollPane.getWidth() < imagePanel.getPreferredSize().getWidth()) {
zoom = zoom / 1.3;
zoomed = true;
}
} else {
// zoom in until maximum zoom size is reached
double newCurrentZoom = zoom * 1.3;
if (newCurrentZoom < 1000) { // 1000 ~ 10 times zoom
zoom = newCurrentZoom;
zoomed = true;
}
}
// check if a zoom happened
if (zoomed) {
// compute the scale
scale = (float) (zoom / 100f);
// align our viewport
alignViewPort(e.getPoint());
// invalidate and repaint to update components
imagePanel.revalidate();
scrollPane.repaint();
}
}
});
// display our frame
frame.setVisible(true);
}
// the main method
public static void main(String[] args) {
new ZoomScrollPanel();
}
}
Note: I have also looked at the question here JScrollPane setViewPosition After "Zoom" but unfortunately the problem and solution are slightly different and do not apply.
Edit
I have solved the issue by using a hack, however I'm still no closer to understanding as to what the underlying problem is. What is happening is that when the setViewPosition is called some internal state changes trigger additional calls to setViewPosition. These additional calls only happen occasionally. When I'm blocking them everything works perfectly.
To fix the problem I simply introduced a new boolean variable "blocked = false;" and replaced the lines
scrollPane = new JScrollPane(centerPanel);
and
scrollPane.getViewport().setViewPosition(newViewportPosition);
with
scrollPane = new JScrollPane();
scrollPane.setViewport(new JViewport() {
private boolean inCall = false;
#Override
public void setViewPosition(Point pos) {
if (!inCall || !blocked) {
inCall = true;
super.setViewPosition(pos);
inCall = false;
}
}
});
scrollPane.getViewport().add(centerPanel);
and
blocked = true;
scrollPane.getViewport().setViewPosition(newViewportPosition);
blocked = false;
I would still really appreciate if someone could make sense of this!
Why does this hack work? Is there a cleaner way to achieve the same functionality?
Here is the completed, fully functional Code. I still don't understand why the hack is necessary, but at least it now works as expected:
import javax.swing.*;
import java.awt.*;
import java.awt.event.MouseAdapter;
import java.awt.event.MouseWheelEvent;
import java.awt.image.BufferedImage;
import java.util.Random;
/**
* Zoom-able scroll panel
*/
public class ZoomScrollPanel {
// the size of our image
private final static int IMAGE_SIZE = 600;
// create an image to display
private BufferedImage getImage() {
BufferedImage image = new BufferedImage(IMAGE_SIZE, IMAGE_SIZE, BufferedImage.TYPE_INT_RGB);
Graphics g = image.getGraphics();
// draw the small pixel first
Random rand = new Random();
for (int x = 0; x < IMAGE_SIZE; x += 10) {
for (int y = 0; y < IMAGE_SIZE; y += 10) {
g.setColor(new Color(rand.nextInt(255),rand.nextInt(255),rand.nextInt(255)));
g.fillRect(x, y, 10, 10);
}
}
// draw the larger transparent pixel second
for (int x = 0; x < IMAGE_SIZE; x += 100) {
for (int y = 0; y < IMAGE_SIZE; y += 100) {
g.setColor(new Color(rand.nextInt(255),rand.nextInt(255),rand.nextInt(255), 180));
g.fillRect(x, y, 100, 100);
}
}
return image;
}
// the image panel that resizes according to zoom level
private class ImagePanel extends JPanel {
private final BufferedImage image = getImage();
#Override
public void paintComponent(Graphics g) {
super.paintComponent(g);
Graphics2D g2 = (Graphics2D)g.create();
g2.scale(scale, scale);
g2.drawImage(image, 0, 0, null);
g2.dispose();
}
#Override
public Dimension getPreferredSize() {
return new Dimension((int)Math.round(IMAGE_SIZE * scale), (int)Math.round(IMAGE_SIZE * scale));
}
}
// the current zoom level (100 means the image is shown in original size)
private double zoom = 100;
// the current scale (scale = zoom/100)
private double scale = 1;
// the last seen scale
private double lastScale = 1;
// true if currently executing setViewPosition
private boolean blocked = false;
public void alignViewPort(Point mousePosition) {
// if the scale didn't change there is nothing we should do
if (scale != lastScale) {
// compute the factor by that the image zoom has changed
double scaleChange = scale / lastScale;
// compute the scaled mouse position
Point scaledMousePosition = new Point(
(int)Math.round(mousePosition.x * scaleChange),
(int)Math.round(mousePosition.y * scaleChange)
);
// retrieve the current viewport position
Point viewportPosition = scrollPane.getViewport().getViewPosition();
// compute the new viewport position
Point newViewportPosition = new Point(
viewportPosition.x + scaledMousePosition.x - mousePosition.x,
viewportPosition.y + scaledMousePosition.y - mousePosition.y
);
// update the viewport position
blocked = true;
scrollPane.getViewport().setViewPosition(newViewportPosition);
blocked = false;
// remember the last scale
lastScale = scale;
}
}
// reference to the scroll pane container
private final JScrollPane scrollPane;
// constructor
public ZoomScrollPanel() {
// initialize the frame
JFrame frame = new JFrame();
frame.setDefaultCloseOperation(WindowConstants.EXIT_ON_CLOSE);
frame.setSize(600, 600);
// initialize the components
final ImagePanel imagePanel = new ImagePanel();
final JPanel centerPanel = new JPanel();
centerPanel.setLayout(new GridBagLayout());
centerPanel.add(imagePanel);
scrollPane = new JScrollPane();
scrollPane.setViewport(new JViewport() {
private boolean inCall = false;
#Override
public void setViewPosition(Point pos) {
if (!inCall || !blocked) {
inCall = true;
super.setViewPosition(pos);
inCall = false;
}
}
});
scrollPane.getViewport().add(centerPanel);
scrollPane.setVerticalScrollBarPolicy(ScrollPaneConstants.VERTICAL_SCROLLBAR_ALWAYS);
scrollPane.setHorizontalScrollBarPolicy(ScrollPaneConstants.HORIZONTAL_SCROLLBAR_ALWAYS);
frame.add(scrollPane);
// add mouse wheel listener
imagePanel.addMouseWheelListener(new MouseAdapter() {
#Override
public void mouseWheelMoved(MouseWheelEvent e) {
super.mouseWheelMoved(e);
// check the rotation of the mousewheel
int rotation = e.getWheelRotation();
boolean zoomed = false;
if (rotation > 0) {
// only zoom out until no scrollbars are visible
if (scrollPane.getHeight() < imagePanel.getPreferredSize().getHeight() ||
scrollPane.getWidth() < imagePanel.getPreferredSize().getWidth()) {
zoom = zoom / 1.3;
zoomed = true;
}
} else {
// zoom in until maximum zoom size is reached
double newCurrentZoom = zoom * 1.3;
if (newCurrentZoom < 1000) { // 1000 ~ 10 times zoom
zoom = newCurrentZoom;
zoomed = true;
}
}
// check if a zoom happened
if (zoomed) {
// compute the scale
scale = (float) (zoom / 100f);
// align our viewport
alignViewPort(e.getPoint());
// invalidate and repaint to update components
imagePanel.revalidate();
scrollPane.repaint();
}
}
});
// display our frame
frame.setVisible(true);
}
// the main method
public static void main(String[] args) {
new ZoomScrollPanel();
}
}
Some time ago I was facing the same issue. I had some scalable/zoomable content (SWT widgets) stored in Viewport in JScrollPane and some features implemented to enable panning and zooming the content. I didn't look into your code if it's basically the same, but the issue that I was observing was completely the same. When zooming outside from the right/bottom side, sometimes, the view position jumped a little bit into the center (from my point-of-view that definitely points to a scale factor). Using doubled "setViewPosition" somehow enhanced the behavior but still not usable.
After some investigation, I've found out that the issue on my side was between the moment when I changed the scale factor of the content inside the scroll panel and the moment when view position was set in scroll panel. The thing is that scroll panel doesn't know about the content size updates until layout is done. So basically, it's updating the position based on old content size, extent size and view position.
So, at my side, this helped a lot.
// updating scroll panel content scale goes here
viewport.doLayout();
// setting view position in viewport goes here
Checking method BasicScrollPaneUI#syncScrollPaneWithViewport() was very useful on my side.
very useful example, excellent zoom at mouse pointer, here is the same code slightly modified to include mouse panning:
original code added taken from --> Scroll JScrollPane by dragging mouse (Java swing)
import javax.swing.*;
import java.awt.*;
import java.awt.event.MouseAdapter;
import java.awt.event.MouseEvent;
import java.awt.event.MouseWheelEvent;
import java.awt.image.BufferedImage;
import java.util.Random;
/**
* Zoom-able scroll panel
*/
// https://stackoverflow.com/questions/22649636/zoomable-jscrollpane-setviewposition-fails-to-update
public class ZoomPanScrollPanel {
// the size of our image
private final static int IMAGE_SIZE = 1600;
// create an image to display
private BufferedImage getImage() {
BufferedImage image = new BufferedImage(IMAGE_SIZE, IMAGE_SIZE, BufferedImage.TYPE_INT_ARGB);
Graphics g = image.getGraphics();
// draw the small pixel first
Random rand = new Random();
for (int x = 0; x < IMAGE_SIZE; x += 10) {
for (int y = 0; y < IMAGE_SIZE; y += 10) {
g.setColor(new Color(rand.nextInt(255),rand.nextInt(255),rand.nextInt(255), rand.nextInt(255)));
g.fillRect(x, y, 10, 10);
}
}
// draw the larger transparent pixel second
for (int x = 0; x < IMAGE_SIZE; x += 100) {
for (int y = 0; y < IMAGE_SIZE; y += 100) {
g.setColor(new Color(rand.nextInt(255),rand.nextInt(255),rand.nextInt(255), 180));
g.fillRect(x, y, 100, 100);
}
}
return image;
}
// the image panel that resizes according to zoom level
private class ImagePanel extends JPanel {
private final BufferedImage image = getImage();
#Override
public void paintComponent(Graphics g) {
super.paintComponent(g);
Graphics2D g2 = (Graphics2D)g.create();
g2.scale(scale, scale);
g2.drawImage(image, 0, 0, null);
g2.dispose();
}
#Override
public Dimension getPreferredSize() {
return new Dimension((int)Math.round(IMAGE_SIZE * scale), (int)Math.round(IMAGE_SIZE * scale));
}
}
// the current zoom level (100 means the image is shown in original size)
private double zoom = 100;
// the current scale (scale = zoom/100)
private double scale = 1;
// the last seen scale
private double lastScale = 1;
// true if currently executing setViewPosition
private boolean blocked = false;
public void alignViewPort(Point mousePosition) {
// if the scale didn't change there is nothing we should do
if (scale != lastScale) {
// compute the factor by that the image zoom has changed
double scaleChange = scale / lastScale;
// compute the scaled mouse position
Point scaledMousePosition = new Point(
(int)Math.round(mousePosition.x * scaleChange),
(int)Math.round(mousePosition.y * scaleChange)
);
// retrieve the current viewport position
Point viewportPosition = scrollPane.getViewport().getViewPosition();
// compute the new viewport position
Point newViewportPosition = new Point(
viewportPosition.x + scaledMousePosition.x - mousePosition.x,
viewportPosition.y + scaledMousePosition.y - mousePosition.y
);
// update the viewport position
blocked = true;
scrollPane.getViewport().setViewPosition(newViewportPosition);
blocked = false;
// remember the last scale
lastScale = scale;
}
}
// reference to the scroll pane container
private final JScrollPane scrollPane;
// constructor
public ZoomPanScrollPanel() {
// initialize the frame
JFrame frame = new JFrame();
frame.setDefaultCloseOperation(WindowConstants.EXIT_ON_CLOSE);
frame.setSize(600, 600);
// initialize the components
final ImagePanel imagePanel = new ImagePanel();
final JPanel centerPanel = new JPanel();
centerPanel.setLayout(new GridBagLayout());
centerPanel.add(imagePanel);
scrollPane = new JScrollPane();
scrollPane.setViewport(new JViewport() {
private boolean inCall = false;
#Override
public void setViewPosition(Point pos) {
if (!inCall || !blocked) {
inCall = true;
super.setViewPosition(pos);
inCall = false;
}
}
});
scrollPane.getViewport().add(centerPanel);
scrollPane.setVerticalScrollBarPolicy(ScrollPaneConstants.VERTICAL_SCROLLBAR_ALWAYS);
scrollPane.setHorizontalScrollBarPolicy(ScrollPaneConstants.HORIZONTAL_SCROLLBAR_ALWAYS);
frame.add(scrollPane);
// add mouse wheel listener
imagePanel.addMouseWheelListener(new MouseAdapter() {
#Override
public void mouseWheelMoved(MouseWheelEvent e) {
super.mouseWheelMoved(e);
// check the rotation of the mousewheel
int rotation = e.getWheelRotation();
boolean zoomed = false;
if (rotation > 0) {
// only zoom out until no scrollbars are visible
if (scrollPane.getHeight() < imagePanel.getPreferredSize().getHeight() ||
scrollPane.getWidth() < imagePanel.getPreferredSize().getWidth()) {
zoom = zoom / 1.3;
zoomed = true;
}
} else {
// zoom in until maximum zoom size is reached
double newCurrentZoom = zoom * 1.3;
if (newCurrentZoom < 1000) { // 1000 ~ 10 times zoom
zoom = newCurrentZoom;
zoomed = true;
}
}
// check if a zoom happened
if (zoomed) {
// compute the scale
scale = (float) (zoom / 100f);
// align our viewport
alignViewPort(e.getPoint());
// invalidate and repaint to update components
imagePanel.revalidate();
scrollPane.repaint();
}
}
});
//mouse panning
//original code: https://stackoverflow.com/questions/31171502/scroll-jscrollpane-by-dragging-mouse-java-swing
MouseAdapter ma = new MouseAdapter() {
private Point origin;
#Override
public void mousePressed(MouseEvent e) {
origin = new Point(e.getPoint());
}
#Override
public void mouseReleased(MouseEvent e) {
}
#Override
public void mouseDragged(MouseEvent e) {
if (origin != null) {
JViewport viewPort = (JViewport) SwingUtilities.getAncestorOfClass(JViewport.class, imagePanel);
if (viewPort != null) {
int deltaX = origin.x - e.getX();
int deltaY = origin.y - e.getY();
System.out.println("X pan = "+ deltaX);
System.out.println("Y pan = "+ deltaY);
Rectangle view = viewPort.getViewRect();
view.x += deltaX;
view.y += deltaY;
imagePanel.scrollRectToVisible(view);
}
}
}
};
imagePanel.addMouseListener(ma);
imagePanel.addMouseMotionListener(ma);
imagePanel.setAutoscrolls(true);
// display our frame
frame.setVisible(true);
}
// the main method
public static void main(String[] args) {
new ZoomPanScrollPanel();
}
}

Categories