Hello, i’m trying to make a strategy game and I have a question on the background/map matter.
I want to make a map like LoL (not equal to it, but the same features, meaning that I can see the whole map by moving the mouse around), and i’m wondering if the map in itself should be a static image that you can scout around with your mouse/keyboard or if it’s a series of updated images when I move the mouse like
Move mouse to the border of the screen -> image gets updated with a new one
Main question is: Which of these two methods is possible and which is the best?
Edit: Got another question, take the LoL example again, how can I make an object(let’s say, my character) move by following the position of my mouse click ?
When you program in any computer language, such as Java, this is always possible.
If your map is fairly small and you can fit it in memory, you can get away with just loading the map once and using culling to draw things that only the player can see. Loading new map images through data chunks is only valid if your map is really huge or infinite like Minecraft.
Any graphic canvas you use will have an x and y axis grid. To move characters around the map, you have to translate the click coordinates into your world coordinates. I’m guessing since you are similar to LOL that you’d be using an isometric grid to display coordinates. (The more advanced if you can’t click through walls is ray casting).
I recommend searching the terms in bold if you need more information. Any 2d or 3d framework can handle a game like LOL fairly well, with the only limitation being your access to art, effects, and music.
When you say “fit it in memory”, do you mean fitting it entirely on the screen? If not, take the LoL map, does it ‘fit in memory’? My map is not going to be larger than it, so what should be the best way to do it?
Could you please give me some basic guidelines with coding on how to do the map?
“Fit in memory” means that the map is small enough to be loaded all at once without much, if any, culling. For large maps you need to use culling to make sure that the game doesn’t end up hogging all of the system resources.
Just think about how to make the map and all that work. If you draw it out and that then you’ll figure it out eventually. That’s how I ended up getting it at least.
Sadly, I don’t have much to work on the game these days, but I looked up for the term culling and what I understood is that you load the scenery your “camera” is focusing on, while the near part of the map of your “camera” is partially loaded and only when I move the “camera” it gets fully loaded. Did i understand it right?
I want to be able to load a small map (but one that doesn’t fit fully on the screen) at once and then just be able to move around it with my mouse/keys. And I want it to be able to be modified even if the player isn’t actually seeing the zone of the map that is being modified.
If you are making a map the size of the one in Lol you do not have to worry much about memory.
Also depending on how big the whole map is you could make one big image and just move it as you move the camera.
If it’s very big you could divide it into a grid of images and only draw the ones you know are visible.
You know take the camera position and the screen size and then calculate which images are on the screen.
This could save you some time in rendering.
Regarding the movement by mouse there are 2 possibilities:
1: Have the character move in a straight line from his position to the mouse. (Not very good)
2: Learn about A-star (A*) algorithms. http://www.policyalmanac.org/games/aStarTutorial.htm
The A* might be a little hard if you don’t have that much experience, but it is really useful in most games.
Also you will learn a lot whilst making it.
But is there a camera element in the Java API? I mean a camera like the camera object in Unity.
If I loaded/instantiated the whole map at once, would I need to handle the map coordinates to move it around?
I’m not very familiar with the ‘graphic’ API of Java so if you could provide me some useful links on this I would be appreciated.
What I would do is to have an offsetX and offsetY variable and then just add that to everything being drawn on the screen.
This way you get the moving camera effect but in fact it is everything else that is moving
This is how I do it in my games.
It is a long time since I used java2D so I can’t really help you much
The only thing I remember from it is that you use drawImage to draw an image
Thanks, i think you cleared my doubts! I’m going to try to work on this right now.
Visualize my map as being a look-a-like to LoL or Dota’s map. I want a static image for a map with elements, like trees, that can interact with the player.
Just one thing, I understand you’re talking by experience, but are by what i’m understanding is that the movement of the camera on a game like LoL works the same way it works on a basic platformer, since you handle the “camera movement” with two offset variables. Am I correct?
Just one thing, I understand you’re talking by experience, but are by what i’m understanding is that the movement of the camera on a game like LoL works the same way it works on a basic platformer, since you handle the “camera movement” with two offset variables. Am I correct?
[/quote]
Erm actually I was assuming that you only wanted to move the camera in two directions
If you are going to do a 3D game with a completely free moving camera I think you need to learn how to use projection-matrices
And don’t take me as an expert because I am actually not THAT experienced
Every advice/information helps and I thank you for that!
It’s not on my scope to be able to handle the ‘camera’ so it can see the face of the characters if you know what I mean.
For now I want to do this:
1 - Move the camera right, left, up and down. I played a little bit with a ~1800x800 2D image as the background and was able to move it around.
2 - As I did the point above, I noticed that my object (the character) isn’t ‘hidden’ when I should have gotten out of it’s scope. Take LoL (i’m using LoL as an example because I think it’s that example that everyone knows nowadays), you move the camera to your right/left to check the map and your character leaves the screen - I want to do this but don’t know how.
3 - As a final product I want a camera really like LoL/DOTA (a 3D’ish look), although I don’t need the feature where I can look up close to my character. Just a simple zoom in/out.
I’m at step 2 at the moment and would like some enlightenment on this one…
I guess I wasn’t thorough enough on my first pass. Let me tackle all your questions bit by bit. Warning, this may be a very long post as I want to cover everything in this thread.
When I say “fit in memory”, I mean not getting a Java heap space error. Yes, DOTA maps are small enough to fit in memory without causing a crash. (No one really needs a 1000x1000 tile map anyway).
The best way is just to display the map. Usually, you’d want to make sure that only visible items are displayed on the screen. The best way to do that is to make sure tiles that aren’t displayed skip their graphic call.
[quote]Could you please give me some basic guidelines with coding on how to do the map?
[/quote]
It is a different game entirely, but the basic idea is the same. Use an array to display the right tile data. It may help to check out some projects I’ve been working on for an idea.
You might want to show a bit of source code for this. I’m thinking this is a culling issue, but it may also be that you want your character to be transparent. For the former, all you need to do is check screen coordinates and not display if it is too far away from the screen…
Hopefully it is something close to that, but in all directions. You might want to post more information, however…
[quote]3 - As a final product I want a camera really like LoL/DOTA (a 3D’ish look), although I don’t need the feature where I can look up close to my character. Just a simple zoom in/out.
[/quote]
Either you draw all your images isometric, or use a 3D solution like OpenGL. However, without source code I’m afraid this is probably as much as you are going to get for help. Literally, there is not an easy solution for this. With isometic (2.5D), you’ll literally need to draw out all the images and the directions. For 3D (OpenGL), you will need to make the models and learn how to use LWJGL, JOGL, or LibGDX. Especially if you want the nice lighting effects LOL has…
I don’t really think thatmy code is going to help you much on understanding my issues, because I’m only beggining so the code is really basic but for now I have been playing with this:
public class Background {
private int bgX;
private int bgY;
private int speedX;
private int speedY;
final int SPEED = 5;
private boolean movingLeft = false;
private boolean movingRight = false;
private boolean movingUp = false;
private boolean movingDown = false;
public Background(int x, int y) {
bgX = x;
bgY = y;
speedX = 0;
speedY = 0;
}
public void update() {
if (speedX < 0) {
bgX += speedX;
}
if (bgX <= 200 && speedX > 0) {
bgX += speedX;
}
if (speedX > 0 && bgX > 200) {
setSpeedX(-SPEED);
}
if (speedY < 0) {
bgY += speedY;
}
if (bgY <= 200 && speedY > 0) {
bgY += speedY;
}
if (speedY > 0 && bgY > 200) {
setSpeedY(-SPEED);
}
public void moveRight() {
this.setMovingRight(true);
this.speedX = -SPEED;
}
public void moveLeft() {
this.setMovingLeft(true);
this.speedX = SPEED;
}
public void moveUp() {
this.setMovingUp(true);
this.speedY = SPEED;
}
public void moveDown() {
this.setMovingDown(true);
this.speedY = -SPEED;
}
private void stop() {
if (isMovingRight() == false && isMovingLeft() == false) {
speedX = 0;
}
if (isMovingRight() == false && isMovingLeft() == true) {
moveLeft();
}
if (isMovingRight() == true && isMovingLeft() == false) {
moveRight();
}
if (isMovingUp() == false && isMovingDown() == false) {
speedY = 0;
}
if (isMovingUp() == false && isMovingDown() == true) {
moveDown();
}
if (isMovingUp() == true && isMovingDown() == false) {
moveUp();
}
}
public void stopRight() {
setMovingRight(false);
stop();
}
public void stopLeft() {
setMovingLeft(false);
stop();
}
public void stopUp() {
setMovingUp(false);
stop();
}
public void stopDown() {
setMovingDown(false);
stop();
}
public boolean isMovingRight() {
return movingRight;
}
public void setMovingRight(boolean movingRight) {
this.movingRight = movingRight;
}
public boolean isMovingLeft() {
return movingLeft;
}
The movement is ‘called’ when I press the arrow keys.
I have the needed setters and getters aswell in this class but didn’t want to fill too much room with those.
I think the problem with the object not getting hidden is solved by what you said - skip their graphic call.
I’m going to try this one out
The thing that is bugging me the most is the fact that the tutorials I can find and see show you how to make a platformer which makes them just show how to make and move around simple map/level.
I think i’ll forget the 2.5D/3D stuff for now and stick with the 2D to almost fully understand how this works, because the graphics (the map/level mostly) are really what’s stalling my progress on this.
