So I am working on a game and I need to get connected textures working.
The maps are randomly generated so all I have is a byte array of what tile should be where.
And I have an idea that if I split each tile into 4 8x8 tiles and combine them into a single 16x16 tile so I can connected textures with minimal work.
So my main question is how can I take a texture sprite sheet with 8x8 tiles then take for tiles and arrange them into a single 16x16 tile for use with a StaticTiledMapTile.
MapLayers layers = map.getLayers();
TiledMapTileLayer baselayer = new TiledMapTileLayer(128, 128, 16, 16);
for (int y = 0; y < LevelHight; y++) {
for (int x = 0; x < LevelWidth; x++) {
Cell cell = new Cell();
Tile tile = getTile(x, y);
cell.setTile(new StaticTiledMapTile(atlas.findRegion(tile.atlasName)));
baselayer.setCell(x, y, cell);
}
}
public Tile getTile(int x, int y) {
if (x < 0 || y < 0 || x >= 128 || y >= 128)
return Tile.rock;
return Tile.tiles[tiles[x + y * 128]];
}
Let me know if you need any more info.
Related
I am trying to make a program where there are lines in a grid pointing towards the mouse like magnets. I am a beginner in Processing, can someone point me towards a tutorial on how to do that or give me some code and explain what it does?
int x1 = 0;
int x2 = 0;
int y1 = 0;
int y2 = 0;
void setup() {
size(200, 200);
}
void draw() {
background(255, 255, 0);
x1 = (mouseX + 100) / 2;
y1 = (mouseY + 100) / 2;
x2 = -1 * x1 + 200;
y2 = -1 * y1 + 200;
line(x1, y1, x2, y2);
}
There's plenty of solutions for this project. One of the easiest is to use Processing's PVector class.
The PVector class can be used for two or three dimensional vectors. A vector is an entity that has both magnitude and direction. The PVector class, however, stores the components of the vector (x,y for 2D, and x,y,z for 3D). The magnitude and direction are calculated from the components and can be accessed via the methods mag() and heading().
A two dimensional vector in Processing is defined through x and y components:
PVector v = new PVector(xComponent, yComponent);
With some mathematical formulae, you can determine magnitude and direction using the x- and y-components. But we don't need to determine these.
Below, I've attached completed solution code. Most of it should make sense to you. But it's worth understanding what is going on with PVector.
A nested for loop within void draw() contains x and y variables that represent the coordinates of each grid vertex.
We first define PVector v as a vector given by an x-component of mouseX - x, or the difference between the x-positions of the mouse and each grid point. Similarly, the y-component given by mouseY - y has the same difference.
Creating a variable PVector u initialized from v.setMag(15) holds a PVector that has the same direction as v, but with a length of just 15.
Now to draw the lines. Vectors represent an offset, not a position (in this case), so drawing a line from a grid point to an offset of a grid point is key.
Hence line(x, y, x + u.x, y + u.y), where u.x and u.y are the x- and y-components of the vector u.
void setup() {
size(600, 600); // Set the size of the canvas to 600x600.
}
void draw() {
background(255);
stroke(200); // Set the stroke color to black
int distVertLine = width / 10; // This variable defines the distance between each subsequent vertical line.
for(int i = 0; i < width; i += distVertLine) {
line(i, 0, i, height); // Draw a line at x=i starting at the top of the canvas (y=0) and going to the bottom (y=height)
}
int distHorizLine = height / 10; // This variable defines the distance between each subsequent vertical line.
for(int i = 0; i < width; i += distHorizLine) {
line(0, i, width, i); // Draw a line at y=i starting at the left of the canvas (x=0) and going to the right (x=width)
}
stroke(0); // Set the stroke to black.
// Use a nested for loop to iterate through all grid vertices.
for(int x = 0; x <= width; x += width/10) {
for(int y = 0; y <= height; y += height/10) {
PVector v = new PVector(mouseX - x, mouseY - y); // Define a vector that points in the direction of the mouse from each grid point.
PVector u = v.setMag(15); // Make the vector have a length of 15 units.
line(x, y, x + u.x, y + u.y); // Draw a line from the grid vertex to the terminal point given by the vector.
}
}
}
The answer already given by Ben Myers is excellent! The code below has a few small modifications:
the two for loops for the grid lines have been combined (since width and height are equal);
the construction of the vector is combined with setting the magnitude;
some minor changes to colors and comments.
Modified code:
void setup() {
// Set the size of the canvas to 600x600 pixels.
size(600, 600);
}
void draw() {
// There are 10x10 grid cells that each have a size of 60x60 pixels.
int gridSize = width / 10;
// Set the background color to anthracite and the stroke color to orange.
background(56, 62, 66);
stroke(235, 113, 52);
// Draw vertical and horizontal grid lines.
for (int lineIndex = 0; lineIndex < gridSize; lineIndex++) {
line(lineIndex * gridSize, 0, lineIndex * gridSize, height);
line(0, lineIndex * gridSize, width, lineIndex * gridSize);
}
// Set the stroke color to blue.
stroke(0, 139, 225);
// Use a nested for loop to iterate through all grid cells.
for (int x = 0; x <= width; x += gridSize) {
for (int y = 0; y <= height; y += gridSize) {
// Define a vector that points in the direction of the mouse from
// each grid point and set the vector length to 15 units.
PVector vector = new PVector(mouseX - x, mouseY - y).setMag(15);
// Draw a line from the grid point to the end point using the vector.
line(x, y, x + vector.x, y + vector.y);
}
}
}
When iterating over my BufferedImage in Java, i would normally use a for loop like this:
for(int x = 0; x < width; x++) {
for(int y = 0; y < height; y++) {
For some reason this isnt working. However, when using a for loop like this:
for(int x = 0; x < height; x++) {
for(int y = 0; y < width; y++) {
it works like a charm. I still use x and y like i would in the upper loop (bufferedImage.getRGB(x, y)) even though they are switched up. WHY?!
EDIT: I get width and height like this:
final int width = bufferedImage.getWidth();
final int height = bufferedImage.getHeight();
2nd EDIT: By not working i mean the rgb values are not matching with the actual ones. My picture only contains values like (0, 255, 0) / (255, 0, 0) / (0, 0, 255) and it tells me (255, 255, 255) and stuff like that. Also i get values even if it is transparent at that point.
3rd EDIT: For everyone having a similar problem:
-switching up x and y is not actually doing anything (in my case because i have a 12x12 image)
-colors like (255, 255, 255) appear when the image is transparent at that point. Idk why
The meaning of 'x' here is the line x in your image and 'y' is the column y in your image because you are manipulating pixels. So x goes from 0 to Height and y from 0 to Width.
I need to create a loop which draws rectangles in a vertical line with alternating color (e.g. black, white, black, white). Can anyone tell me how this is done?
I have tried numerous ways but can't seem to get the loop to work, thanks.
for (int x = 0; x>10;x++) {
int y= 180;
graph2D.drawRect(170, y, 20, 50);
y = y + 45;
}
This is what I have, it won't draw the rectangles for some reason and I cant get it to alternate colors.
You've got a few issues here.
Your for loop will not perform any iterations, as your condition is x > 10 instead of x < 10.
Change the first line from:
for (int x = 0; x>10;x++){
To:
for (int x = 0; x < 10; x++) {
Also, you reset y to 180 every iteration, so once your loop does start, all of the rectangles will be drawn on top of each other. Declare y outside of the loop, or use x to calculate the rectangles position.
Either like this:
int y = 180;
for (int x = 0; x < 10; x++) {
graph2D.drawRect(170, y, 20, 50);
y = y + 45;
}
Or like this:
for (int x = 0; x < 10; x++) {
graph2D.drawRect(170, (x * 45) + 180, 20, 50);
}
The above math (x * 45) + 180 is a super simple way of saying that the first rectangle will be at (x * 45) + 180 = 0 + 180 = 180, the second will be at (x * 45) + 180 = 45 + 180 = 225 and so on and so on.
To change the color of the rectangles, you'll need to make a list or array of Colors, and use a different Color from the list, in each iteration.
//Make the list
Color[] colors = {Color.black, Color.blue, Color.cyan, Color.darkGray,
Color.green, Color.lightGray, Color.magenta, Color.magenta,
Color.orange, Color.pink, Color.red, Color.white, Color.yellow};
//Draw each rectangle
for (int x = 0; x < 10; x++) {
//Change the color
g.setColor(colors[x]);
//Draw the rectangle
graph2D.drawRect(170, (x * 45) + 180, 20, 50);
}
Of course if you want the colors to be random, you can look into using the Random class, and generating a random number between 0 and the length of your colors array. Also note that I use x as an index for the colors array, and if your loop increments x to be higher than the number of colors in the array, you'll get an ArrayIndexOutOfBoundsException.
I also assumed you named your instance of Graphics as g, since it is done that way most of the time.
Why do you use the y variable instead of x that you are looping though?
#Override
public void paint(Graphics graph2D) {
for (int y=0; y<10; y++) {
int height = 50;
if (y%2==0) {
graph2D.setColor(Color.white);
} else {
graph2D.setColor(Color.black);
}
graph2D.fillRect(170, 180 + y*height, 20, 50);
}
}
Also mind the difference while drawing a rectangle:
.drawRect(..) draws the border of a rectangle.
.fillRect(..) draws the rectangle itself.
In case you want to switch between black and white color, change the color with every loop. Every even number y%2 == 0 of loop will have the one color, otherwise the second one (also mentioned in the code above):
if (y%2==0) {
graph2D.setColor(Color.white);
} else {
graph2D.setColor(Color.black);
}
So I have to use java.awt.color to flip some imported images.
Here is my primary method to achieve flipping an image over the vertical axis:
public void execute (Pixmap target)
{
Dimension bounds = target.getSize();
// TODO: mirror target image along vertical middle line by swapping
// each color on right with one on left
for (int x = 0; x < bounds.width; x++) {
for (int y = 0; y < bounds.height; y++) {
// new x position
int newX = bounds.width - x - 1;
// flip along vertical
Color mirrorVert = target.getColor(newX, y);
target.setColor(x, y, new Color (mirrorVert.getRed(),
mirrorVert.getGreen(),
mirrorVert.getBlue()));
}
}
}
However, when this executes, instead of the image, flipping, I get something like this:
Original:
"Flipped":
Thank y'all for the help
// flip along vertical
Color mirrorVert = target.getColor(newX, y);
target.setColor(x, y, new Color (mirrorVert.getRed(),
mirrorVert.getGreen(),
mirrorVert.getBlue()));
target.setColor(newX, y , new Color(255,255,255));
}
This should work in theory. Basically the idea is to set the Colors on the right side to white, while copying it over to the left side.
Actually this will not work... So what you could do is to save the new colors in an array. Then you can make everything white and put the swapped colors back.
for (int i=0;i<image.getWidth();i++)
for (int j=0;j<image.getHeight();j++)
{
int tmp = image.getRGB(i, j);
image.setRGB(i, j, image.getRGB(i, image.getHeight()-j-1));
image.setRGB(i, image.getHeight()-j-1, tmp);
}
That one looks promising.
I am working on a game in Android and I have Bitmap objects being drawn. They are rotated using the Matrix class. The problem I am having is being able to access the pixels of the rotated Bitmap. When I access them after rotation the pixels are still representing the unrotated version. Does anyone have any ideas? Maybe I can rotate the pixel array based on an arbitrary number of degrees? I have seen solutions that create a new bitmaps on the fly based on the newly rotated images, but I can't do this because of performance issues. Thanks!
Here is how I draw the bitmap currently (The bitmap is drawn using the matrix as its position)...
canvas.drawBitmap(bitmapPlayer, positionMatrix, null);
Here is how I create the positionMatrix variable...
Matrix m = new Matrix();
m.postRotate(degrees, bitmapCenterX, bitmapCenterY);
positionMatrix.set(m);
Here is how I access the pixels currently (This accesses the pixel array I created below)...
getPixel(x, y);
Here is how I build the pixel array that I have tried to modify...
// Build pixel 2d array
pixelData = new int[bitmapPlayer.getWidth()][bitmapPlayer.getHeight()];
for(int x=0; x<bitmapPlayer.getWidth(); x++) {
for(int y=0; y<bitmapPlayer.getHeight(); y++) {
pixelData[x][y] = bitmapPlayer.getPixel(x, y);
}
}
Here is how I have tried to manipulate the array...
public void rotatePixels(int degrees) {
int[][] newPixelData = new int[bitmapPlayer.getWidth()][bitmapPlayer.getHeight()];
double cos = Math.cos(Math.toRadians(degrees));
double sin = Math.sin(Math.toRadians(degrees));
for(int x=0; x<bitmapPlayer.getWidth(); x++) {
for(int y=0; y<bitmapPlayer.getHeight(); y++) {
if(pixelData[x][y] != 0) {
int currentX = x + getTopLeftX();
int currentY = y + getTopLeftY();
int nextX = (int)((currentX * cos) - (currentY * sin));
int nextY = (int)((currentX * sin) + (currentY * cos));
if(nextX >= 0 && nextX < bitmapPlayer.getWidth() && nextY >= 0 && nextY < bitmapPlayer.getHeight()) {
newPixelData[nextX][nextY] = 1;
}
}
}
}
this.pixelData = newPixelData;
}
Have you tried:
Matrix mat = new Matrix();
mat.postRotate(45);
Bitmap newBm = Bitmap.createBitmap(bitmapPlayer, 0, 0, bitmapPlayer.width(), bitmapPlayer.height(), mat, true);
and then accessing the pixels of the new Bitmap?
I think right now you just draw a rotated bitmap on the canvas, you're not actually rotating the bitmap
EDIT:
The way you do it in your orinigal post won't work because you start at (0,0) and work your way down the left column... Depending on the rotation degree you'd have to start at a different place and then go down a different column. i.e. a small ctrclkwise rotation and you start at the top right index.
Bitmap bm = someImage;
int startx, starty;
int degree = rotateDegree % 360; // counterclockwise
if (degree >= 0 && degree < 90) {
startx = bm.getWidth();
starty = 0;
} else if (degree >= 90 && degree < 180) {
startx = bm.getWidth();
starty = bm.getWidth();
} else if (degree >= 180 && degree < 270) {
startx = 0();
starty = bm.getWidth();
} else {
startx = 0;
starty = 0;
}
And then try traversing the image that way, starting at (startx, starty)
and adding or subtracting the correct angle (you can use some boolean to keep track
of whether you're adding or subtracting from x or y respectively). Let me know if this works,
and if it doesn't can you be a little more specific about where you think the problem might be?