Thread: Keyboard Listeners and ImagePanel

Hey. I am working on a little programming in my free time. I like coding, but don't have much experience working with Java. I want to be able to move an image around a frame using keyboard buttons. I have two sets of code. In the first, I display a panel with an image for the background that adjusts size with the window. I also display a second image fixed in the window. This seems to work fine:

import java.awt.Graphics;
import java.awt.Image;
 
import javax.swing.ImageIcon;
import javax.swing.JFrame;
import javax.swing.JLabel;
import javax.swing.JPanel;
 
 
public class FrameTest3 extends JFrame{
	private static int xAxis = 10;
	private static int yAxis = 30;
	public static int getxAxis() {
		return xAxis;
	}
 
	public static void setxAxis(int xAxis) {
		FrameTest3.xAxis = xAxis;
	}
 
	public static int getyAxis() {
		return yAxis;
	}
 
	public static void setyAxis(int yAxis) {
		FrameTest3.yAxis = yAxis;
	}
 
	public FrameTest3(){
		add(new ImagePanel());
	}
 
	public static void main(String[] args){
 
 
		JFrame frame = new FrameTest3();
 
 
		frame.setSize(400, 300);
		frame.setLocationRelativeTo(null);
		frame.setDefaultCloseOperation(JFrame.EXIT_ON_CLOSE);
		frame.setVisible(true);
	}
 
	static class ImagePanel extends JPanel{
		ImageIcon imageIcon = new ImageIcon("/Users/zerosdamnation/Documents/Projects/Photoshop/backgroundtest.gif");
		Image image = imageIcon.getImage();
		ImageIcon imageIcon2 = new ImageIcon("/Users/zerosdamnation/Documents/Projects/Photoshop/beagle.jpg");
		Image image2 = imageIcon2.getImage();
 
		//draw image on the panel
		public void paintComponent(Graphics g){
			super.paintComponent(g);
 
 
			if (image != null)
				g.drawImage(image, 0, 0, getWidth(), getHeight(), this);
 
			g.drawImage(image2, xAxis, yAxis, 100, 100, this);
		}
 
	}
}

Now I have taken the same code, but added a keyboard listener that I am trying to use to adjust the location of the second image in the panel. Somewhere in this code I am messing up and the program is not displaying either image at all. I am not really sure what I am doing wrong, as I am rather inexperienced with this.

import java.awt.Graphics;
import java.awt.Image;
import java.awt.event.KeyAdapter;
import java.awt.event.KeyEvent;
 
import javax.swing.ImageIcon;
import javax.swing.JFrame;
import javax.swing.JLabel;
import javax.swing.JPanel;
 
 
public class FrameTest4 extends JFrame{
	private KeyboardPanel keyboardPanel = new KeyboardPanel();
	private static int xAxis = 10;
	private static int yAxis = 30;
 
	public static int getxAxis() {
		return xAxis;
	}
 
	public static void setxAxis(int xAxis) {
		FrameTest4.xAxis = xAxis;
	}
 
	public static int getyAxis() {
		return yAxis;
	}
 
	public static void setyAxis(int yAxis) {
		FrameTest4.yAxis = yAxis;
	}
 
	public FrameTest4(){
		add(new ImagePanel());
		add(keyboardPanel);
		keyboardPanel.setFocusable(true);
	}
 
	public static void main(String[] args){
 
		FrameTest4 frame = new FrameTest4();
 
 
		frame.setTitle("Move me around the screen!");
		frame.setSize(400, 300);
		frame.setLocationRelativeTo(null);
		frame.setDefaultCloseOperation(JFrame.EXIT_ON_CLOSE);
		frame.setVisible(true);
	}
 
	//inner class, keyboard panel for receiving key input
	static class KeyboardPanel extends JPanel{
		private int x = 10;
		private int y = 30;
 
		public KeyboardPanel(){
			addKeyListener(new KeyAdapter(){
				public void keyPressed(KeyEvent e){
					switch (e.getKeyCode()){
					case KeyEvent.VK_DOWN: y = getyAxis(); y += 5; setyAxis(y); break;
					case KeyEvent.VK_UP: y = getyAxis(); y -= 5; setyAxis(y); break;
					case KeyEvent.VK_LEFT: x = getxAxis(); x -= 5; setxAxis(x); break;
					case KeyEvent.VK_RIGHT: x = getxAxis(); x += 5; setxAxis(x); break;
 
					}
					repaint();
				}
			});
		}
	}
 
	static class ImagePanel extends JPanel{
		ImageIcon imageIcon = new ImageIcon("/Users/zerosdamnation/Documents/Projects/Photoshop/backgroundtest.gif");
		Image image = imageIcon.getImage();
		ImageIcon imageIcon2 = new ImageIcon("/Users/zerosdamnation/Documents/Projects/Photoshop/beagle.jpg");
		Image image2 = imageIcon2.getImage();
 
		//draw image on the panel
		public void paintComponent(Graphics g){
			super.paintComponent(g);
 
			if (image != null)
				g.drawImage(image, 0, 0, getWidth(), getHeight(), this);
 
			g.drawImage(image2, xAxis, yAxis, 100, 100, this);
		}
 
	}
}

Any help would be greatly appreciated!

Check how you are using the layout manager. When add components to a container, the layout manger controls where the components go. For some layout mangers you need tell it where to put components by a second parameter to the add method.

Yes that was the code I was talking about. You need to read up on how to use layout managers.
A Visual Guide to Layout Managers (The Java™ Tutorials > Creating a GUI With JFC/Swing > Laying Out Components Within a Container)

Make sure the JPanel is given a size for the layout manager to use. Try using the set preferred size method.

Try it and see what happens.