How to draw the Flappy Bird Ground?

Question

I´m very frustrated because I can´t draw the Ground like in Flappy Bird... I try to use this method:

private void drawGround(){  
    for(Rectangle mRectangleGroundHelper : mArrayGround){
        if(spawnGround & mRectangleGroundHelper.x<0){ // spawn Ground if the actual ground.x + ground.width() is smaller then the display width.
            mArrayGround.add(mRectangleGroundHelper);
            spawnGround = false;
        }
    }
    for(Rectangle mRectangleGroundHelper : mArrayGround){
        if(mRectangleGroundHelper.x < -mTextureGround.getWidth()){ // set boolean to true, if the actual ground.x completely hide from display, so a new ground can be spawn
            spawnGround = true;
        }
    }

    for(Rectangle mRectangleGroundHelper : mArrayGround){ // move the ground in negative x position and draw him...
        mRectangleGroundHelper.x-=2;
        mStage.getSpriteBatch().draw(mTextureGround, mRectangleGroundHelper.x, mRectangleGroundHelper.y);
    }
}

The once result is, that when the ground.x hits the left side from the display, the ground moves faster in negative x. So what is the error in my method?

usually, you'd use an engine such as androidengine or libgdx to do stuff such as flappy bird. — njzk2, Feb 28 '14 at 22:45

score 1 · Accepted Answer · answered Feb 28 '14 at 23:11

1

mRectangleGroundHelper.x-=2;

This is a scary piece of code. In general you probably shouldn't be moving your ground at all, because that basically requires moving the whole world.

Instead, create a "Viewport" position, which is really just an X variable. As the game moves forward, you move your viewport forward (really just X++), and draw all your objects relative to that.

Then you don't need to "spawn" any ground at all. You either just draw it or you don't.

Here's a rough example based on a lot of assumptions about your data...

private void drawGround(){
    viewport.x += 2;
    for(Rectangle r : mArrayGround) {
        if(r.x + r.width > viewport.x && r.x < viewport.x + viewport.width) {
            mStage.getSpriteBatch().draw(mTextureGround, viewport.x - r.x, r.y);
        }
    }
}

answered Feb 28 '14 at 23:11

Ted Bigham

4,237
1
26
31

Okay, only for me, the Viewport is a rectangle, which the user can see? So I don´t move the viewport, but the camera? The once problem is, i must create the objects at the game start? I develop with LibGDX – Fabian König Mar 01 '14 at 00:16
In this case camera and viewport would be the same thing. So if your moving the camera, you wouldn't need to move the ground (or anything else that would move in the real world). If you don't have a lot of object, then yes, create them at start up. If you have lots of objects, then group your data into "Zones" and load a whole zone at a time. You'll have to figure out the best zone size that allows your program to load without lagging (i'm guessing something like zone1[x=0 to 10000], zone2[x=10001 to 20000] etc. Using a separate thread would be best. – Ted Bigham Mar 01 '14 at 00:46
A big big praise to you. Awesome this answer! – Fabian König Mar 01 '14 at 08:59
I have a last question to you, the right way to move the camera is mStage.getCamera.translate(1, 0, 0); right? Because now the ground moves from right to left, but the background is moving from right to left too... ? – Fabian König Mar 01 '14 at 09:38
Yes. That's proper way to move the camera. If your background isn't supposed to move, then you would either have to set it's x on each draw, or hard code it to draw at 0. You could potentially make it part of the skybox (if your library supports one). If you're using a 3d library you could also make the background farther away from the camera (more z) and it would move slower. – Ted Bigham Mar 01 '14 at 10:11

How to draw the Flappy Bird Ground?

1 Answers1