Jump to content

  • Log In with Google      Sign In   
  • Create Account

How does the Physics of Flappy Bird works?

Old topic!

Guest, the last post of this topic is over 60 days old and at this point you may not reply in this topic. If you wish to continue this conversation start a new topic.

  • You cannot reply to this topic
3 replies to this topic

#1   Members   -  Reputation: 102


Posted 21 January 2014 - 12:18 PM

This is the game: https://itunes.apple.com/us/app/flappy-bird/id642099621?mt=8


And I don't really understand on how does the physics works.. In the physics term..


I know it has gravity that pull the bird down.. and then I'm not sure on what makes the bird fly when I tap?


Is that called an impulse force?


Thank you!

Edited by glaksmono, 21 January 2014 - 12:27 PM.

#2   Crossbones+   -  Reputation: 8410


Posted 21 January 2014 - 12:44 PM

From watching a Youtube video, it seems to me that there is not much physics (as in buyoant force vs gravity) involved at all.

It looks more somewhat like:

    height -= 2;
    if(tapped) height += 3;


    if(is_wall(xpos, height))

Edited by samoth, 21 January 2014 - 12:46 PM.

#3   Members   -  Reputation: 102


Posted 23 February 2014 - 06:20 PM

I just made a tutorial of flappy bird and box2d its very simple but its in spanish, but if you look at the code maybe you will understand 

here is it

#4   Members   -  Reputation: 491


Posted 24 February 2014 - 10:58 AM

I made a flappy bird clone called "Buzzy Bee" in CoffeeScript and HTML5 (because my teacher started making one and I wanted to make a better one :P). The source is on Github: https://github.com/dr01d3k4/BuzzyBee and you can play it on jsfiddle: http://jsfiddle.net/dr01d3k4/BGAD7/


The physics are pretty simple. It doesn't use Box2D because the vertical motion is handled by simple integration and collision is just AABB with no resolution (because instant game over, though may get a bit harder if you want to add a dieing animation). All the code for the game logic is in game_screen.coffee. Here are the important parts (commented to explain)

# In the constructor, declare a player object (@ means self/this)
# The velocity and acceleration are both vertical, horizontal movement is handled differently
@player =
	velocity: 0
	acceleration: GRAVITY
	rotation: 0

# Create the pipes (fixed amount that get recycled) and keep track of where the first one is
# The player doesn't actually move horizontally - the pipes do
@firstPipeX = START_PIPE_X
@pipes = [ ]
for i in [0...PIPE_COUNT]
	@pipes.push @newPipe()

# The methods for creating new pipes (as a JavaScript object)

newPipe: -> baseHeight: @randomPipeHeight(), gapHeight: PIPE_GAP_HEIGHT, width: PIPE_WIDTH, scored: no

# When the player jumps, set his velocity to jump velocity and add some rotation for graphical effect
playerJump: ->
	@player.velocity = JUMP_VELOCITY
	@player.rotation = PLAYER_JUMP_ROTATION

# Game logic with some parts like AI and trail taken out
update: (deltaTime) ->
	@time += deltaTime
	# This is just for graphical effect
	@player.rotation += PLAYER_ROTATION_SPEED * deltaTime

	# Jump if the player is pressing the correct keys and is actually playing
	# (In the menu screen, the game is played by the AI and uses the same code so these @playerControlled checks are common)
	@playerJump() if @playerControlled and (isKeyPressed(Key.JUMP) or isMousePressed())

	# Simple integration vertically
	@player.velocity += @player.acceleration * deltaTime
	@player.y += @player.velocity * deltaTime

	# Check if the player's gone out of bounds
	if @player.y + @player.height > SCREEN_HEIGHT
		@player.y = SCREEN_HEIGHT - @player.height
		@player.velocity = 0
		@gameOver() if @playerControlled

	if @player.y < 0
		@player.y = 0
		@player.velocity = 0
		@gameOver() if @playerControlled

	# Offset the first pipe by the speed of the player
	# Negative because player going to right, so pipes must go to the left for same effect
	@firstPipeX -= MOVE_SPEED * deltaTime

	# If the first pipe's gone off screen
	if @firstPipeX < -PIPE_WIDTH * 2
		# Remove the first pipe by moving each down
		for i in [1...@pipes.length]
			@pipes[i - 1] = @pipes[i]

		# Add a new pipe
		# However probably would be more efficient to reuse the first that was removed
		@pipes[PIPE_COUNT - 1] = @newPipe()

		# Because the first pipe was removed, need to reset this back to position of new first pipe

	# Check player not rotating too much
	@player.rotation = -PLAYER_MAX_ROTATION if @player.rotation < -PLAYER_MAX_ROTATION
	@player.rotation = PLAYER_MAX_ROTATION if @player.rotation > PLAYER_MAX_ROTATION

	# Detect collision and scoring
	x = @firstPipeX
	collision = no
	for pipe in @pipes
		# Only if the left of the pipe is to the left of the player's right (i.e player's going through/gone past)
		# Ones further on get skipped
		if x < @player.x + @player.width
			# If the right of the pipe is on right of player's left
			# And the player isn't inside the gap
			# Then collided
			# Like AABB intersection but y is negated
			if x + pipe.width > @player.x and (@player.y + @player.height > SCREEN_HEIGHT - pipe.baseHeight or @player.y < SCREEN_HEIGHT - pipe.baseHeight - pipe.gapHeight)
				collision = yes

			# If the right of the pipe is on the left of the player
			if x + pipe.width <= @player.x
				# And it hasn't already been used for scoring
				# Then the player has gone through this pipe and so gains a point
				@score += 1 unless pipe.scored
				pipe.scored = yes

		# Update the pipe's left position to the one of the next pipe
		x += pipe.width + PIPE_GAP_HORIZONTAL

	# Player hit a pipe and so game over
	return @gameOver() if collision and @playerControlled

Falling block colour flood game thing I'm making: http://jsfiddle/dr01d3k4/JHnCV/

Old topic!

Guest, the last post of this topic is over 60 days old and at this point you may not reply in this topic. If you wish to continue this conversation start a new topic.