How to properly use setposition in libgdx? - libgdx

This is the java file created by gdx-setup-ui.jar of v0.9.7
sprite.setPosition(-sprite.getWidth()/2, -sprite.getHeight()/2);
Why we need to set position to negative value in order to center the picture?
Where is the reference base point of the libgdx picture? (left-bottom corner?)
I was told that the origin of libgdx is left-bottom corner. Given the above values, part of the picture should have been outside the screen....It turns out not! I am very confused.
Thanks in advance
Complete listing:
package com.packtpub.libgdx.basic;
import com.badlogic.gdx.ApplicationListener;
import com.badlogic.gdx.Gdx;
import com.badlogic.gdx.graphics.GL10;
import com.badlogic.gdx.graphics.OrthographicCamera;
import com.badlogic.gdx.graphics.Texture;
import com.badlogic.gdx.graphics.Texture.TextureFilter;
import com.badlogic.gdx.graphics.g2d.Sprite;
import com.badlogic.gdx.graphics.g2d.SpriteBatch;
import com.badlogic.gdx.graphics.g2d.TextureRegion;
public class Basic implements ApplicationListener {
private OrthographicCamera camera;
private SpriteBatch batch;
private Texture texture;
private Sprite sprite;
#Override
public void create() {
float w = Gdx.graphics.getWidth();
float h = Gdx.graphics.getHeight();
camera = new OrthographicCamera(1, h/w);
batch = new SpriteBatch();
texture = new Texture(Gdx.files.internal("data/libgdx.png"));
texture.setFilter(TextureFilter.Linear, TextureFilter.Linear);
TextureRegion region = new TextureRegion(texture, 0, 0, 512, 275);
sprite = new Sprite(region);
sprite.setSize(0.9f, 0.9f * sprite.getHeight() / sprite.getWidth());
sprite.setOrigin(sprite.getWidth()/2, sprite.getHeight()/2);
sprite.setPosition(-sprite.getWidth()/2, -sprite.getHeight()/2);
}
#Override
public void dispose() {
batch.dispose();
texture.dispose();
}
#Override
public void render() {
Gdx.gl.glClearColor(1, 1, 1, 1);
Gdx.gl.glClear(GL10.GL_COLOR_BUFFER_BIT);
batch.setProjectionMatrix(camera.combined);
batch.begin();
sprite.draw(batch);
batch.end();
}
#Override
public void resize(int width, int height) {
}
#Override
public void pause() {
}
#Override
public void resume() {
}
}

It's because the default center point for the orthographic camera is (0,0,0), so if you just draw your image at (0,0) its bottom left cornet will be in the center of the screen.
You can change this center point by using cam.position.set(w / 2, h / 2, 0) method
See here for more detailed example of OrthographiCamera use: https://github.com/libgdx/libgdx/wiki/Orthographic-camera

Related

How to move an object similar to sinusoidal wave movement?-LibGdx

I want to move my object vertically in zig-zag motion,similar to sisnusoidal motion;
I am moving my object like this:
public void moveLeavesDown(float delta) {
setY(getY() - (getSpeed()* delta));
}
How can I get this kind of movement?
You can add a timer and use the math.sin function to add an offset to your leaves.
This demo below shows how it can be done:
import com.badlogic.gdx.ApplicationAdapter;
import com.badlogic.gdx.Gdx;
import com.badlogic.gdx.graphics.GL20;
import com.badlogic.gdx.graphics.g2d.SpriteBatch;
import com.badlogic.gdx.graphics.g2d.TextureRegion;
import com.badlogic.gdx.math.Vector2;
public class Test extends ApplicationAdapter{
float time =0; // timer to store current elapsed time
Vector2 leaf = new Vector2(150,150); // holds the leaf x,y pos
float sinOffset = 0; // the offset for adding to the image
private SpriteBatch sb; // spritebatch for rendering
TextureRegion tx; // a texture region(the leaf)
#Override
public void create() {
sb = new SpriteBatch(); // make spritebatch
tx = DFUtils.makeTextureRegion(10, 10, "FFFFFF"); // makes a textureRegion of 10x10 of pure white
}
#Override
public void render() {
// clear screen
Gdx.gl.glClearColor(0f, 0f, 0f, 0f);
Gdx.gl.glClear(GL20.GL_COLOR_BUFFER_BIT);
leaf.y = leaf.y-0.2f; // move downwards
time+= Gdx.graphics.getDeltaTime(); // update sin timer
sinOffset =(float)Math.sin(time)*10; // calculate offset
// draw leaf with offset
sb.begin();
sb.draw(tx, leaf.x+sinOffset, leaf.y);
sb.end();
}
}

LibGdx - Adding array of actors to a table, with delay

I want to have several comets falling in the background of my UI,I have a working comet Actor that does what it is supposed to, but I am not sure how to create a continuous spawn with these comets (with a random delay between each) in a table, without scene2d/actors it would look something like:
cometTimer += delta
if(cometTimer >= interval){
addCometToArray();
cometTimer = 0;
}
With the cometArray being looped over and drawn every frame, and then removing the entity when it goes out of bounds.
The only way I know how to add Actors to a table is like this:
table().add(new DialogComet());
How would I go about adding this type of behaviour using Scene2d?
Not sure if this is what you were looking for, but the below is a small working app that shows comets "falling" from the top to bottom, using Tables and having the tables manage the comets (no separate array/data structure). I created a small Comet class that extends Actor as well, to allow for movement and placement.
"main" class:
import java.util.Iterator;
import com.badlogic.gdx.ApplicationListener;
import com.badlogic.gdx.Gdx;
import com.badlogic.gdx.graphics.GL20;
import com.badlogic.gdx.graphics.OrthographicCamera;
import com.badlogic.gdx.graphics.g2d.Batch;
import com.badlogic.gdx.graphics.g2d.BitmapFont;
import com.badlogic.gdx.graphics.g2d.SpriteBatch;
import com.badlogic.gdx.graphics.glutils.ShapeRenderer;
import com.badlogic.gdx.graphics.glutils.ShapeRenderer.ShapeType;
import com.badlogic.gdx.scenes.scene2d.Actor;
import com.badlogic.gdx.scenes.scene2d.Stage;
import com.badlogic.gdx.scenes.scene2d.ui.Table;
public class StageComet implements ApplicationListener {
private static final float INTERVAL = 0.3f;
private Batch batch;
private ShapeRenderer shapeRenderer;
private OrthographicCamera camera;
private BitmapFont font;
private Table rootTable;
private Table cometTable;
private Stage stage;
private Iterator<Actor> iter;
private Comet comet;
private float cometTimer = 0;
private float delta = 0;
#Override
public void create() {
camera = new OrthographicCamera();
camera.setToOrtho(false, 960, 640);
shapeRenderer = new ShapeRenderer();
batch = new SpriteBatch();
font = new BitmapFont();
stage = new Stage();
/*
* The root table could contain main "play" actors. It is empty in this example.
*/
rootTable = new Table();
rootTable.setFillParent(true);
/*
* Usually in Scene2d I think the practice is only to have 1 root table that takes up the entire screen (above),
* but for simplicity/illustrative purposes, I created a cometTable only, set it to Fill Parent as well, and the
* getChildren() of the table will have our array of comets in play at any given time.
*/
cometTable = new Table();
cometTable.setFillParent(true);
stage.addActor(rootTable);
stage.addActor(cometTable);
}
#Override
public void render() {
Gdx.gl.glClearColor(0, 0, 0.2f, 1);
Gdx.gl.glClear(GL20.GL_COLOR_BUFFER_BIT);
camera.update();
batch.setProjectionMatrix(camera.combined);
delta = Gdx.app.getGraphics().getDeltaTime();
stage.act(delta); // make sure the comets "fall"
shapeRenderer.begin(ShapeType.Filled); // simple rendering of comets, they are just a circle ...
iter = cometTable.getChildren().iterator(); // Table subclasses Group, which has a snapshot array of its Actors
while ( iter.hasNext() ) {
comet = (Comet)iter.next();
shapeRenderer.circle(comet.getX(), comet.getY(), 20.0f); // Draw the comet
if ( comet.getY() < -100 ) { // Hack/hardcode, if the comet fell far enough "off stage" ...
iter.remove(); // ... remove it from the stage
}
}
shapeRenderer.end();
/*
* Sample code from original question on how to create a comet without scene2d ...
*/
cometTimer += delta;
if ( cometTimer > INTERVAL ) {
cometTable.add(new Comet()); // ... but in this case, we use scene2d
cometTimer = 0;
}
/*
* To keep track, display a simple message of # of comets on stage at any given time.
*/
batch.begin();
font.draw(batch, "Comets on stage: " + cometTable.getChildren().size, 100, 100);
batch.end();
}
/*
* I may have missed disposing something, but you get the idea ...
*/
#Override
public void dispose() {
shapeRenderer.dispose();
batch.dispose();
stage.dispose();
font.dispose();
}
#Override
public void resize(int width, int height) { }
#Override
public void pause() { }
#Override
public void resume() { }
}
And the small Comet class:
import com.badlogic.gdx.Gdx;
import com.badlogic.gdx.scenes.scene2d.Actor;
public class Comet extends Actor{
/*
* Spawn a comet at the top of the screen, in the middle
*/
public Comet() {
super();
this.setY(Gdx.app.getGraphics().getHeight());
this.setX(Gdx.app.getGraphics().getWidth()/2.0f);
}
/*
* Let the comet fall (same speed) to the bottom of the screen ...
*/
#Override
public void act (float delta) {
this.setY(this.getY() - 10);
super.act(delta);
}
}

How to use Bitmap font as scene 2d actor?

I am developing a game using libgdx framework. How can i achieve scene2d action on bitmap font object ? so that i can write some text like score,message and run action like scene2d actor.
Take a look at the Label class, particularly the constructor that takes a CharSequence and a LabelStyle. When you initialize your LabelStyle you can supply a BitmapFont.
Please note, if you'd like to scale or rotate the label you'll need to wrap it in a Container or add it to Table with setTransform() enabled. (This flushes the SpriteBatch so use it wisely.)
you can extend actor class to achieve the same.
like:-
import com.badlogic.gdx.graphics.Color;
import com.badlogic.gdx.graphics.g2d.Batch;
import com.badlogic.gdx.graphics.g2d.BitmapFontCache;
import com.badlogic.gdx.graphics.g2d.GlyphLayout;
import com.badlogic.gdx.math.Matrix4;
import com.badlogic.gdx.scenes.scene2d.Actor;
public class FontActor extends Actor
{
private Matrix4 matrix = new Matrix4();
private BitmapFontCache bitmapFontCache;
private GlyphLayout glplayout;
public FontActor(float posX, float posY, String fontText)
{
BitmapFont fnt=new BitmapFont(Gdx.files.internal("time_newexport.fnt"),
Gdx.files.internal("time_ne-export.png"),false);
bitmapFontCache = new BitmapFontCache(fnt);
glplayout=bitmapFontCache.setText(fontText, 0, 0);
setPosition(posX, posY);
setOrigin(glplayout.width / 2, -glplayout.height/2);
}
#Override
public void draw(Batch batch, float alpha)
{
Color color = getColor();
bitmapFontCache.setColor(color.r, color.g, color.b, color.a*alpha);
matrix.idt();
matrix.translate(getX(), getY(), 0);
matrix.rotate(0, 0, 1, getRotation());
matrix.scale(getScaleX(), getScaleY(), 1);
matrix.translate(-getOriginX(), -getOriginY(), 0);
batch.setTransformMatrix(matrix);
bitmapFontCache.draw(batch);
}
public void setAlpha(int a)
{
Color color = getColor();
setColor(color.r, color.g, color.b, a);
}
public void setText(String newFontText)
{
glplayout = bitmapFontCache.setText(newFontText, 0, 0);
setOrigin(glplayout.width / 2, -glplayout.height/2);
}
}
and you can use it like.
Actor actor=new FontActor(20,30,"test");
stage.addActor(actor);
actor.addAction(Actions.moveTo(10,10,1));

LibGDX Stage and Actor, Events and Actor properties

I'm just starting android game development with LibGdx framework.
I read many online tutorial so far and the more I read the more I got confused: ApplicationListener, ApplicationAdapter, Stages, Game, Screens, Actors, Sprites, Images... not mentioning Input and Gesture listeners of all king).
I finally understood what kind of "model" I should use for the game I have in mind (a kind of puzzle game): Game, Screens, Stage and Actor.
So here is my first code.
This is the main application (Game):
package com.my.game1;
import com.badlogic.gdx.Game;
public class MyGame extends Game {
#Override
public void create () {
setScreen(new StarterScreen());
}
}
This is the main screen class:
package com.my.game1;
import com.badlogic.gdx.Gdx;
import com.badlogic.gdx.Screen;
import com.badlogic.gdx.graphics.GL20;
import com.badlogic.gdx.scenes.scene2d.Stage;
public class StarterScreen implements Screen {
private Stage stage;
private float screenW, screenH;
private Tess tessera;
#Override
public void show() {
tessera = new Tess("image.png");
stage = new Stage();
screenW = stage.getViewport().getWorldWidth();
screenH = stage.getViewport().getWorldHeight();
Gdx.input.setInputProcessor(stage);
stage.addActor(tessera);
}
#Override
public void render(float delta) {
Gdx.gl.glClearColor(0,0,0,1);
Gdx.gl.glClear(GL20.GL_COLOR_BUFFER_BIT);
stage.act();
stage.draw();
}
#Override
public void resize(int width, int height) {
// TODO Auto-generated method stub
}
#Override
public void pause() {
// TODO Auto-generated method stub
}
#Override
public void resume() {
// TODO Auto-generated method stub
}
#Override
public void hide() {
dispose();
}
#Override
public void dispose() {
stage.dispose();
}
}
And the following is the class that extends Actor:
package com.my.game1;
import com.badlogic.gdx.Gdx;
import com.badlogic.gdx.graphics.Texture;
import com.badlogic.gdx.graphics.g2d.Batch;
import com.badlogic.gdx.scenes.scene2d.Actor;
import com.badlogic.gdx.scenes.scene2d.InputEvent;
import com.badlogic.gdx.scenes.scene2d.utils.ActorGestureListener;
public class Tess extends Actor {
private Texture texture;
private boolean selected = false;
public Tess (String img) {
this.texture = new Texture(Gdx.files.internal(img));
this.setBounds(0f, 0f, this.texture.getWidth(), this.texture.getHeight());
this.setOrigin(this.texture.getWidth() / 2, this.texture.getHeight() / 2);
this.setScale(0.25f);
this.addListener(new ActorGestureListener() {
public void tap(InputEvent event, float x, float y, int pointer, int button) {
((Tess)event.getTarget()).toggleSelect();
((Tess)event.getTarget()).setColor(0.5f, 0f, 0.5f, 1f);
}
});
}
#Override
public void draw(Batch batch, float alpha){
batch.draw(texture, 0, 0);
}
public void finalize() {
this.texture.dispose();
}
public void toggleSelect(){
this.selected = !this.selected;
if (this.selected == true)
this.setColor(0.5f, 0f, 0.5f, 1f);
else
this.setColor(0f, 0f, 0f, 0f);
}
}
The screen shows correctly the actor, but I cannot set the Actor's position or its scale, nor the "tap" event seems to get detected; and the color doesn't change.
What I did wrong?
Several things were wrong. First, just on the side, you don't want to call dispose() from the Screen's hide() method. hide() can be called simply when the screen is turned off, or when the app is switched to the background, and disposing of the Screen during that would cause serious issues on resume.
With that out of the way, here's what your Actor should have looked like:
package com.my.game1;
import com.badlogic.gdx.Gdx;
import com.badlogic.gdx.graphics.Texture;
import com.badlogic.gdx.graphics.g2d.Batch;
import com.badlogic.gdx.graphics.g2d.Sprite;
import com.badlogic.gdx.scenes.scene2d.Actor;
import com.badlogic.gdx.scenes.scene2d.InputEvent;
import com.badlogic.gdx.scenes.scene2d.InputListener;
import com.badlogic.gdx.scenes.scene2d.Touchable;
public class Tess extends Actor {
private Sprite sprite;
private boolean selected = false;
public Tess (String img) {
this.sprite = new Sprite(new Texture(Gdx.files.internal(img)));
this.setTouchable(Touchable.enabled);
this.setBounds(this.sprite.getX(), this.sprite.getY(), this.sprite.getWidth(), this.sprite.getHeight());
this.setOrigin(this.sprite.getWidth() / 2, this.sprite.getHeight() / 2);
this.setScale(0.25f);
this.addListener(new ActorGestureListener() {
#Override
public void tap (InputEvent event, float x, float y, int pointer, int button) {
((Tess)event.getTarget()).toggleSelect();
}
});
}
#Override
public void draw(Batch batch, float alpha){
sprite.draw(batch);
}
#Override
public void positionChanged(){
sprite.setPosition(getX(), getY());
}
public void toggleSelect(){
this.selected = !this.selected;
if (this.selected == true)
sprite.setColor(0.5f, 0f, 0.5f, 1f);
else
sprite.setColor(0f, 0f, 0f, 0f);
}
}
First thing changed: you should use a Sprite, not a Texture, to handle color, drawing and transformations easily. Texture is possible, but is not as straightforward as Sprite is.
Next, you need to call setTouchable(Touchable.enabled) inside the actor to actually enable hit detection. Without this, no touch events are passed to the Actor.
After that, with setBounds(), you need to use sprite.getX() and sprite.getY(), to utilize the Sprite's positional values. Setting them to any arbitrary number seems to disable any touch capacity for that Actor.
Another thing, if all of that had been OK, is that you were setting the color twice for each touch, once based on the selected field, and then immediately after straight to the dark purple, so I removed the second set and just used your toggle method.
Next, since we have a Sprite now, we can use the draw() method attached to the Sprite itself and feed it the Batch, instead of calling the Batch's draw.
Finally, when you want to change the position of the image, call setPosition on the actor itself, and utilize an override of the positionChanged() method to set the Sprite's position based on the Actor's new position.

Resize drawing to match frame size

I've written an app that custom draws everything inside paint() based on fixed pixel positions. Then I disabled resize of the frame so its always visible.
However, now I would like to be able to resize it but I dont want to change my drawling code. I was hoping I could grab the 300x300 square of the Graphics g object and resize it to the JFrame current size after all of my drawling code, but I have no idea what I'm doing.
Here sample code. In this I want the 100x100 square to remain in the middle, proportionate to the resized JFrame:
package DrawAndScale;
import java.awt.Color;
import java.awt.Graphics;
public class DASFrame extends javax.swing.JFrame {
public DASFrame() {
setDefaultCloseOperation(javax.swing.WindowConstants.EXIT_ON_CLOSE);
this.setSize(300, 300);
}
public static void main(String args[]) {
java.awt.EventQueue.invokeLater(new Runnable() {
public void run() {
new DASFrame().setVisible(true);
}
});
}
#Override
public void paint(Graphics g) {
g.setColor(Color.BLACK);
g.fill3DRect(100, 100, 100, 100, true);
}
}
Thanks.
Assuming you rename your method that paints for 300x300 as paint300, define a buffered image:
#Override public void paint(Graphics g) {
Image bufferImage = createImage(300, 300); // empty image
paint300(bufferImage.getGraphics()); // fill the image
g.drawImage(bufferImage, 0, 0, null); // send the image to graphics device
}
Above is when you want to draw at full size (300x300).
If your window is resized:
#Override public void paint(Graphics g) {
Image bufferImage = createImage(300, 300);
paint300(bufferImage.getGraphics());
int width = getWidth();
int height = getHeight();
CropImageFilter crop =
new CropImageFilter((300 - width)/2, (300 - height)/2 , width, height);
FilteredImageSource fis = new FilteredImageSource(bufferImage, crop);
Image croppedImage = createImage(fis);
g.drawImage(croppedImage, 0, 0, null);
}
The new classes are from from java.awt.image.*.
I didn't test this code. It's just to send you in the right direction.
if you want to painting Custom paint then look for JLabel or JPanel and including Icon/ImageIcon inside, simple example about that
import java.awt.*;
import javax.swing.*;
public class MainComponentPaint extends JFrame {
private static final long serialVersionUID = 1L;
public MainComponentPaint() {
setTitle("Customize Preffered Size Test");
setDefaultCloseOperation(JFrame.EXIT_ON_CLOSE);
}
public void display() {
add(new CustomComponent());
pack();
setMinimumSize(getSize());
setPreferredSize(getSize());
SwingUtilities.invokeLater(new Runnable() {
#Override
public void run() {
setVisible(true);
}
});
}
public static void main(String[] args) {
MainComponentPaint main = new MainComponentPaint();
main.display();
}
}
class CustomComponent extends JComponent {
private static final long serialVersionUID = 1L;
#Override
public Dimension getPreferredSize() {
return new Dimension(50, 50);
}
#Override
public void paintComponent(Graphics g) {
super.paintComponent(g);
int w = getWidth();
int h = getHeight();
for (int i = 0; i < Math.max(w, h); i += 20) {
g.drawLine(i, 0, i, h);
g.drawLine(0, i, w, i);
}
}
}
Not an expert, but you could just scale the Graphics2D object (the passed Graphics is in fact a Graphics2D instance), where the x and y ratios are the ratios of the fixed size you chose to draw and the actual size of the frame.
See http://download.oracle.com/javase/6/docs/api/java/awt/Graphics2D.html#scale%28double,%20double%29
You could do this with some math.
public void paint(Graphics g){
int height = 100;
int width = 100;
int x = (this.getWidth() / 2) - (width / 2);
int y = (this.getHeight() / 2) - (height / 2);
g.setColor(Color.BLACK);
g.fill3DRect(x, y, width, height, true);
}
Or if you wanted to keep the width and height of the box with the same proportion, use int width = this.getWidth() / 3; and int height = this.getHeight() / 3.
The other option is to use Graphics2D.scale(), as JB pointed out, the passed Graphics object is actually a Graphics2D object.