-
Notifications
You must be signed in to change notification settings - Fork 17
Fonts
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
Feedback is crucial to improve the tutorial!
Let me know if you have any questions, critique, suggestions or just any other ideas.
Chapter 1: Prototype
- The Ball, The Brick, The Platform
- Game Objects as Lua Tables
- Bricks and Walls
- Detecting Collisions
- Resolving Collisions
- Levels
Appendix A: Storing Levels as Strings
Appendix B: Optimized Collision Detection (draft)
Chapter 2: General Code Structure
- Splitting Code into Several Files
- Loading Levels from Files
- Straightforward Gamestates
- Advanced Gamestates
- Basic Tiles
- Different Brick Types
- Basic Sound
- 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
- Improved Ball Rebounds
- Ball Launch From Platform (Two Objects Moving Together)
- Mouse Controls
- Spawning Bonuses
- Bonus Effects
- Glue Bonus
- Add New Ball Bonus
- Life and Next Level Bonuses
- Random Bonuses
- Menu Buttons
- Wall Tiles
- Side Panel
- Score
- Fonts
- More Sounds
- Final Screen
- Packaging
Appendix D: GUI Layouts
Appendix E: Love-release and Love.js
Beyond Programming: