So I am trying to create a 2D side-scrolling javafx game.
So far I used AnimationTimer to control movement of my character. But now I am kind of stuck trying to make the stage move.
I can move non-interactive elements using AnimationTimer again. But I am lacking an idea for how should I generate interactive elements in game.
For example, lets say player walks a lot of steps and reaches to take a pickup. Now how do I put this pickup in stage so it is somewhere later in game. To try explain my problem better, consider this pesky image I drew in paint:
Initially, only the screen between green bounds is visible to player. The player must walk forward (and hence the screen must walk forward too) and should find that pickup between two walls. How do I place pickup outside scene's visible view so it comes into view only when player reaches it?
The easy way: You add everything to the scene and give it absolute coordinates. You move the player by changing its coordinates in the scene. Depending on the position of the player you start scrolling. While you scroll the background you also move all other objects about the same x and y coordinates. The visible view has a given width and height. Depending on the player's position, view width/height and object range the objects become visible during scrolling.
Related
Is there a way to allow the user to draw individually selectable, movable, and re-sizable shapes within JavaFX and/or canvas that I am not considering or aware of?
I am new to JavaFX (Java GUIs in general, actually) and am trying to devise a method of allowing a user to draw (click & drag) up to 100 rectangles on a pane/workspace/page. I am also looking for a method to make this scalable, but keeping static proportions for now will be fine. I have not found a great deal of comparable examples in my search, most of which explore only one of those options but leave out certain things I need to accomplish. Usually they show pre-defined nodes or canvas shapes that aren't individually workable. So I am trying to find the best method to accomplish this.
Drawing the shapes is NOT the issue, I know how to do that. It's making them individual objects within the workspace (selectable, movable, re-sizable).
My current idea is to create a Javafx pane, then create 100 canvases within the pane as predefined layers which will be the same dimensions as the entire workspace. Each drawn rectangle will occupy one of the layers/canvas. Selecting each rectangle will involve a click event within the drawn rectangle within the layer allowing the user to edit the, (move, re-size, etc.)
The following Oracle tutorial is what I am going off of for this method of layering. http://docs.oracle.com/javafx/2/canvas/jfxpub-canvas.htm
I have the feeling that my working premise for this method is flawed. One reason is it requires pre-defined number of layers. Although I want to limit this anyway, it is not very dynamic. But mostly, it just seems convoluted.
My apologies for the lack of code, and for the the conceptual nature of the question, but I've been searching and experimenting (unsuccessfully) for a couple weeks. Any help or insight would be appreciated.
Thank You
Project Context
I'm creating a basic form creator. The user (in creation mode) will drag a series of rectangles that are associated with corresponding objects indicating certain attributes, coordinates, and dimensions of each rectangle. This data will be saved and used (in form mode) for the placement of text fields for form use. Wherever rectangle were drawn on the workspace, text fields of the same location and dimension will be placed on the form.
The easiest method I can think of is by making a group, and adding rectangles to the group, on-demand. You can then attach transforms and mouselisteners to each rectangle, and have it so that the properties of the transform is updated when a drag is detected. I've put together a simple demo here. Use a right-click to make a rectangle, left mouse drag to resize, and middle mouse drag to move the rectangle.
Group root = new Group();
Scene scene = new Scene(root, 1080, 720, true);
scene.addEventFilter(MouseEvent.MOUSE_PRESSED,e->{
if(e.getButton()==MouseButton.SECONDARY)
{
//make a new rectangle
Rectangle rect = new Rectangle(100,100);
root.getChildren().add(rect);
rect.setFill(Color.CYAN);
Scale scaler = new Scale(1,1);
Translate locationCenter = new Translate(e.getX(),e.getY());
rect.getTransforms().add(locationCenter);
rect.getTransforms().add(scaler);
rect.getTransforms().add(new Translate(-50,-50));
//listen for left mouse drags
rect.addEventFilter(MouseEvent.MOUSE_DRAGGED, e2->{
if(e2.getButton()==MouseButton.PRIMARY)
{
//resize with left drag
double scaleX=e2.getSceneX()-rect.localToParent(0,0).getX();
double scaleY=e2.getSceneY()-rect.localToParent(0,0).getY();
scaler.setX(scaleX/100);
scaler.setY(scaleY/100);
} else if(e2.getButton()==MouseButton.MIDDLE)
{
//move with middle drag
locationCenter.setX(e2.getSceneX());
locationCenter.setY(e2.getSceneY());
}
});
}
});
I am currently making a path-laying Tile game in Java where I am using a JLayeredPane with multiple layers. The game runs fine, but everytime the repaint method is called, the entire pane flickers.
Right now I have the game running on a timer where every tick automatically moves the character one tile at a time along the path in which I have laid out. Naturally, I would need to update the screen in order to reflect the changes to the user, but the problem is that the repaint method forces a redraw on all layers of the LayeredPane. Every tick would cause a flicker on the map area of the screen. While it is bearable, I would just like to get rid of it so it looks nicer.
I have researched on the use of double buffering and have even set the option to double buffer the pane to true as well (e.g. pane.setDoubleBuffered(true)), but have had no luck with various implementations. Is there a way to just draw the entire pane with all layers for every tick in an outside buffer, then copy it in one go over to the main screen?
Thank you
I am learning game programming. I am trying to make a game similar to Pacman. I have made a grid with x[] and y[] (no using tiled). when sprite is in a specific grid I want to destroy its food item which is an image within the grid and add 1 to score. I tried to use image.destroy(); method but it didn't worked.
I tried, instead of destroying the image to change its location.
image.drawImage(image,x+25,y+25);
it only created a new object for as long as I was inside the specific grid.
The Game loop would not let me destroy the image or move it outside the screen.
I also tried
if(sprite is in grid){score=score+1;}
So once the sprite is in grid the score keeps on incrementing. I just want increment of "1" once my sprite is in specific grid.
Any help would be highly appreciated. Thanks.
Normally your grid[y][x] would contain values indicating what's there? This can be an enum with values EMPTY, WALL or FRUIT.
So when the player enters a cell with grid[player.getY()][player.getX()] == FRUIT, clear the cell to EMPTY, add 1 to the score, and invalidate that rectangle of the grid on screen.
The render() method will then check grid[], find it is empty.. and not draw any fruit.
You should have a single fruit image or ImageBuffer -- this doesn't have any specific position, but acts as an off-screen source for the render() function to draw it whereever it is needed. This doesn't represent any single fruit, so it doesn't get destroyed -- nor does it have a position.
Unlike sprites (for monsters/ player etc), fruit are not expected to be individually animated/ positioned around the screen.
I write simple game with libGdx. I have a hero, which always is in screen center and I must move my background sprite (or region?) to make move illusion. But my background sprite isn't infinity.
How can I create illusion of seamless infinity world?
Of course I can add several background sprites to try to cover all empty space of screen. But I must to draw out of the sceen a lot of all another objects: Houses, monsters, others heroes, etc. So I have a second question:
When I try to draw other object (a lot of objects!) out of the screen, how badly it affects memory? How to draw it correctly?
I know that OrthographicCamera in libgdx draw only viewportWidth-viewportHeight area. If it's right, then I must to move my camera and all my sprites too. I think it's not correctly.
How can I render infinity world in libgdx with OrthographicCamera?
How can I create illusion of seamless infinity world?
Create a tile background. Tile background means that if it was besides or top or bottom of itself, the edges of sticking line will not be visible to viewer.
To do this open your background image in photoshop and go to Filters > Other > Offset.
Set the offset filter to offset the background to center then try using photoshop tools to hide the edges (the + shape in image). Now again go to offset and return to 0, 0 and save your background.
When I try to draw other object (a lot of objects!) out of the screen,
how badly it affects memory? How to draw it correctly?
I have checked this and that was not much fps loosing on my test. So don't worry about it.
How can I render infinity world in libgdx with OrthographicCamera?
Move camera where-ever you want any x, y. Every time see where is camera and calculate needing tile backgrounds to draw (for example every time draw 3x3=9 backgrounds sticking together).
I've been banging my head against the wall for a couple hours trying to figure out the best way to overlay an animation on top of a current View. I have a ListView, and I want to display an animation (say a frame-by-frame bomb explosion) on top of the ListView when a user clicks a button.
Can someone point me in the right direction?
This is what your looking for:
http://developer.android.com/reference/android/view/SurfaceView.html
From the link:
The surface is Z ordered so that it is behind the window holding its SurfaceView; the SurfaceView punches a hole in its window to allow its surface to be displayed. The view hierarchy will take care of correctly compositing with the Surface any siblings of the SurfaceView that would normally appear on top of it. This can be used to place overlays such as buttons on top of the Surface, though note however that it can have an impact on performance since a full alpha-blended composite will be performed each time the Surface changes.
Or you could subclass the ListView and use the canvas to draw what ever 2d stuff you want:
http://developer.android.com/guide/topics/graphics/2d-graphics.html