如何在 JFrame 窗口中移动精灵（图像）？

Question

我在通过JFrame 窗口移动图像时遇到了一些问题。以下是代码的外观：

import java.awt.*;
import java.awt.event.ActionEvent;
import java.awt.event.ActionListener;
import java.awt.event.KeyEvent;
import java.awt.event.KeyListener;
import javax.swing.*;

public class Main extends JFrame implements KeyListener{

Image caitlanImage = new ImageIcon("Caitlan.png").getImage();
Person caitlan = new Person(caitlanImage, "Caitlan", 10, 200, true);

Person jake;
Image jakeImage;

//Background images
Image granadaBackground;

public static void main(String[] args) throws InterruptedException{
    new Main();
}
public Main() throws InterruptedException{
    setSize(700,300);
    setTitle("Project Anniversary");
    setVisible(true);   
    setDefaultCloseOperation(EXIT_ON_CLOSE);
    addKeyListener(this);

    //Instantiate background images
    granadaBackground = new ImageIcon("Granada Background.jpg").getImage();

    //Spawn first background
    spawnBackground(granadaBackground);

    //Spawn initial sprite
    spawnSprite(caitlan);
}

public void moveSprite(Person p) throws InterruptedException{   //Method to move a         
sprite 10 pixels (BROKEN)
    Graphics g = this.getGraphics();
        p.setLocation(p.getPosX() + 10, p.getPosY());
        g.drawImage(caitlan.getImage(), caitlan.getPosX() + 10,     
caitlan.getPosY(), caitlan.getImage().getWidth(null), caitlan.getImage().getHeight(null), 
null);
}
public void paint(Graphics g){   //Overridden paint method

}
public void spawnSprite(Person p){  //Method to initially spawn a sprite
    Graphics g = this.getGraphics();
    g.drawImage(p.getImage(), p.getPosX(), p.getPosY(), 
            p.getImage().getWidth(null), p.getImage().getHeight(null), null);
}
public void keyPressed(KeyEvent e) { //Method called whenever a key is pressed
    if(e.getKeyChar() == new String("d").charAt(0)){
        try {
            moveSprite(caitlan);
        } catch (InterruptedException e1) {

        }
    }
}
public void spawnBackground(Image backgroundImage){
    Graphics g = this.getGraphics();
    g.drawImage(backgroundImage, 0, 0, backgroundImage.getWidth(null),    
backgroundImage.getHeight(null),null);
}

public void keyReleased(KeyEvent e) {   //IGNORE

}
public void keyTyped(KeyEvent e) {      //IGNORE

}

}

这里的意思是，只要按下“d”键，精灵就会向右移动 10 个像素。然而，最终发生的事情是，它被重新绘制了 10 个像素，而原始图像仍然存在，所以看起来像是一堆令人恶心的图片相互叠加。这似乎是一个相当简单的问题，但我如何简单地将精灵移动 10 像素！？

Answer 1

我在您的代码中发现了几个问题，包括：

• 通过在组件上调用 getGraphics() 来获取您的 Graphics 对象。请注意，此对象不会持续存在。
• 直接在 JFrame 中绘图
• 不在 JComponent（如 JPanel）的 paintComponent(...) 方法中绘制
• 不在paintComponent(...) 方法内调用super.paintComponent(...) 方法。
• 使用 KeyListener 而不是键绑定
• 不使用 Swing Timer 进行动画循环。

看来你还没有看过关于 Swing 图形的教程，如果是的话，我建议你不要耽搁，你也可以看看如何做动画的许多例子，可以在上面找到网站，其中一些是我创建的。

Answer 2

为了简洁地解决您的问题，实际上您并没有重绘任何东西。您只是在旧图像之上绘制新图像，并且图形会在重绘周期中保持不变。

只需执行以下操作：

g.setColor(Color.white); g.fillRect(0,0,getWidth(),getHeight());

就在您绘制图像之前。将颜色更改为 JFrame 的背景颜色，使其看起来无缝（我认为它只是 getBackgroundColor()）。不过，你应该得到一本关于 Swing 的好书。