Games [XUI2D] Flappy Bird Example

[Erel]

Example of a "flappy bird" game. The images and sounds are based on Clumsy Bird open source project: https://github.com/ellisonleao/clumsy-bird (GPL license)

Interesting points:

- The moving ground required some work to correctly adjust its position. It moves a bit backwards and then jump forward.
- The pipes are all drawn from the same two images, one for the top pipes and one for the bottom pipes. The default behavior of the built-in graphic cache is to draw the full image. A delegate class was added and it creates the drawing task with the specific part.
- I've added another ImageView named ivMessages. It is used for the "get ready" and "game over" messages.
- The bird is rotated based on its velocity vector direction:

bw.Body.SetTransform(bw.Body.Position, ATan2(bw.Body.LinearVelocity.y, bw.Body.LinearVelocity.X))

Example projects included in the examples pack: https://www.b4x.com/android/forum/threads/xui2d-example-pack.96454/

 

[ivan.tellez]

@Erel, CompressedBC Is from a New BitmapCreator? Last version in Updates to internal libraries for B4A is 3.50?

Edit: Found ver 4.0 in the XUI2D thread

 

[ivan.tellez]

Really FUN to play with the code. A little frustraiting the collition in the game

It feel betther with a circle Fixture instead of a rectangle in the Create_Bird sub:

    'Dim rect As B2PolygonShape
    'rect.Initialize
    Dim size As B2Vec2 = X2.GraphicCache.GetGraphicSizeMeters(wrapper.GraphicName, 0)
    'rect.SetAsBox(size.X / 2, size.Y / 2)
    'wrapper.Body.CreateFixture2(rect, 0.2)
  
    Dim bShape As B2CircleShape
    bShape.Initialize(size.Y / 2)
  
    Dim fix As B2FixtureDef
    fix.Shape = bShape
    fix.Density = 0.2
  
    wrapper.Body.CreateFixture(fix)

 

[Erel]

I've uploaded a new version. The GameOver sub is a resumable sub with several steps and sleep periods. This update fixes a bug that happened when the game was paused and resumed during these steps.

 

[Erel]

Another bug: by default bodies are deleted once they are not visible. This can be disabled by setting BodyWrapper.DestroyIfInvisible to False.

However if we use a custom delegate class for the body then we need to take care of it ourselves. The Pipe class is missing this code from the Tick:

    If bw.IsVisible = False Then
       bw.Delete(GS)
       Return
   End If

 

[Erel]

Examples were updated based on XUI2D v0.92.

The bird shape is now a circle. It is closer to the bird graphic.

 

[Erel]

Projects were updated with the latest version of X2 framework.

 

[Peter Simpson]

Nice, runs smoothly @Erel.

So when are you going to release games under Anywhere Games

 

[LucaMs]

So when are you going to release games under Anywhere Games

Never. Selling development tools is more profitable

 

[salvadoro]

How can we make background effect like parallax in this example.

 

[Erel]

I will update this example next week and add parallax effect.

 

[salvadoro]

I will update this example next week and add parallax effect.

Perfect, thanks

 

[Erel]

Done:

 

[salvadoro]

Oops. The FTP client waited for me to confirm overwriting the file. Should be online now.

Thanks for your help Erel, now is my turn to understand how this work to create my first game in B4i.

 

[Erel]

The parallax implementation is in the Background class. Also worth reading this tutorial:
https://www.b4x.com/android/forum/threads/xui2d-bitmapcreator-vs-compressedbc.98217/