Update object position before rendering in Java? - java

The problem I'm having is with my render loop. My application is a series of 'Tile' objects each with an x and y coordinate and image. When the program starts it creates a 10x10 grid of these tiles on screen. However, not all the squares can be seen at the same time, so you can use the arrow keys to pan around them. When the key is pressed it uses a for loop to cycle through all the currently rendered tile (stored in an ArrayList) and shifts them all 16 in the appropriate direction. The problem is some of the tiles flicker. I can see when scrolling that one half of the screen doesn't move in time to be rendered in the right spot, making a black gap between that and the other half of the tiles. how do I ensure that all tiles are moved before rendering?
render function from my Core class
public static void render()
{
while(true)
{
Graphics g = buffer.getDrawGraphics();
try
{
g.setColor(Color.black);
g.fillRect(0, 0, 1280, 720);
if(renderQueue != null)
{
for(int i = 0; i<renderQueue.size(); i++)
{
Tile t = renderQueue.get(i);
g.drawImage(t.getImage(), t.getX(), t.getY(), null);
}
}
if(!buffer.contentsLost())
{
buffer.show();
}
}
finally
{
if(g != null)
{
g.dispose();
}
}
}
}
And here's the movement update function from the Input class
public void keyPressed(KeyEvent ke)
{
int e = ke.getKeyCode();
switch(e)
{
case 38://up
if(scrollY > 0)
{
scrollY -= 16;
for(int i = 0; i<Core.renderQueue.size(); i++)
{
Core.renderQueue.get(i).incrementY(16);
}
}
break;
case 40://down
if(scrollY < 560)
{
scrollY += 16;
for(int i = 0; i<Core.renderQueue.size(); i++)
{
Core.renderQueue.get(i).incrementY(-16);
}
}
break;
case 37://right
if(scrollX < 0)
{
scrollX += 16;
for(int i = 0; i<Core.renderQueue.size(); i++)
{
Core.renderQueue.get(i).incrementX(16);
}
}
break;
case 39://left
if(scrollX > 0)
{
scrollX -= 16;
for(int i = 0; i<Core.renderQueue.size(); i++)
{
Core.renderQueue.get(i).incrementX(-16);
}
}
break;
}
Thanks in advance!

It sounds like the tiles are being rendered while the coordinates for some of the tiles still have to be changed by Input.keyPressed. You could fix that by directly using scrollX and scrollY to draw the tile images in Core.render, instead of changing the coordinates for each of the tiles. If you copy the scroll values to two local variables at the begin of the while loop in render, the same values will be used for each tile.
Another option is to create a new list with tiles that have the modified coordinates (you could use the images from the current list). When the new list is complete, you could set a flag like newRenderQueue which will be picked up in render. When a new iteration of the while loop in render starts, you can replace the render queue with the new list and reset the flag.
P.S. Welcome to Stack Overflow! As Andrew Thompson already mentioned, it's very helpful to provide a complete example of your problem. This way people can quickly investigate the issue and provide (hopefully useful) advice... ;-)

Related

Creating a clickable grid in Processing 3

I'm trying to make a grid of squares that change their fill (from black to white and vice-versa) when clicked. I'm able to turn the entire grid on or off currently, but I'm unable to figure out how to specify which particular square should be toggled when the mouse clicks within its borders. I've created buttons using mouseX and mouseY coordinates before, but they were for specific objects that I could adjust manually. I can't figure out how to do this using for loops and arrays.
I've been told to create a boolean array and pass the value of that array to the grid array, but again, I don't know how to specify which part of the array it needs to go to. For example, how do I change the fill value of square [6][3] upon mousePressed?
Here is my code so far:
int size = 100;
int cols = 8;
int rows = 5;
boolean light = false;
int a;
int b;
void setup() {
size (800, 600);
background (0);
}
void draw() {
}
void mousePressed() {
light = !light;
int[][] box = new int[cols][rows];
for (int i = 0; i < cols; i++) {
for (int j = 0; j < rows; j++) {
box[i][j] = i;
int a = i*100;
int b = j*100;
if (light == true) {
fill(255);
} else {
fill(0);
}
rect(a, b, 100, 100);
println(i, j);
}
}
}
First of all, you are currently recreating the entire board whenever the mouse is pressed. You must retain that info between mouse clicks, so make box a global array up there with the others. Further, it's sufficient to make it a boolean array if all you care about is the on/off state of each square:
boolean[][] isSquareLight = new boolean[cols][rows];
Instead of
if (light == true) {
you should then just check
if (isSquareLight[i][j] == true) {
(note that the == true is redundant).
Now, you've already written code that finds the coordinates for each box: You're passing it to rect!
rect(a, b, 100, 100);
All that is left to do is check whether the mouse is inside this rect, i.e. whether mouseX is between a and a+100 (and similar for mouseY) - if that's the case, then the user clicked in the box given by the current (i, j), so you can just negate isSquareLight[i][j] (before checking it like above) and it will work.
There are ways to calculate this without looping through the entire grid every time, but maybe the above helps you find the path yourself instead of just getting the code made for you.
PS: The int a; int b; at the top does nothing and can be removed. You are using the local variables a and b in your function, which is correct.

Java | Buffered Image working But Not How I Want and Keybindings doing the same

Background Stuff
So I have been working on a Java game for the past 3-4 weeks for a class final project. What it is supposed to do is generate a "map" that the player has to navigate through to get to the "exit" in the bottom right corner (shown as black dot for now). The "map" is randomly generated so that no two are the same and will cause the player to possibly need to use more "tools"(not added yet) than they would like.
Problem
1.)The first problem at hand is that I have attempted to make "keybindings" and they compile and don't break the game, when ever the key is pressed the player does not move in the indicated direction.
I know one part of the problem is I do not have boundaries on the "map" due to not knowing how to make them which is causing an out of bounds exception to my array.
The other that coincides with this is that when I repaint() it completely redoes the whole "map" when all I wanted was the player to be moved to the new location while removing any "terrain" that they encounter (not removing terrain till later).
2.) Trying to figure out problem 1 I looked back at one of my previous posts (Rows and columns with multidimensional array java) where this was said by MadProgrammer Personally, in mapGen, I would create a BufferedImage which was 24*20 wide and 24*20 high, paint all the tiles to it and the in the paintComponent method, paint the image
So I read up on what a BufferedImage does and how it works and tried to implement it into my game. The results where catastrophic. It compiled and ran okay but the outcome was very far away from what I was trying to achieve
Result:
What I was Shooting For:
Code I Added That Did This/Not Working Code
The "keybinding":
//I have all imports neccessary
public class gamePanel extends JPanel implements ActionListener, KeyListener
{ //added^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^
public gamePanel()
{
//left out my bounds for shortening reasons
addKeyListener(this);//added
setFocusable(true);//added
setFocusTraversalKeysEnabled(false);//added
}
//................................
public void actionPerformed(ActionEvent e){
repaint();
}
// below process is repeated for left, right, and down
//for now just trying to get the player to move
//not worried about removing terrain just yet
public void up(){
if(coords[playerX[pcX]][playerY[pcY-1]] == terrain[floor]){
playerY[pcY] = playerY[pcY- 1] ;
}
if(coords[playerX[pcX]][playerY[pcY]-1] == terrain[dirt]){
playerY[pcY] = playerY[pcY] - 1;
}
if(coords[playerX[pcX]][playerY[pcY]-1] == terrain[stone]){
playerY[pcY] = playerY[pcY] - 1;
}
if(coords[playerX[pcX]][playerY[pcY]-1] == terrain[iron]){
playerY[pcY] = playerY[pcY] - 1;
}
if(coords[playerX[pcX]][playerY[pcY]-1] == terrain[gold]){
playerY[pcY] = playerY[pcY] - 1;
}
if(coords[playerX[pcX]][playerY[pcY]-1] == terrain[diamond]){
playerY[pcY] = playerY[pcY] - 1;
}
if(coords[playerX[pcX]][playerY[pcY]-1] == terrain[emerald]){
playerY[pcY] = playerY[pcY] - 1;
}
//................
public void keyTyped(KeyEvent e){}//would not compile without these two lines
public void keyReleased(KeyEvent e){}
}
}
Code for Buffered Image:
//player coords
int pcY = 1;
int pcX = 1;
int[] playerX = new int[pcX + 1];
int[] playerY = new int[pcY + 1]; // x,y for the player
//^^^^pretty sure this is the wrong way to make array start at 1
#Override
public void paintComponent(Graphics g)//what will paint each 20x20 square on the grid what it is assigned
{
super.paintComponent(g);
Image img = drawmap();//draw the below bufferedimage
g.drawImage(img, 520, 520, this);
g.setColor(Color.red);//creates the player "model"
g.fillOval((pcX*20),(pcY*20),20,20);
g.setColor(Color.black);
g.fillOval((23*20),(23*20),20,20);
}//end paintComponent
private Image drawmap(){
BufferedImage map = new BufferedImage(width*20, height*20, BufferedImage.TYPE_INT_RGB);
Graphics g = map.getGraphics();
for(int x = 1; x < width; x++)
{
for(int y = 1; y < height; y++)
{
if(coords[x][y] == terrain[floor])// paints floor color at marked coordinates
{
g.setColor(new Color(249,249,249));
g.fillRect((x*20), (y*20), 20, 20);
}
//^^^^same proccess for all the rest of the terrain
}
}
return map;
}
Notes
If all explanations could please be but into layman's terms that would be fantastic because engineer lingo confuses me.
Also if this needs to be two different posts please let me know without being rude about it.
Here is a link to code I have that compiles and generates what I want but keybinding does not work(if you want a look): https://www.dropbox.com/sh/78mj9aes2c0598a/AADZoJWlw79I5Z0Ub3uon6ZVa?dl=0
Here is a link to "working" code where I attempted the BufferedImage(if you want to look):https://www.dropbox.com/sh/hujm1ztrttkdq4f/AAB9j9P3PvPQpRNi_ckzTHOha?dl=0

How to track multiple touch events in Libgdx?

I am making a racing game using Libgdx. I want to touch the half right side of screen to speed up, at the same time without removing previous touch point touch again another on the left side of the screen to fire a shot. I am unable to detect later touch points.
I have searched and get Gdx.input.isTouched(int index) method, but cannot determin how to use it. My screen touch code is:
if(Gdx.input.isTouched(0) && world.heroCar.state != HeroCar.HERO_STATE_HIT){
guiCam.unproject(touchPoint.set(Gdx.input.getX(), Gdx.input.getY(), 0));
if (OverlapTester.pointInRectangle(rightScreenBounds, touchPoint.x, touchPoint.y)) {
world.heroCar.state = HeroCar.HERO_STATE_FASTRUN;
world.heroCar.velocity.y = HeroCar.HERO_STATE_FASTRUN_VELOCITY;
}
} else {
world.heroCar.velocity.y = HeroCar.HERO_RUN_VELOCITY;
}
if (Gdx.input.isTouched(1)) {
guiCam.unproject(touchPoint.set(Gdx.input.getX(), Gdx.input.getY(), 0));
if (OverlapTester.pointInRectangle(leftScreenBounds, touchPoint.x, touchPoint.y)) {
world.shot();
}
}
You'll want to use the Gdx.input.getX(int index) method. The integer index parameter represents the ID of an active pointer. To correctly use this, you will want to iterate through all the possible pointers (in case two people have 20 fingers on the tablet?).
Something like this:
boolean fire = false;
boolean fast = false;
final int fireAreaMax = 120; // This should be scaled to the size of the screen?
final int fastAreaMin = Gdx.graphics.getWidth() - 120;
for (int i = 0; i < 20; i++) { // 20 is max number of touch points
if (Gdx.input.isTouched(i)) {
final int iX = Gdx.input.getX(i);
fire = fire || (iX < fireAreaMax); // Touch coordinates are in screen space
fast = fast || (iX > fastAreaMin);
}
}
if (fast) {
// speed things up
} else {
// slow things down
}
if (fire) {
// Fire!
}
An alternative approach is to setup an InputProcessor to get input events (instead of "polling" the input as the above example). And when a pointer enters one of the areas, you would have to track that pointer's state (so you could clear it if it left).

Java moving a image up and down, animated motion

I'm wondering how I can move an image after it has been drawn?
Heres my code for drawing the image:
public int probeX = 500;
public int Minerals = 400;
public int drawProbeA, drawProbe = 0;
public void init() {
// Images Call
probe = getImage(getDocumentBase(), "image/probe.png");
}
public void paint(Graphics g) {
if (drawProbe == 1) {
for (int k = 0; k < drawProbeA; k++) {
g.drawImage(probe, probeX, 474, 50, 50, this);
probeX += 50;
}
probeX = 500;
}
}
public boolean mouseDown(Event e, int x, int y) {
// Clicking on the probe icon
if (x > 1068 && x < 1119 && y > 785 && y < 832 && onNexus == 1
&& Minerals >= 50) {
drawProbeA += 1;
drawProbe = 1;
Minerals -= 50;
}
return true;
}
How can I make it so that after the images are drawn, that hitting an icon will cause the image to be auto moved down the y-axis (like 50 pixels)? Basically, like sliding the image down with an animation? And then stop and then move back up to the orginal spot.
I am using an Applet and would like the animation to loop repeatedly. Thanks.
You need to have a global variable, or another variable somewhere, that indicates that...
The image needs to move
How far in the Y direction it has moved already
Which direction it is going (up or down)
When you have this, you need to add code to your paint() method to draw the image in the correct spot.
You would also need a Timer or Thread that will tell the component to repaint() every few milliseconds, and change your global variables so that it will repaint it lower/higher.
So, as a bit of an example, you might have some global variables like this...
int yPosition = 0;
boolean goingDown = true;
When you need to start your animation, start a Timer that calls the following over and over...
if (goingDown == true){
// if we've gone down 50 pixels, start going up again
if (yPosition <= 0){
goingDown = false;
yPosition++;
}
else {
yPosition--; // move it down 1 pixel
}
}
else {
// if we're going up and we reach 0, go down again
if (yPosition >= 50){
goingDown = true;
yPosition--;
}
else {
yPosition++; // move it up1 pixel
}
}
component.repaint(); // this will call the paint() method
Not your paint method just need to draw your image at the different position. Just change the g.drawImage(probe,probeX,474,50,50,this); like to include the yPosition...
g.drawImage(probe,probeX,474+yPosition,50,50,this);
This should at least point you in the right direction.

if/then with pixel finding and looping, all of which is above me at the moment

I want to take a screenshot, and if the pixel is the correct value RGB then take another screenshot and find next pixel or else repeat.
this is the code to get the pixel and it works like a charm!
{
BufferedImage image = robot.createScreenCapture(rectangle);
search: for(int x = 0; x < rectangle.getWidth(); x++)
{
for(int y = 0; y < rectangle.getHeight(); y++)
{
if(image.getRGB(x, y) == color3.getRGB())
{
break search;
}
}
}
}
what i want to know i guess is how would i go about asking it to repeat this segment of code until the pixel equals the true color. the color i am looking for is:
Color color3 = new Color(114, 46, 33);
Ok context, i am building a program that goes through steps, one opens the given puzzle, i have that down because i can use simple pixel data, then it needs to center the mouse on the center pixel. The problem is i cant just use a second get pixel image because it takes a while for the game to open the relevant jpanel so i need my program to wait until it can find a pixel indicating the game is open before it starts to look for the pixel to center the mouse.
You can probably separate the screenshot code into a method and call it until you get the desired result:
public boolean checkColor(Color inputColor) {
BufferedImage image = robot.createScreenCapture(rectangle);
for(int x = 0; x < rectangle.getWidth(); x++) {
for (int y = 0; y < rectangle.getHeight(); y++) {
if (image.getRGB(x, y) == inputColor.getRGB()) {
return true;
}
}
}
return false;
}
This method will return true if it can find the given inputColor in the screenshot. You might then use it in a loop as follows:
Color newColor = ...;
while (!checkColor(newColor)) {
new Color = new Color(114, 46, 33);
// Or change color in here for every iteration
}
This loop will terminate if it can't match the screenshot to newColor.

Categories

Resources