Java getCanvasImage and paintComponent draws out of sync - java

Objective:
I'm trying to draw bounding boxes around NPCs from a game client. I need to save the screenshot to a folder and save the box coordinates to a text file.
Problem:
When I rotate the camera, the boxes drawn on the canvas no longer align with the NPCs. It looks like the NPC coordinates lag behind the screenshot that is being draw on. Some of the screenshots also appear to be half previous frame and half new frame. I assume this may be related to multiple images being sent to save before the first one completes. Another thing to note is that the boxes don't finish drawing before the next frame appears on the canvas.
How can I force the screenshots to sync with the box coordinates? Is there some way I can get the game data and screenshot at the same time and then force the client to stop drawing until the task is complete?
This is the first time I've ever worked with Java (The data this script collects is intended for use with a Python project I'm working on) so please simplify answers as much as possible.
Update:
After messing around with things, it appears that the screen tearing may be the main issue. The delay looks like it's caused by the screen tear. The boxes are being drawn at the correct position on the parts of the screen that didn't get updated before they were saved.
https://media.giphy.com/media/39yEawmLBT4zKpPoz3/giphy.gif
Performing at its worst:
Tearing:
public class Pair {
public String key;
public Rectangle value;
public Pair(String key, Rectangle value) {
this.key = key;
this.value = value;
}
}
public class MyPaint extends JPanel{
private static final long serialVersionUID = 9091790544960515120L;
private BufferedImage paintImage = getClient().getCanvasImage();
#Override
protected void paintComponent(Graphics g){
super.paintComponent(g);
g.drawImage(paintImage, 0, 0, null);
}
public void updatePaint(){
synchronized (this) {
Graphics g = paintImage.createGraphics();
List<NPC> rsNpcs = new NPCs(getClient()).all()
.stream()
.filter(i -> i.getName().equals(npcName)
&& i.isOnScreen() == true
&& inTile(i.getTile()) == false)
.collect(Collectors.toList());
//Classifying the NPC in the box for the text file.
for (NPC rsNpc : rsNpcs) {
Rectangle bbox = rsNpc.getBoundingBox();
g.drawRect(bbox.x, bbox.y, bbox.width, bbox.height);
if (rsNpc.isInCombat() == true) {
Pair rsNpcPair = new Pair("CombatChicken", bbox);
onScreenRsNpcs.add(rsNpcPair);
} else {
Pair rsNpcPair = new Pair("RegularChicken", bbox);
onScreenRsNpcs.add(rsNpcPair);
}
}
//This bit is to save the boxes to a text file:
for (Pair rsNpc : onScreenRsNpcs) {
String data = (String.valueOf(rsNpc.value) + "Class Name: " + rsNpc.key + " Image Name: " + String.valueOf(count));
globalData.add(data);
}
g.dispose();
repaint();
}
}
public void save() throws IOException{
ImageIO.write(paintImage, "PNG", new File(String.format("%s/%s.jpg", getManifest().name(), count)));
count = count + 1;
}
public void load() throws IOException {
paintImage = ImageIO.read(new File(String.format("%s/%s.jpg", getManifest().name(), count)));
repaint();
}
}
//...
private MyPaint paint;
public void onStart() {
paint = new MyPaint();
}
//...
#Override
public int onLoop() {
try {
paint.updatePaint();
paint.save();
paint.load();
} catch (Exception e) {
e.printStackTrace();
}
return 1;
}

Related

Custom Java game engine is rendering spaces between tiles when the character moves

So I've been trying to figure out what's wrong with my code, but I've had basically no luck when it comes to finding what's wrong. I've seen plenty of folks who had similar issues but none of the fixes that were suggested helped with my problem.
I've made a video showcasing my problem, but I'll give an explanation here too: whenever I move on the screen, the tiles in my game engine don't sync up with each other in terms of positioning, and it seems to be only on the rendering end. When I do any sort of checks to see if the distance between two tiles changes, I don't get any sort of errors. I get these gaps between the tiles specifically when I'm moving up or left, and they instead merge slightly when I move down or right, as if some of the tiles are updating faster than the others.
I don't want to just start dumping my couple thousand lines of code here since that won't really help anyone, but I'm also not well versed in the game development world, so I'm not entirely sure what pieces of code are super relevant here. If there's anything that y'all would like to see, let me know and I'll happily provide it.
The main method and postInit looks like this:
public static void main (String[] args)
{
EventQueue.invokeLater(() ->{
ex = new ShootyGame();
ex.dispose();
ex.setLayout(null);
ex.setUndecorated(Settings.isFullscreen);
ex.setVisible(true);
ex.setCursor(ex.getToolkit().createCustomCursor(
new BufferedImage(1, 1, BufferedImage.TYPE_INT_ARGB), new Point(), null)); //hides the system cursor
ex.createBufferStrategy(2);
postInit();
});
}
private static void postInit()
{
//add a window listener to the main JFrame
ex.addWindowListener(new WindowAdapter()
{
/**
* Autosaves when the window is closed, then kills the game.
*/
#Override
public void windowClosing(WindowEvent e)
{
//TODO autosaving
kill();
}
});
render.start(); //these are just the two threads being started
run.start();
}
My two threads, which basically just run the step and render methods in my game class:
private static class Running extends Thread
{
boolean stop = false;
int fps = TickManager.fromFPS(Settings.FPS);
public void run()
{
while (!stop)
{
try
{
Running.sleep(fps);
}
catch(InterruptedException e)
{
System.err.println("B");
}
game.step();
}
}
}
private static class Render extends Thread
{
boolean stop = false;
int fps = TickManager.fromFPS(Settings.FPS);
public void run()
{
while (!stop)
{
try
{
Running.sleep(fps);
}
catch(InterruptedException e)
{
System.err.println("A");
}
game.render();
}
}
}
The run method in my Game class just calls the current character's step method (it'll call more later), which is what's directly used to move the Camera class' x and y position. The character step looks like this:
public void step()
{
this.calculateMove(); //gets info on which keys are being pressed, adds or subtracts an integer from dx and dy (which are also ints) based on which are being pressed
Game.cam.update(-this.dx, -this.dy); //sends the opposite movement to the camera
//change the position of the player character by the appropriate x and y amounts
this.changeX(this.dx);
this.changeY(this.dy);
this.reset(); //just sets dx and dy back to 0 after moving
}
And now to the rendering stuff here's the entire camera class since it's probably the most relevant class:
public class Camera
{
private int x;
private int y;
public Camera(int x, int y)
{
this.x = x;
this.y = y;
}
public void update(int dx, int dy)
{
moveX(dx);
moveY(dy);
}
public void moveX(int dx)
{
this.x += dx;
}
public void moveY(int dy)
{
this.y += dy;
}
/**
* Gets the top left corner of the camera's x position.
* #return The x position of the top left corner of the camera
*/
public int getCamX()
{
return this.x;
}
/**
* Gets the top left corner of the camera's y position.
* #return The y position of the top left corner of the camera
*/
public int getCamY()
{
return this.y;
}
}
And finally, the relevant code for the actual painting of the tiles:
public void render() //this is the part that the render thread calls initially
{
Toolkit.getDefaultToolkit().sync();
repaint();
}
public void paint(Graphics g) //the paint method, mostly handled in doDrawing
{
super.paint(g);
doDrawing(g);
}
private void doDrawing(Graphics g)
{
Graphics2D g2d = (Graphics2D) g;
//stuff that happens if the game isn't paused
if(!GameStates.isPaused)
{
currentMap.drawMap(g2d, this);
currentChar.draw(g2d, this);
}
}
public void drawMap(Graphics2D g2d, ImageObserver observer)
{
//for each tile in the map, call its draw method
for(int i = 0; i < this.tileArray.length; i++)
{
for(int j = 0; j < this.tileArray[0].length; j++)
{
this.tileArray[i][j].draw(g2d, observer);
}
}
}
public void draw(Graphics2D g2d, ImageObserver observer, BufferedImage image)
{
g2d.drawImage(image, this.getX() + Game.cam.getCamX(), this.getY() + Game.cam.getCamY() observer);
}
Sorry for the long winded post, I've just tried everything I can think of (and that my Googling abilities can help me think of) and I'm throwing this out as a last-ditch effort before I just move to an actual game engine. I wanted to make my own engine from scratch for the sake of getting more experience in Java, but if I can't figure this out I'd rather just move to a proper engine and actually make a game. Any help is massively appreciated :)
EDIT: capitalization

libGDX: How to read and display text from a .txt file line by line after pressing a key?

I'm new to Java and I'm trying to make a Visual Novel type of game.
What I'm trying to do is display text from a text file line by line by pressing a space button, like in a usual novel.
I've overlooked different methods but nothing works out for me. I know there are Scanner and BufferedReader, but are they suitable for what I'm doing?
Right now all that happens is when I press "space" the whole text appears on the screen, and when I let go, it dissapears.
This is my game class:
public class NovelGame extends Game {
public static final int WIDTH = 1366;
public static final int HEIGHT = 768;
public SpriteBatch batch;
public String txtFileString;
public String lines[];
public BitmapFont bitmapFont;
#Override
public void create () {
batch = new SpriteBatch();
bitmapFont = new BitmapFont();
this.setScreen(new MainMenuScreen(this));
txtFileString = Gdx.files.internal("script.txt").readString();
String[] anArray = txtFileString.split("\\r?\\n");}
#Override
public void render () {
super.render();
}}
This is my game screen class:
public class MainGameScreen implements Screen{
private Texture img;
NovelGame game;
public MainGameScreen (NovelGame game) {
this.game = game;
}
#Override
public void show() {
img = new Texture("bck.jpg");
}
#Override
public void render(float delta) {
Gdx.gl.glClear(GL20.GL_COLOR_BUFFER_BIT); // This cryptic line clears the screen.
game.batch.begin();
game.batch.draw(img, 0, 0);
if(Gdx.input.isKeyPressed(Input.Keys.SPACE)){
game.bitmapFont.draw(game.batch, game.txtFileString,Gdx.graphics.getWidth()/2,Gdx.graphics.getHeight()/2);
}
game.batch.end();
}
I had an idea to display it using while and if, but can't exactly figure out how to do it.
EDIT: I found a way to display text, but now, once I run my game, it starts piling one on another endlessly after I press space.
Code:
public class MainGameScreen implements Screen{
private Texture img;
NovelGame game;
public MainGameScreen (NovelGame game) {
this.game = game;
}
#Override
public void show() {
img = new Texture("bck.jpg");
}
#Override
public void render(float delta) {
try {
BufferedReader br = new BufferedReader (new FileReader("C:\\Users\\hydra\\Documents\\JAVA_PROJECTS\\gamespace\\core\\assets\\startd.txt"));
while((game.strLine = br.readLine()) != null){
game.list.add(game.strLine);
}
br.close();
} catch (IOException e) {
System.err.println("Unable to read the file.");
}
if(Gdx.input.isKeyJustPressed(Input.Keys.SPACE)){
game.showText = true;
}
Gdx.gl.glClear(GL20.GL_COLOR_BUFFER_BIT); // This cryptic line clears the screen.
game.batch.begin();
game.batch.draw(img, 0, 0);
if(game.showText) {
for(int i = 0; i < game.list.size(); i++) {
System.out.println(game.list.get(i));
game.bitmapFont.draw(game.batch, game.list.get(i), 100, 50);
}
}
game.batch.end();
}
Problem is here. Gdx.input.isKeyPressed returns true if only key is pressing currently.
if(Gdx.input.isKeyPressed(Input.Keys.SPACE)){
game.bitmapFont.draw(game.batch, game.txtFileString,Gdx.graphics.getWidth()/2,Gdx.graphics.getHeight()/2);
}
To fix this add a boolean flag activate it after key is only just pressed:
if(Gdx.input.isKeyJustPressed(Input.Keys.SPACE)){
showText = true;
}
And in render method:
if (showText) {
game.bitmapFont.draw(game.batch, game.txtFileString,Gdx.graphics.getWidth()/2,Gdx.graphics.getHeight()/2);
}
I found out what I was doing wrong in the end. I put everything in render method, and that's why file was being read endlessly. I need to do it only once in the constructor class and then put it in the render method.

Image does not immediately get replaced after calling repaint()+revalidate()

I'm making a game/simulator and I'm using the following method to load an Image into my current Java project:
public static Image getImage(String name) {
URL url = ImageLoader.class.getClassLoader().getResource("resources/" + name);
Image img = Toolkit.getDefaultToolkit().createImage(url);
ImageLoader.tracker.addImage(img, 1);
try {
ImageLoader.tracker.waitForID(1);
} catch (InterruptedException e) {
e.printStackTrace();
}
return img;
}
This loads the images into my class that is drawing all items including the player (who has 4 different images for each direction he can face: north, south, east, west):
private Image player = ImageLoader.getImage("playerEast.png");
private Image playerEast = ImageLoader.getImage("playerEast.png");
private Image playerWest = ImageLoader.getImage("playerWest.png");
private Image playerSouth = ImageLoader.getImage("playerSouth.png");
private Image playerNorth = ImageLoader.getImage("playerNorth.png");
The class that loads above images paints them in the area like such:
public class TerritoryPanel extends JPanel implements Observer {
#Override
protected void paintComponent(Graphics g){
super.paintComponent(g);
//Draw player
g.drawImage(player, (x, y, this);
}
I'm trying to update the pics with this method in the same class:
public void rotateEast(){
player = playerEast;
repaint();
revalidate();
}
..but just calling this rotateEast() does not update the picture immediately, it only gets updated afterwards when my regular Observer update() cycle calls repaint(), this happens every second so the missing repaint of rotateEast is visible:
#Override
public void update(Observable o, Object arg) {
if (EventQueue.isDispatchThread()) {
this.repaint();
} else { // Simulation-Thread
SwingUtilities.invokeLater(new Runnable() {
#Override
public void run() {
repaint();
}
});
}
}
Why does the repaint() from rotateEast seem to have no effect? Thank you very much in forward
but just calling this rotateEast() does not update the picture immediately, it only gets updated afterwards when my regular Observer update() cycle calls repaint(),
Don't know if it will make a difference but the normal logic is:
revalidate(); // to invoke the layout manager
repaint(); // to repaint all the components
Even if it doesn't make a difference in this case this order you should always use when dynamically changing the property of a component including adding/remove components from a panel.

AnimatedGIFField from blackberry knowledge base, don't know how to manipulate the gif

I am using this code, if anybody is familiar with it, its from the blackberry knowledge base. Anyway, I was wondering how to manipulate GIF's using this class. I can get the gif on the screen, but it keeps repeating and will not disappear. Any help is greatly appreciated!
public class AnimatedGIFField extends BitmapField
{
private GIFEncodedImage _image; //The image to draw.
private int _currentFrame; //The current frame in
the animation sequence.
private int _width; //The width of the image
(background frame).
private int _height; //The height of the image
(background frame).
private AnimatorThread _animatorThread;
public AnimatedGIFField(GIFEncodedImage image)
{
this(image, 0);
}
public AnimatedGIFField(GIFEncodedImage image, long style)
{
//Call super to setup the field with the specified style.
//The image is passed in as well for the field to
//configure its required size.
super(image.getBitmap(), style);
//Store the image and it's dimensions.
_image = image;
_width = image.getWidth();
_height = image.getHeight();
//Start the animation thread.
_animatorThread = new AnimatorThread(this);
_animatorThread.start();
}
protected void paint(Graphics graphics)
{
//Call super.paint. This will draw the first background
//frame and handle any required focus drawing.
super.paint(graphics);
//Don't redraw the background if this is the first frame.
if (_currentFrame != 0)
{
//Draw the animation frame.
graphics.drawImage(_image.getFrameLeft(_currentFrame), _image.getFrameTop(_currentFrame),
_image.getFrameWidth(_currentFrame), _image.getFrameHeight(_currentFrame), _image, _currentFrame, 0, 0);
}
}
//Stop the animation thread when the screen the field is on is
//popped off of the display stack.
protected void onUndisplay()
{
_animatorThread.stop();
super.onUndisplay();
}
//A thread to handle the animation.
private class AnimatorThread extends Thread
{
private AnimatedGIFField _theField;
private boolean _keepGoing = true;
private int _totalFrames; //The total number of
frames in the image.
private int _loopCount; //The number of times the
animation has looped (completed).
private int _totalLoops; //The number of times the animation should loop (set in the image).
public AnimatorThread(AnimatedGIFField theField)
{
_theField = theField;
_totalFrames = _image.getFrameCount();
_totalLoops = _image.getIterations();
}
public synchronized void stop()
{
_keepGoing = false;
}
public void run()
{
while(_keepGoing)
{
//Invalidate the field so that it is redrawn.
UiApplication.getUiApplication().invokeAndWait(new Runnable()
{
public void run()
{
_theField.invalidate();
}
});
try
{
//Sleep for the current frame delay before
//the next frame is drawn.
sleep(_image.getFrameDelay(_currentFrame) * 10);
}
catch (InterruptedException iex)
{} //Couldn't sleep.
//Increment the frame.
++_currentFrame;
if (_currentFrame == _totalFrames)
{
//Reset back to frame 0 if we have reached the end.
_currentFrame = 0;
++_loopCount;
//Check if the animation should continue.
if (_loopCount == _totalLoops)
{
_keepGoing = false;
}
}
}
}
}
}
Don't call super.paint(graphics), rather draw everything you need to draw by yourself. re-write your paint(Graphics graphics) method like below:
private boolean isPaint = true;
protected void paint(Graphics graphics) {
if(!isPaint) return;
// super.paint(graphics);
if (_currentFrame == _image.getFrameCount()-1) {
graphics.setGlobalAlpha(0);
isPaint = false;
}
graphics.drawImage(
_image.getFrameLeft(_currentFrame),
_image.getFrameTop(_currentFrame),
_image.getFrameWidth(_currentFrame),
_image.getFrameHeight(_currentFrame), _image,
_currentFrame, 0, 0
);
}

Why is the paint() method not executing update() or paint() methods?

I'm having this problem where the paint() or update() methods in a class isn't getting called when I execute repaint(). Here's the code:
public class BufferedDisplay extends Canvas implements Runnable {
// Contains all the images in order, ordered from background to foreground
private ArrayList<ImageStruct> images;
// Tracks the last insert ID of the last image for a particular layer
private TreeMap<Integer, Integer> insertIDs;
// Image that holds the buffered Image
private Image offscreen;
public BufferedDisplay() {
images = new ArrayList<ImageStruct>();
insertIDs = new TreeMap<Integer, Integer>();
}
public void addImageStruct(ImageStruct is) {
int layer = is.getLayer();
// Index to insert the image at
int index = -1;
if(insertIDs.containsKey(layer)) {
index = insertIDs.get(layer)+1;
insertIDs.put(layer, index);
}
else {
index = images.size();
insertIDs.put(layer, index);
}
if(index>-1) {
images.add(index, is);
}
}
public void run() {
try
{
while(true)
{
System.out.print("\nSleeping... ");
System.out.print("ArraySize:"+images.size()+" ");
Thread.sleep(1000);
System.out.print("Slept. ");
repaint();
}
}
catch(Exception e)
{
System.out.println("Display Error: ");
e.printStackTrace();
System.exit(-1);
}
}
// Overrides method so the background isn't automatically cleared
public void update( Graphics g )
{
System.out.print("Updating... ");
paint(g);
}
public void paint( Graphics g )
{
System.out.print("Painting... ");
if(offscreen == null)
offscreen = createImage(getSize().width, getSize().height);
Graphics buffer = offscreen.getGraphics();
buffer.setClip(0,0,getSize().width, getSize().height);
g.setColor(Color.white);
paintImages(buffer);
g.drawImage(offscreen, 0, 0, null);
buffer.dispose();
}
public void paintImages( Graphics window )
{
for(ImageStruct i : images) {
i.draw(window);
}
}
}
This class is implemented in this:
public class Game extends JPanel{
// A reference to the C4Game class
private C4Game game;
// A reference to the BufferedDisplay class
private BufferedDisplay display;
// The Image used to initialize the game board
private Image tile;
private int tileSize = 75;
private int tileLayer = 5;
// Thread that controls animation for the BufferedDisplay
Thread animation;
public Game(C4Game game) {
this.game = game;
display = new BufferedDisplay();
try {
tile = ImageIO.read(new File("img\\tile.png"));
} catch (IOException e) {
System.out.println("ERROR: ");
e.printStackTrace();
}
((Component)display).setFocusable(true);
add(display);
animation = new Thread(display);
animation.start();
initBoard();
}
public void initBoard() {
for(int x = 0; x<game.numRows()*tileSize; x+=tileSize) {
for(int y = 0; y<game.numCols()*tileSize; y+=tileSize) {
System.out.println("Placing " +x +" " +y +"...");
display.addImageStruct(new ImageStruct(tile, tileLayer, x, y, tileSize, tileSize));
}
}
}
}
...Which is then implemented in a JFrame.
public class TetraConnect extends JFrame{
public TetraConnect() {
super("TetraConnect", 800, 600);
try {
setIconImage(Toolkit.getDefaultToolkit().createImage("img/icon.png"));
ms = new MainScreen(this);
add(ms);
ms.updateUI();
C4Game c4g = new C4Game(5,6);
Game g = new Game(c4g);
add(g);
g.updateUI();
}
catch(Exception e) {
System.out.println("Init. Error: ");
e.printStackTrace();
System.exit(-1);
}
}
The output when I run it, is:
Slept.
Sleeping... Slept.
Sleeping... Slept.
Sleeping... Slept.
And so forth. I'm also not able to see any images on the Canvas (I'm assuming they are never drawn in the first place). It seems to completely skip the repaint method; the debug statements "Updating... " and "Repainting... " never show up. However, repaint also seems to be executing; the loop repeats without problems. Why isn't the repaint method calling the paint() or update() methods?
As #camickr noted in the comments, you are using the heavyweight AWT canvas. You should really be using lightweight Swing components. Instead of:
public class BufferedDisplay extends Canvas implements Runnable {
I recommend:
public class BufferedDisplay extends JPanel implements Runnable {
Given that small change, I would then do the following:
When overriding the default paining of a component you should override the paintComponent() method.
So, instead of:
public void paint( Graphics g )
{
It should be:
protected void paintComponent( Graphics g )
{
That may fix your problem.
Also, you shouldn't have to override the update() method. Instead, just leave out a call to super.paintCompenent(g) in the paint component method. This should cause the background to be left alone by default.
Make sure that the BufferedDisplay object has been added to a container (e.g. a Frame), and that the container itself is visible. If the component is not showing, then calls to repaint() will not result in update() being called.
This is just generic advice. If you post a self-contained example that can be compiled and run it will probably be easier to find out what is wrong.

Categories