Tutorial 1.5: Move bitch, get outta my way - Simple sprite movement

[DP News-Robot]

When looking at the program as it is now, the orb-sprite appears bottom-left, and is fairly small compared to the screen. Why that particular size by the way? Because it is 100 pixels wide, and the (emulator phone) display is 1920 pixels wide, and 1080 pixels tall. Or something. So, it takes about 5% of the screen.


But what is a man gotta do, to make that sprite be elsewhere, say in the center of the screen? Well, let’s draw it on a different {X,Y} position then. Take notice of how X and Y are calculated:
public void render () {
Gdx.gl.glClearColor(0.05f, 0.21f, 0.2f, 1.0f);
Gdx.gl.glClear(GL20.GL_COLOR_BUFFER_BIT);

// Calculate center pixel position
int screenW = Gdx.graphics.getWidth();
int screenH = Gdx.graphics.getHeight();
int x = screenW / 2 - 50; // -50 from center (sprite is 100 pixels wide)
int y = screenH / 2 - 50;
spr.setPosition( x, y );

// Draw
batch.begin();
spr.draw( batch );
batch.end();
} // render




And how to make it MOVE (over time) or “slide” then? Simple, keep track of either X or Y, and increase (or decrease to move in the opposite direction) a little bit every time it renders. For example:
float offset = 0.f;

@Override
public void render () {
Gdx.gl.glClearColor(0.05f, 0.21f, 0.2f, 1.0f);
Gdx.gl.glClear(GL20.GL_COLOR_BUFFER_BIT);

// Move
offset += 0.2f;
int screenW = Gdx.graphics.getWidth();
int screenH = Gdx.graphics.getHeight();
int x = screenW / 2 - 50 + (int)(offset);
int y = screenH / 2 - 50;
spr.setPosition( x, y );

// Draw
batch.begin();
spr.draw( batch );
batch.end();
} // render
In case you’re sprite is dropping down instead of moving to the right, bare in mind that screen can be rotated 90 degrees. But anyway, now it moves with 0.2, uh, “things per cycle”… Whatever that is. But hey! It moves!



If we aren’t happy with the size, we can arrange something there as well. Why not try this SINE function, which makes the sprite grow and shrink continuously over time? The function below will size the sprite between 150 and 250 pixels (outcome of sin being a number between -1 and +1).

float offset = 0.f;
float sizer = 0.f;

@Override
public void render () {
Gdx.gl.glClearColor(0.05f, 0.21f, 0.2f, 1.0f);
Gdx.gl.glClear(GL20.GL_COLOR_BUFFER_BIT);

// Move
offset += 0.2f;
int screenW = Gdx.graphics.getWidth();
int screenH = Gdx.graphics.getHeight();
int x = screenW / 2 - 50 + (int)(offset);
int y = screenH / 2 - 50;
spr.setPosition( x, y );

// Resize
sizer += 0.1f;
spr.setSize( sin(sizer) * 50 + 200, sin(sizer) * 50 + 200 );

// Draw
batch.begin();
spr.draw( batch );
batch.end();
} // render

That was short and very basic, but hey, got to start somewhere right? Next post we’ll be refining these movement and size units. Because now it moves with 0.2 and grows with 0.1…? Whether you are a Metric or Imperial guy, those units don’t make a whole lot of sense to me.



Weiterlesen...