When I tried draw a Texture using SpriteBatch it was result flip like this:
Here what I do:
I create MyRect object which draw bounding rectangle and an image.
Here MyRect class preview:
public class MyRect {
private Vector2 position;
private int width;
private float height;
private Texture img;
private Sprite sprite;
public MyRect(int x, int y, int width, int height){
img = new Texture("badlogic.jpg");
sprite = new Sprite(img);
position = new Vector2(x,y);
this.width = width;
this.height = height;
}
public void draw(ShapeRenderer shapeRenderer, SpriteBatch batch){
// Gdx.gl.glClearColor(0, 0, 0, 1);
// Gdx.gl.glClear(GL20.GL_COLOR_BUFFER_BIT);
shapeRenderer.begin(ShapeType.Line);
// Draw Background color
shapeRenderer.setColor(55 / 255.0f, 80 / 255.0f, 100 / 255.0f, 1);
shapeRenderer.rect(position.x, position.y, width, height);
shapeRenderer.end();
batch.begin();
// batch.disableBlending();
batch.draw(img, position.x, position.y,
width, height);
batch.end();
}
}
Parameters ShapeRenderer and SpriteBatch pass by GameScreen class.
GameScreen preview:
public class GameScreen implements Screen{
private MyRect myRect;
private ShapeRenderer shapeRenderer;
private SpriteBatch batch;
private OrthographicCamera cam;
public GameScreen(){
myRect = new MyRect(10,10,50,50);
int gameHeight=100;
cam = new OrthographicCamera();
cam.setToOrtho(true, 136, gameHeight);
batch = new SpriteBatch();
batch.setProjectionMatrix(cam.combined);
shapeRenderer = new ShapeRenderer();
shapeRenderer.setProjectionMatrix(cam.combined);
}
#Override
public void render(float delta) {
// TODO Auto-generated method stub
myRect.draw(shapeRenderer, batch);
}
}
Why is this happen? Am I doing it wrong?
Your camera is upside down because you called setToOrtho(true, ...) on it instead of setToOrtho(false, ...)
It is valid to use an upside-down camera (which might be more comfortable if you've used Flash or some other Y-down system before), but then you need to flip all your TextureRegions (aka Sprites): sprite.flip(false, true). Alternatively, you can create a TextureAtlas using TexturePacker (look it up in libgdx documentation) and set the flipY option, so it flips them ahead of time for you. Eventually, for performance you will need to use a TextureAtlas anyway.
By the way, when you start drawing multiple instances of MyRect, you are going to need to move the spriteBatch.begin() and end() and shapeRenderer.begin() and end() out of the individual MyRect's draw method or you will run into a performance problem. And as such, there will need to be two draw methods (one for sprite batch and one for shape renderer).
apparently, the only thing I see different than how I would do, is try to change:
this meybe if it works"for test"
cam.setToOrtho(false, 136, gameHeight);
this is how I use the camera.
I do not know whether to use true, you have to do some different way, to draw the batch, in anyway. if the camera false, it looks good, I think it has to flip the image before to draw uv
Related
I want to render a cube with three faces visible, each of those faces should have a different texture applied to it, which should be easily interchangable. I managed to get this basic code running, that only works with colors.
import com.jogamp.opengl.*;
import com.jogamp.opengl.awt.GLJPanel;
import javax.swing.*;
import java.awt.*;
import static com.jogamp.opengl.GL.GL_MULTISAMPLE;
public class CubeRenderer extends GLJPanel implements GLEventListener {
public static void main(String[] args) {
JFrame window = new JFrame("JOGL Scene");
GLCapabilities caps = new GLCapabilities(null);
CubeRenderer panel = new CubeRenderer(caps);
window.setContentPane(panel);
window.pack();
window.setLocation(50,50);
window.setResizable(false);
window.setDefaultCloseOperation(JFrame.EXIT_ON_CLOSE);
window.setVisible(true);
panel.requestFocusInWindow();
}
private final float rotateX;
private final float rotateY;
private final float rotateZ; // rotation amounts about axes
private int texture;
// Correct orientation -45.0, 150.0, 90.0
public CubeRenderer(GLCapabilities capabilities) {
super(capabilities);
setPreferredSize( new Dimension(500,500) );
addGLEventListener(this);
rotateX = -45.0f;
rotateY = 150.0f;
rotateZ = 90.0f;
}
private void square(GL2 gl, float r, float g, float b) {
gl.glColor3f(r,g,b); // The color for the square.
gl.glTranslatef(0,0,0.5f); // Move square 0.5 units forward.
gl.glNormal3f(0,0,1); // Normal vector to square (this is actually the default).
gl.glBegin(GL2.GL_TRIANGLE_FAN);
gl.glVertex2f(-0.5f,-0.5f); // Draw the square (before the
gl.glVertex2f(0.5f,-0.5f); // the translation is applied)
gl.glVertex2f(0.5f,0.5f); // on the xy-plane, with its
gl.glVertex2f(-0.5f,0.5f); // at (0,0,0).
gl.glEnd();
}
private void cube(GL2 gl) {
gl.glPushMatrix();
gl.glRotatef(180,0,1,0); // rotate square to back face
square(gl,0,1,1); // back face is cyan
gl.glPopMatrix();
gl.glPushMatrix();
gl.glRotatef(-90,0,1,0); // rotate square to left face
square(gl,0,1,0); // left face is green
gl.glPopMatrix();
gl.glPushMatrix();
gl.glRotatef(-90,1,0,0); // rotate square to top face
square(gl,0,0,1); // top face is blue
gl.glPopMatrix();
}
public void display(GLAutoDrawable drawable) {
// called when the panel needs to be drawn
GL2 gl = drawable.getGL().getGL2();
gl.glClearColor(0,0,0,0);
gl.glClear( GL.GL_COLOR_BUFFER_BIT | GL.GL_DEPTH_BUFFER_BIT );
gl.glMatrixMode(GL2.GL_PROJECTION); // Set up the projection.
gl.glLoadIdentity();
gl.glOrtho(-1,1,-1,1,-2,2);
gl.glMatrixMode(GL2.GL_MODELVIEW);
gl.glLoadIdentity(); // Set up modelview transform.
gl.glRotatef(rotateZ,0,0,1);
gl.glRotatef(rotateY,0,1,0);
gl.glRotatef(rotateX,1,0,0);
cube(gl);
}
public void init(GLAutoDrawable drawable) {
// called when the panel is created
GL2 gl = drawable.getGL().getGL2();
gl.glClearColor(0.8F, 0.8F, 0.8F, 1.0F);
gl.glEnable(GL.GL_DEPTH_TEST);
gl.glEnable(GL2.GL_LIGHTING);
gl.glEnable(GL2.GL_LIGHT0);
gl.glEnable(GL2.GL_COLOR_MATERIAL);
gl.glEnable(GL_MULTISAMPLE);
}
public void dispose(GLAutoDrawable drawable) {
// called when the panel is being disposed
}
public void reshape(GLAutoDrawable drawable, int x, int y, int width, int height) {
// called when user resizes the window
}
}
I however could not figure out how to apply texture instead of colors and how to then render the whole cube into a png, as I could not get any of these tutorials to run, as most of them were quite old.
Either merge the 3 images into a single image, create a single texture, bind it, enable texture target and use your texture as a texture atlas by using appropriate texture coordinates (see glTexCoords) or create 3 textures for your 3 images and perform enable/bind/draw/disable for each texture.
Have a look at TextureIO, AWTTextureIO, glBindTexture, glEnable, glDisable and glTexCoord2f.
Please note that my answer assumes that you use the fixed pipeline but using the programmable pipeline would be preferable on the long term. You should use the retained mode (VAOs, VBOs, ...) even though you use the fixed pipeline instead of the immediate mode (glBegin, glEnd, glVertex, ...) in my humble opinion.
I'm trying to use a TiledMap in a test game but I'm having issues with the size. I'm using an ExtendViewport with width 160 and height 90. I guess the problem is that the tiled map is drawing using the screen size, because it's zoomed in. Do I need 2 seperate cameras for the tiled map and the rest of the game (players, enemies, ...)?
This is all of my code:
public class Main extends Game {
private OrthographicCamera camera;
private ExtendViewport viewport;
private TiledMap tiledMap;
TiledMapRenderer tiledMapRenderer;
#Override
public void create () {
camera = new OrthographicCamera(160, 90);
camera.setToOrtho(false, 160, 90);
camera.update();
viewport = new ExtendViewport(160, 90, camera);
viewport.apply();
tiledMap = new TmxMapLoader().load("map1.tmx");
tiledMapRenderer = new OrthogonalTiledMapRenderer(tiledMap);
}
#Override
public void render () {
Gdx.gl.glClearColor(0, 0, 0, 1);
Gdx.gl.glClear(GL20.GL_COLOR_BUFFER_BIT);
camera.update();
tiledMapRenderer.setView(camera);
tiledMapRenderer.render();
}
#Override
public void resize(int width, int height) {
viewport.update(width, height, false);
}
#Override
public void dispose () {
}
}
Thanks
OrthogonalTiledMapRenderer's second parameter is unitScale. The unit scale tells the renderer how many pixels map to a single world unit. And it defaults to 1.
So in your case one pixel is equals to one unit size in tiled map. Try changing the unitScale parameter.
https://github.com/libgdx/libgdx/wiki/Tile-maps#rendering-tiled-maps
My goal is to create a game that is always displayed with an aspect ratio of 9:16 (basically 16:9, but upright) using FitViewport; it should be independet of a target device's resolution. In order to test this setup, I created the following minimal working example. A small green square indicates the origin of the coordinate system:
MyGame.java
public class MyGame extends ApplicationAdapter {
final int WORLD_WIDTH = 900;
final int WORLD_HEIGHT = 1600;
Stage stage;
Viewport vp;
public void create() {
stage = new Stage();
vp = new FitViewport(WORLD_WIDTH, WORLD_HEIGHT, stage.getCamera());
stage.setViewport(vp);
stage.addActor(new MySquare());
}
public void render() {
stage.act();
Gdx.gl.glClear(GL20.GL_COLOR_BUFFER_BIT);
stage.draw();
}
public void resize(int width, int height) {
stage.getViewport().update(width, height, true);
}
// dispose...
}
MySquare.java
public class MySquare extends Actor {
ShapeRenderer renderer = new ShapeRenderer();
#Override
public void draw(Batch batch, float alpha){
batch.end();
renderer.begin(ShapeRenderer.ShapeType.Filled);
renderer.setColor(Color.GREEN);
renderer.rect(0, 0, 50, 50);
renderer.end();
batch.begin();
}
}
Unfortunately, the result is not as expected: As you can see, the green square is actually not a square. This behavior is the same for both Windows and Android (in landscape mode):
However, when setting the size of the window programmatically and explicitly via LwjglApplicationConfiguration in DesktopLauncher.java to a valid 9:16 resolution, the green square is displayed correctly. Why is that and how can I avoid this workaround (which does not work for Android anyway)?
Your problem is that your shape renderer is ignoring the camera. Update it like this:
public void draw(Batch batch, float alpha){
batch.end();
renderer.setProjectionMatrix(batch.getProjectionMatrix()); // <<<<< Add this
renderer.begin(ShapeRenderer.ShapeType.Filled);
renderer.setColor(Color.GREEN);
renderer.rect(0, 0, 50, 50);
renderer.end();
batch.begin();
}
If you are planning to eventually use sprites, and you're simply wanting rectangle placeholders for your actors, you don't need a custom actor for this. You can use a generic Actor and call setDebug(true) on it, and Stage will automatically draw its outline using an internal ShapeRenderer. Of course, you must first set a size and position on the Actor.
I have an issue in LibGDX where when i call upon Gdx.input.getY(), it selects a pixel that's on the other side of the application relative to the center of the screen.
public class Main extends ApplicationAdapter {
private SpriteBatch batch;
private Texture img;
private OrthographicCamera camera;
int xPos;
int yPos;
private Vector3 tp = new Vector3();
BitmapFont font;
#Override
public void create () {
batch = new SpriteBatch();
img = new Texture("crosshair.png");
camera = new OrthographicCamera();
camera.setToOrtho(false, 1280, 720);
font = new BitmapFont();
}
#Override
public void render () {
yPos = Gdx.input.getY();
xPos = Gdx.input.getX();
Gdx.gl.glClearColor(0, 0, 0, 1);
Gdx.gl.glClear(GL20.GL_COLOR_BUFFER_BIT);
camera.unproject(tp.set(xPos, yPos, 0));
batch.begin();
font.draw(batch,xPos + " , " + yPos, Gdx.input.getX() - 25, Gdx.input.getY() - 5);
batch.draw(img, xPos, yPos);
batch.end();
}
#Override
public void dispose () {
batch.dispose();
img.dispose();
}
Subtracting the viewport height with the touch location won't work, because that would be subtracting world coordinates with touch coordinates. (and even for a pixel perfect projection it would be height - 1 - y). Instead use the unproject method to convert touch coordinates to world coordinates.
There are two problems with your code:
You are never setting the batch projection matrix.
Even though you are using the unproject method, you are never using its result.
So instead use the following:
#Override
public void render () {
Gdx.gl.glClearColor(0, 0, 0, 1);
Gdx.gl.glClear(GL20.GL_COLOR_BUFFER_BIT);
batch.setProjectionMatrix(camera.combined);
batch.begin();
camera.unproject(tp.set(Gdx.input.getX(), Gdx.input.getY(), 0));
font.draw(batch,tp.x+ " , " + tp.y, tp.x - 25, tp.y - 5);
batch.draw(img, tp.x, tp.y);
batch.end();
}
I would suggest to read the following pages, which describe this and the reasoning behind it in detail:
https://github.com/libgdx/libgdx/wiki/Coordinate-systems
https://xoppa.github.io/blog/pixels/
https://github.com/libgdx/libgdx/wiki/Viewports
It's better to try this
yPos = camera.viewportHeight - Gdx.input.getY();
It may be a dumb question but I need a little help / explanations. I can't manage to resize correctly my textures when I resize the window in libgdx. I want to keep the aspect of my textures or have them at least reduced on a lower screen size, like on a mobile device. Here is a sample of my code, my original window size is 600*700 I tried a lot of things but nothing works :\
Can you help me ? Thanks in advance.
public class GameScreen implements Screen {
private World world;
private int ppxX, ppxY;
private SpriteBatch batch;
private OrthographicCamera camera;
private float cameraX, cameraY;
public GameScreen(World world) {
this.world = world;
camera = new OrthographicCamera();
}
public void show() {
batch = new SpriteBatch();
}
#Override
public void render(float delta) {
world.update(delta);
updateCamera();
ppxX = Gdx.graphics.getWidth() / 600;
ppxY = Gdx.graphics.getHeight() / 700;
Gdx.gl.glClearColor(0f, 0f, 0f, 1);
Gdx.gl.glClear(GL20.GL_COLOR_BUFFER_BIT);
batch.setProjectionMatrix(camera.combined);
batch.begin();
batch.draw(world.getTexture(), 0, 0, ppxX, ppxY);
for (GameElement e : world.getListElements()) {
e.update(delta);
batch.draw(e.getTexture(), e.getPositionX()*ppxX, e.getPositionY()*ppxY, e.getWidth()*ppxX , e.getHeight()*ppxY );
}
batch.end();
}
You are on the right track, but there is couple of things you have to change.
Use ViewPorts
this.camera = new OrthographicCamera();
this.viewport = new FitViewport(WORLD_SIZE_X, WORLD_SIZE_Y, this.camera);
this.batch = new SpriteBatch();
this.batch.setProjectionMatrix(this.camera.combined);
Resize correctly.
#Override
public void resize(int width, int height) {
this.viewport.update(width, height);
}
Update the camera and render using World Units. Do not make the mistake of thinking in Screen Pixels.
public void render(float delta) {
this.camera.update();
this.batch.setProjectionMatrix(this.camera.combined);
this.batch.begin();
// draw using WORLD_SIZE
this.batch.end();
}