Skip to content
noooway edited this page Jun 5, 2017 · 18 revisions

In this part, new fonts are added into the game.

LÖVE's single embedded font is good for prototyping, but may not fit nicely with other art. This can be fixed by using custom fonts. There are two ways to specify them: by a font *.ttx file, or by an image.

A good place to start looking for fonts is Google fonts. Apart from that, a decent collection of videogames-oriented fonts can be found on OpenGameArt. Be sure to check license agreement for the font of your choice. In the current case, I've thought that Bungee Inline is a good fit. After downloading an archive with the *.ttx file, I've placed it into the fonts/Bungee_Inline folder.

There are several places where the new font should be used: lives and score displays, "game paused" and "game finished" screens. Let's start from score_display.

To use a font, first it is necessary to load it. After that, in the drawing function it is necessary to save the old font, set the new one, print something, and restore the old font.

local score_display = {}
.....
local separation = 35                              --(*1)

local bungee_font = love.graphics.newFont(
   "/fonts/Bungee_Inline/BungeeInline-Regular.ttf", 30 )

function score_display.draw()
   local oldfont = love.graphics.getFont()
   love.graphics.setFont( bungee_font )
   local r, g, b, a = love.graphics.getColor()
   love.graphics.setColor( 255, 255, 255, 230 )
   love.graphics.printf( "Score:",                 --(*2)
                         position.x,
                         position.y,
                         width,
                         "center" )
   love.graphics.printf( score_display.score,
                         position.x,
                         position.y + separation,
                         width,
                         "center" )
   love.graphics.setFont( oldfont )
   love.graphics.setColor( r, g, b, a )
end

(*1): Score is displayed in two lines. Vertical separation between them is specified by separation variable.
(*2): I use love.graphics.printf instead of love.graphics.print to position the text.

For lives_display changes are similar.

local bungee_font = love.graphics.newFont(
   "/fonts/Bungee_Inline/BungeeInline-Regular.ttf", 30 )

function lives_display.draw()
   local oldfont = love.graphics.getFont()
   love.graphics.setFont( bungee_font )
   local r, g, b, a = love.graphics.getColor( )
   love.graphics.setColor( 255, 255, 255, 230 )
   love.graphics.printf( "Lives: " .. tostring( lives_display.lives ),
                         position.x,
                         position.y,
                         width,
                         "center" )
   love.graphics.setFont( oldfont )
   love.graphics.setColor( r, g, b, a )
end

In the "game paused" screen, the text is centered. Besides, cast_shadow function is added which provides darkening effect by drawing half-transparent black rectangle on top of the game objects.

bungee_font = love.graphics.newFont(
   "/fonts/Bungee_Inline/BungeeInline-Regular.ttf", 40 )

function gamepaused.draw()
   for _, obj in pairs( game_objects ) do
      if type(obj) == "table" and obj.draw then
         obj.draw()
      end
   end
   gamepaused.cast_shadow()

   local oldfont = love.graphics.getFont()
   love.graphics.setFont( bungee_font )
   love.graphics.printf( "Game Paused...",
                         108, 110, 400, "center" )
   love.graphics.setFont( oldfont )
end

function gamepaused.cast_shadow()
   local r, g, b, a = love.graphics.getColor( )
   love.graphics.setColor( 10, 10, 10, 100 )
   love.graphics.rectangle("fill",
                           0,
                           0,
                           love.graphics.getWidth(),
                           love.graphics.getHeight() )
   love.graphics.setColor( r, g, b, a )
end

Finally, "gamefinished" screen is also updated.

bungee_font = love.graphics.newFont(
   "/fonts/Bungee_Inline/BungeeInline-Regular.ttf", 30 )

function gamefinished.draw()
   local oldfont = love.graphics.getFont()
   love.graphics.setFont( bungee_font )
   love.graphics.printf( "Congratulations!",
                         235, 200, 350, "center" )
   love.graphics.printf( "You have finished the game!",
                         100, 240, 600, "center" )
   love.graphics.setFont( oldfont )
end

    Home
    Acknowledgements
    Todo

Chapter 1: Prototype

  1. The Ball, The Brick, The Platform
  2. Game Objects as Lua Tables
  3. Bricks and Walls
  4. Detecting Collisions
  5. Resolving Collisions
  6. Levels

    Appendix A: Storing Levels as Strings
    Appendix B: Optimized Collision Detection (draft)

Chapter 2: General Code Structure

  1. Splitting Code into Several Files
  2. Loading Levels from Files
  3. Straightforward Gamestates
  4. Advanced Gamestates
  5. Basic Tiles
  6. Different Brick Types
  7. Basic Sound
  8. Game Over

    Appendix C: Stricter Modules (draft)
    Appendix D-1: Intro to Classes (draft)
    Appendix D-2: Chapter 2 Using Classes.

Chapter 3 (deprecated): Details

  1. Improved Ball Rebounds
  2. Ball Launch From Platform (Two Objects Moving Together)
  3. Mouse Controls
  4. Spawning Bonuses
  5. Bonus Effects
  6. Glue Bonus
  7. Add New Ball Bonus
  8. Life and Next Level Bonuses
  9. Random Bonuses
  10. Menu Buttons
  11. Wall Tiles
  12. Side Panel
  13. Score
  14. Fonts
  15. More Sounds
  16. Final Screen
  17. Packaging

    Appendix D: GUI Layouts
    Appendix E: Love-release and Love.js

Beyond Programming:

  1. Game Design
  2. Minimal Marketing (draft)
  3. Finding a Team (draft)

Archive

Clone this wiki locally