I searched the web for examples of draggable Swing components,
but I found either incomplete or non-working examples.
What I need is a Swing component that can be dragged by the mouse
inside an other component. While being dragged, it should already
change its position, not just 'jump' to its destination.
I would appreciate examples which work without non-standard APIs.
Thank you.
I propose a simple, but well-working solution, found out by myself ;)
What do I do?
When mouse is pressed, I record the cursor's position on screen, and
the component's position.
When mouse is dragged, I calculate the difference between new and
old cursor's position on screen, and move the
component by this difference.
Tested with latest JDK 6 unter Linux (OpenSuse, KDE3),
but hey, it's Java Swing, should work equally everywhere.
Here goes the code:
import java.awt.*;
import java.awt.event.*;
import javax.swing.*;
import javax.swing.border.*;
public class MyDraggableComponent
extends JComponent {
private volatile int screenX = 0;
private volatile int screenY = 0;
private volatile int myX = 0;
private volatile int myY = 0;
public MyDraggableComponent() {
setBorder(new LineBorder(Color.BLUE, 3));
setBackground(Color.WHITE);
setBounds(0, 0, 100, 100);
setOpaque(false);
addMouseListener(new MouseListener() {
#Override
public void mouseClicked(MouseEvent e) { }
#Override
public void mousePressed(MouseEvent e) {
screenX = e.getXOnScreen();
screenY = e.getYOnScreen();
myX = getX();
myY = getY();
}
#Override
public void mouseReleased(MouseEvent e) { }
#Override
public void mouseEntered(MouseEvent e) { }
#Override
public void mouseExited(MouseEvent e) { }
});
addMouseMotionListener(new MouseMotionListener() {
#Override
public void mouseDragged(MouseEvent e) {
int deltaX = e.getXOnScreen() - screenX;
int deltaY = e.getYOnScreen() - screenY;
setLocation(myX + deltaX, myY + deltaY);
}
#Override
public void mouseMoved(MouseEvent e) { }
});
}
}
public class Main {
public static void main(String[] args) {
JFrame f = new JFrame("Swing Hello World");
// by doing this, we prevent Swing from resizing
// our nice component
f.setLayout(null);
MyDraggableComponent mc = new MyDraggableComponent();
f.add(mc);
f.setSize(500, 500);
f.setDefaultCloseOperation(JFrame.DISPOSE_ON_CLOSE);
f.setVisible(true);
}
}
Also, I found out that one could create an JInternalFrame inside an JFrame,
but the problem is: you get always an annoying window title bar.
To disable the title bar, sadly, a dirty workaround is necessary:
public class MyDraggableComponent extends JInternalFrame {
public MyDraggableComponent() {
InternalFrameUI thisUI = getUI();
if (thisUI instanceof BasicInternalFrameUI) {
((BasicInternalFrameUI) thisUI).setNorthPane(null);
}
}
I really miss a method like "someInternalFrame.setWindowTitleBar(false)"...
:'(
Related
I am using practically the same method for moving the JFrame as Java - Custom shaped draggable JFrame
I have a class that extends JPanel. In the said class, I have the previous x and y set to variables like so:
private int pressX, pressY
Then, in the mousePressed method, I have:
pressX = e.getX();
pressY = e.getY();
Finally, in mouseDragged, I have:
mainFrame.setLocation((int) Math.round(mainFrame.getLocation().getX() + e.getX() - pressX), (int) Math.round(mainFrame.getLocation().getY() + e.getY() - pressY));
However, when dragging the window around, there is a fair amount of lag or some kind of problem. Here is a video to show what happens visually.
https://i.imgur.com/KWtbE1s.gifv
I am using the swing library and am repainting using a Timer that ticks roughly every two milliseconds.
Edit:
I modified the code such that the points were relative to the JPanel, but the problem still occurs.
dragMe = new Draggable() {
private static final long serialVersionUID = 1L;
private Point press;
#Override
public void mouseClicked(MouseEvent e) {}
#Override
public void mousePressed(MouseEvent e) {
press = SwingUtilities.convertPoint(this, e.getPoint(), mainFrame);
}
#Override
public void mouseReleased(MouseEvent e) {}
#Override
public void mouseEntered(MouseEvent e) {}
#Override
public void mouseExited(MouseEvent e) {}
#Override
public void mouseDragged(MouseEvent e) {
Point drag = SwingUtilities.convertPoint(this, e.getPoint(), mainFrame);
mainFrame.setLocation((int) Math.round(mainFrame.getLocation().getX() + drag.getX() - press.getX()), (int) Math.round(mainFrame.getLocation().getY() + drag.getY() - press.getY()));
}
#Override
public void mouseMoved(MouseEvent e) {}
};
Edit 2:
Unfortunately, the example I have created here works perfectly, and I don't know why it is not working in the true code. I even tried copying the exact class I made in this example into the real application, and the problem still occurs in the true code.
It looks like I will have to look more into this.
import java.awt.Color;
import java.awt.Dimension;
import java.awt.Graphics;
import java.awt.Point;
import java.awt.event.ActionEvent;
import java.awt.event.ActionListener;
import java.awt.event.MouseEvent;
import java.awt.event.MouseListener;
import java.awt.event.MouseMotionListener;
import javax.swing.JFrame;
import javax.swing.JPanel;
import javax.swing.SwingUtilities;
import javax.swing.Timer;
import javax.swing.WindowConstants;
public class Test extends JPanel implements ActionListener {
private static final long serialVersionUID = 1L;
private static JFrame frame;
public static void main(String[] args) {
class Draggable extends JPanel implements MouseListener, MouseMotionListener {
private static final long serialVersionUID = 1L;
private Point press;
public Draggable() {
addMouseListener(this);
addMouseMotionListener(this);
}
#Override
public void mouseClicked(MouseEvent e) {}
#Override
public void mousePressed(MouseEvent e) {
press = SwingUtilities.convertPoint(this, e.getPoint(), frame);
}
#Override
public void mouseReleased(MouseEvent e) {}
#Override
public void mouseEntered(MouseEvent e) {}
#Override
public void mouseExited(MouseEvent e) {}
#Override
public void mouseDragged(MouseEvent e) {
Point drag = SwingUtilities.convertPoint(this, e.getPoint(), frame);
frame.setLocation((int) Math.round(frame.getLocation().getX() + drag.getX() - press.getX()), (int) Math.round(frame.getLocation().getY() + drag.getY() - press.getY()));
}
#Override
public void mouseMoved(MouseEvent e) {}
}
Test t = new Test();
t.setBounds(0, 0, 1200, 600);
t.setVisible(true);
Draggable drag = new Draggable();
drag.setBounds(24, 24, 24, 24);
drag.setVisible(true);
Timer repaintTimer = new Timer(2, t);
frame = new JFrame();
frame.setSize(1200, 600);
frame.add(t);
frame.add(drag);
Dimension dim = java.awt.Toolkit.getDefaultToolkit().getScreenSize();
frame.setDefaultCloseOperation(WindowConstants.EXIT_ON_CLOSE);
frame.setLocation((dim.width - frame.getWidth()) / 2, (dim.height - frame.getHeight()) / 2);
frame.getContentPane().setLayout(null);
frame.setAlwaysOnTop(true);
frame.setResizable(false);
repaintTimer.start();
frame.setVisible(true);
frame.requestFocus();
}
#Override
public void actionPerformed(ActionEvent e) {
repaint();
}
#Override
public void paintComponent(Graphics g) {
super.paintComponent(g);
g.setColor(Color.BLACK);
g.fillRect(24, 24, 24, 24);
}
}
Check out Moving Windows for a class that does this for you.
It is more complicated than the basic dragging logic because it supports other features which you may not need.
The basic logic (from the above class) for dragging a frame when adding the listeners to one (or more) components of the frame would be:
MouseInputAdapter mia = new MouseInputAdapter()
{
Point location;
Point pressed;
public void mousePressed(MouseEvent me)
{
pressed = me.getLocationOnScreen();
Window window = SwingUtilities.windowForComponent(me.getComponent());
location = window.getLocation();
}
public void mouseDragged(MouseEvent me)
{
Point dragged = me.getLocationOnScreen();
int x = (int)(location.x + dragged.getX() - pressed.getX());
int y = (int)(location.y + dragged.getY() - pressed.getY());
Window window = SwingUtilities.windowForComponent(me.getComponent());
window.setLocation(x, y);
}
};
panel.addMouseListener(mia);
panel.addMouseMotionListener(mia);
Edit:
Here is some more generic code that allows you to move a component directly or indirectly by specify a parent component to receive the events:
import java.awt.*;
import java.awt.event.*;
import javax.swing.*;
import javax.swing.event.*;
public class BasicComponentMover extends MouseInputAdapter
{
/*
** A class that allows you to drag a component around a panel.
** Optionally you can specify a "parent" component, in which case
** the MouseEvents will be converted to be relative to this component
** which will then be dragged. This will allow you to drag a JFrame by
** dragging a component that has been added to the frame.
*/
private Component parent;
private Component destination;
private Point pressed;
BasicComponentMover() {}
{
}
BasicComponentMover(Component parent)
{
this.parent = parent;
}
#Override
public void mousePressed(MouseEvent me)
{
destination = (parent == null) ? me.getComponent() : parent;
pressed = SwingUtilities.convertPoint(me.getComponent(), me.getPoint(), destination);
}
#Override
public void mouseDragged(MouseEvent me)
{
Point location = destination.getLocation();
Point drag = SwingUtilities.convertPoint(me.getComponent(), me.getPoint(), destination);
int x = (int)(location.x - pressed.getX() + drag.getX());
int y = (int)(location.y - pressed.getY() + drag.getY());
destination.setLocation(x, y);
}
private static void createAndShowGUI()
{
JPanel background = new JPanel(null);
background.setPreferredSize(new Dimension(300, 300));
background.setSize(background.getPreferredSize());
background.setBackground(Color.RED);
JPanel foreground = new JPanel(null);
foreground.setPreferredSize(new Dimension(50, 50));
foreground.setSize(foreground.getPreferredSize());
foreground.setBackground(Color.BLUE);
background.add(foreground);
JFrame frame = new JFrame("BasicComponentMover");
frame.setDefaultCloseOperation(JFrame.EXIT_ON_CLOSE);
frame.setLayout(null);
frame.add(background);
frame.setSize(500, 500);
frame.setLocationByPlatform( true );
frame.setVisible( true );
// Drag frame by dragging the red background panel
BasicComponentMover bcm1 = new BasicComponentMover(frame);
background.addMouseListener(bcm1);
background.addMouseMotionListener(bcm1);
// Drag the blue forground component around the red background
BasicComponentMover bcm2 = new BasicComponentMover();
foreground.addMouseListener(bcm2);
foreground.addMouseMotionListener(bcm2);
// Or, drage the background around the frame
BasicComponentMover bcm3 = new BasicComponentMover(background);
// foreground.addMouseListener(bcm3);
// foreground.addMouseMotionListener(bcm3);
}
public static void main(String[] args) throws Exception
{
EventQueue.invokeLater( () -> createAndShowGUI() );
/*
EventQueue.invokeLater(new Runnable()
{
public void run()
{
createAndShowGUI();
}
});
*/
}
}
Try dragging the blue/red components to see the difference.
I've been writing a simple animation using Swing where you have a JFrame and a ripple animation starts wherever the JFrame receives a mouse click. I use an inner Animation class that extends JPanel for each animation in case multiple animations have to be played at once(I don't know if this is the best way to do it). When I click, I add a new Animation to the JFrame and pass the coordinates of the click to the Animation. However, the Animation repaint / paintComponent methods aren't working. In my understanding, repaint should call the paint / paintComponent methods, but in troubleshooting these methods aren't even being accessed. So how can I get the paint method to execute? Thanks in advance.
import java.awt.Color;
import java.awt.Graphics;
import java.awt.event.*;
import javax.swing.*;
public class Ripples extends JFrame {
public Ripples() {
// window
setDefaultCloseOperation(JFrame.EXIT_ON_CLOSE);
setTitle("Ripples");
setBounds(250, 250, 1000, 1000);
setVisible(true);
addMouseListener(new MouseListener() {
public void mousePressed(MouseEvent e) {
Animation animation = new Animation(e.getX(), e.getY());
add(animation);
}
public void mouseReleased(MouseEvent e) {
}
public void mouseClicked(MouseEvent e) {
}
public void mouseEntered(MouseEvent e) {
}
public void mouseExited(MouseEvent e) {
}
});
}
public static void main(String[] args) {
Ripples demo = new Ripples();
}
class Animation extends JPanel{
private int radius;
private int x;
private int y;
private Timer timer;
Animation(int x, int y) {
this.x = x;
this.y = y;
radius = 0;
timer = new Timer(10, new ActionListener() {
public void actionPerformed(ActionEvent e) {
if (radius > 200) {
resetRadius();
timer.stop();
}
increaseRadius();
repaint();
}
});
timer.start();
}
public void increaseRadius() {
radius += 1;
}
public void resetRadius() {
radius = 0;
}
public void paintComponent(Graphics g) {
super.paintComponent(g);
g.setColor(Color.BLACK);
g.drawOval(x - (radius / 2), y - (radius / 2), radius, radius);
}
}
}
When I click, I add a new Animation to the JFrame and pass the coordinates of the click to the Animation. However, the Animation repaint / paintComponent methods aren't working.
By default Swing components have a default size of (0, 0) so there is nothing to paint.
When you add a component to a visible GUI you need to invoke the layout manager so the component can be given a size/location. The basic code is:
panel.add(...);
panel.revalidate();
panel.repaint(); // sometimes needed
In your case you are adding the Animation panel to the content pane of the frame so you need to revalidate() the frame.
I'm using the getX() and getY() methods in the MouseListener class to get the location of the panel, but it's getting the location of the frame instead, and that includes the top of the title bar and the sides, so it's not getting the location that I want. I also have the:
#Override
public Dimension getPreferredSize() {
return new Dimension(300, 300);
}
method in my paint class to override the frame so when you paint in graphics, and set the paint location of x, and y, it sets it to the panel location, and not the frame location, but I don't know how to make it so that the MouseListener class does the same. Please help. Thanks.
Code for the MouseListener class:
package events;
import javax.swing.*;
import java.awt.*;
import java.awt.event.*;
public class Events implements ActionListener, MouseListener, MouseMotionListener {
static Events events = new Events();
int x;
int y;
public void actionPerformed(ActionEvent e) {
}
public void mousePressed(MouseEvent e) {
}
public void mouseReleased(MouseEvent e) {
}
public void mouseEntered(MouseEvent e) {
}
public void mouseExited(MouseEvent e) {
}
public void mouseClicked(MouseEvent e) {
x = e.getX();
y = e.getY();
System.out.println("X:" + x + " " + "Y:" + y);
}
public void mouseMoved(MouseEvent e) {
}
public void mouseDragged(MouseEvent e) {
}
}
Nevermind. I can just call the panel name for the panel x, and y locations. But thanks anyways.
x = P.g.getX();
y = P.g.getY()
I'm experimenting on a GUI that I programmed and I don't understand how I can fix my problem:
My GUI contains a jPanel that on receiving a mouseclick, paints a point with filloval command.
private void myPnlMousePressed(java.awt.event.MouseEvent evt) {
changed = true;
p.x = evt.getX();
p.y = evt.getY();
drewPoints(p.x, p.y);
}
private void drewPoints (int x, int y) {
if (gf == null) {
gf = (Graphics)myPnl.getGraphics();
}
myPointsList.add(new Point(x, y));
gf.fillOval(x, y, 5, 5);
xVal.setText("X = " + x);
yVal.setText("Y = " + y);
}
everything works fine but when I want to open an XML file that I created to save all the points it doesn't work.
The problem is that when I use the repaint method on the jPanel after choosing a file, all the points loads fine but the panel can't draw the points.
If I put the repaint method in the open button listener (before the choosing file) it works, but then if the user cancels the open option so the panel stays blank and I don't want to draw the points again.
I think it happens because the repaint process is not finished.
All the points added to a private List.
private void OpenFile() {
try {
File thisFile;
JFileChooser of = new JFileChooser();
int option = of.showOpenDialog(of);
if (option == JFileChooser.APPROVE_OPTION){
thisFileName = of.getSelectedFile().getPath();
thisFile = new File(thisFileName);
if (!of.getSelectedFile().getName().endsWith(".xml")) {
String error = "Error, You didn't select XML file";
JOptionPane.showMessageDialog(this, error, "Wrong type of file", JOptionPane.INFORMATION_MESSAGE);
return;
}
myPnl.repaint();
myPointsList.clear();
....
....
....
for (int i = 0; i < pointsList.getLength(); i++) {
Element point = (Element) pointsList.item(i);
p.x = Integer.parseInt(point.getElementsByTagName("X").item(0).getTextContent());
p.y = Integer.parseInt(point.getElementsByTagName("Y").item(0).getTextContent());
drewPoints(p.x, p.y);
}
....
how can I make it work??
Don't use gf = (Graphics)myPnl.getGraphics();, this is not how painting in Swing works. The getGraphics method can return null and is nothing more then a snap shot of the last paint cycle, any thing you paint to it will be erased on the next paint cycle (repaint).
Instead, override the JPanels paintComponent and put all you painting logic there. There is an expectation that when called, you are expected to fully re-paint the current state of the component.
See Painting in AWT and Swing and Performing Custom Painting for more details about how painting works in Swing
You have to use the repaint() and override the paint() method:
class MyPanel extends JPanel implements MouseListener
{
private int x;
private int y;
public MyPanel() {
super();
addMouseListener(this);
}
#Override public void mouseEntered(MouseEvent e) { }
#Override public void mouseExited(MouseEvent e) { }
#Override public void mouseClicked(MouseEvent e) { }
#Override public void mousePressed(MouseEvent e) { }
#Override public void mouseReleased(MouseEvent e) {
x = e.getX();
y = e.getY();
repaint();
}
#Override public void paint(Graphics g) {
super.paint(g);
g.fillOval(x, y, 10, 10);
}
}
If you want to draw all points, don't use x and y but a list of points:
class MyPanel extends JPanel implements MouseListener
{
private ArrayList<Point> points = new ArrayList<>();
public MyPanel() {
super();
addMouseListener(this);
}
#Override public void mouseEntered(MouseEvent e) { }
#Override public void mouseExited(MouseEvent e) { }
#Override public void mouseClicked(MouseEvent e) { }
#Override public void mousePressed(MouseEvent e) { }
#Override public void mouseReleased(MouseEvent e) {
points.add(new Point(e.getX(), e.getY()));
repaint();
}
#Override public void paint(Graphics g) {
super.paint(g);
for (Point p : points)
g.fillOval(p.getX(), p.getY(), 10, 10);
}
}
where:
class Point
{
private int x;
private int y;
public Point(int x, int y) {
this.x = x;
this.y = y;
}
public int getX() {
return x;
}
public int getY() {
return y;
}
}
Then use it:
public static void main(String[] args) {
JFrame frame = new JFrame("Test");
frame.setDefaultCloseOperation(JFrame.EXIT_ON_CLOSE);
frame.setSize(400, 400);
frame.setLocationRelativeTo(null);
MyPanel myPanel = new MyPanel();
frame.add(myPanel);
frame.setVisible(true);
}
The blue label is meant to move when you click and drag it. This works but the x / y position then jumps in a funny way.
Here's the code:
import java.awt.*;
import java.awt.event.*;
import javax.swing.*;
#SuppressWarnings("serial")
public class test extends JFrame implements MouseListener, MouseMotionListener {
private JPanel panel = new JPanel(null);
private JLabel label1 = new JLabel();
private JLabel label2 = new JLabel();
private int mouseX = 200;
private int mouseY = 100;
private boolean drag = false;
public test() {
this.add(panel);
panel.setBackground(Color.WHITE);
panel.add(label1);
label1.setOpaque(true);
label1.setBackground(Color.BLUE);
label1.setBounds(mouseX, mouseY, 100, 50);
label1.addMouseMotionListener(this);
label1.addMouseListener(this);
panel.add(label2);
label2.setOpaque(true);
label2.setBackground(Color.RED);
label2.setBounds(mouseX + 200, mouseY, 100, 50);
label2.addMouseMotionListener(this);
label2.addMouseListener(this);
}
#Override
public void mousePressed(MouseEvent e) {
if (e.getSource() == label1) {
drag = true;
}
}
#Override
public void mouseReleased(MouseEvent e) {
drag = false;
}
#Override
public void mouseDragged(MouseEvent e) {
if (drag == true) {
mouseX = e.getX();
mouseY = e.getY();
label1.setBounds(mouseX, mouseY, 100, 50);
}
}
public void mouseMoved(MouseEvent e) {}
public void mouseEntered(MouseEvent e) {}
public void mouseExited(MouseEvent e) {}
public void mouseClicked(MouseEvent e) {}
public static void main(String[] args) {
test frame = new test();
frame.setVisible(true);
frame.setSize(600, 400);
frame.setResizable(false);
frame.setLocationRelativeTo(null);
frame.setDefaultCloseOperation(JFrame.EXIT_ON_CLOSE);
}
}
Just put this on your MouseDragged method:
public void mouseDragged(MouseEvent e)
{
if (drag == true)
{
JComponent jc = (JComponent)e.getSource();
jc.setLocation(jc.getX()+e.getX(), jc.getY()+e.getY());
}
}
The coordinates returned by MouseEvent::getX() and MouseEvent::getY() represent the location of the event relative to the event's subject (i.e. relative to the label itself), which explains why your solution results in the label erratically jumping.
By using MouseEvent::getComponent() to grab the label and then querying its position (possibly relative to the position when dragging commenced), you can devise a working solution.
Your problem is your setting your bounds based on the mouse location in the MouseListener, but the MouseListener has its location relative to the JLabel itself, but the JLabel's location should be set relative to the panel. You'll need to do some simple vector addition to figure this out.
edit: oops, I didn't see that this was already answered, and they say the same thing... sorry.
Maybe try adding something like that
The red one will do it better
private int clicX = 0;
private int clicY = 0;
public void mousePressed(MouseEvent e) {
drag = true;
if (e.getSource() == label1) {
}
if (e.getSource() == label2) {
clicX = e.getX();
clicY = e.getY();
}
}
public void mouseDragged(MouseEvent e) {
if (e.getSource() == label2) {
JComponent jc = (JComponent)e.getSource();
jc.setLocation(jc.getX()+e.getX()-clicX, jc.getY()+e.getY()-clicY);
}
Create two global variables:
int x_pressed = 0;
int y_pressed = 0;
then create two events (mousePressed and mouseDragged over JLabel):
lbl_banner.addMouseListener(new MouseAdapter()
{
#Override
public void mousePressed(MouseEvent e) {
//catching the current values for x,y coordinates on screen
x_pressed = e.getX();
y_pressed = e.getY();
}
});
lbl_banner.addMouseMotionListener(new MouseMotionAdapter(){
#Override
public void mouseDragged(MouseEvent e){
//and when the Jlabel is dragged
setLocation(e.getXOnScreen() - x_pressed, e.getYOnScreen() - y_pressed);
}
});