In the previous part we were added some Kivy properties to the Race screen. In this part, we’ll add some to the Bets screen.
But before we delve into the topic, here’s some info for you.
*****
Book Info
I just published my Kivy book, GUI Programming with Python and Kivy. It’s pretty long (over 800 pages) and comprehensive. And, which also counts, easy to read. The book contains lots of illustrations.
This book covers all the basics that you need to know to start programming GUI applications with Python and Kivy. Throughout the book we are building a GUI application from scratch, a fully functional game using all kinds of tools that Kivy has to offer. It’s our Slugrace project, but covered in a much more in-depth manner.
Each part of the book starts with a theoretical introduction of a topic or idea that we then implement in the project. I assume you have no prior knowledge of the Kivy library, but you should have at least some basic knowledge of the Python programming language, including the object-oriented programming paradigm as this is what we will be using a lot in this book.
The book covers all the basic elements of Kivy that you have to know, like widgets, layouts, Kivy ids and properties, graphics, screens, animation, sound. Finally we’ll deploy the app to Windows. It is pretty comprehensive and after you finish it, I’m sure you’ll be able to create your own awesome GUI apps of any kind, not just games.
I hope you will have at least as much fun reading the book as I had writing it.
As far as this Kivy series is concerned, the following parts will contain the most important elements covered in the book. However, some elements will be presented in a simplified way here on my blog or omitted completely.
____________
If you are interested, you can purchase the book in four versions. Here are the links:
1) ebook – pdf version on my website – in full color
Here you can see the description of the book, sample graphics from the book and the full table of contents.
2) ebook – Kindle version on Amazon – in full color
3) paperback version on Amazon – in black and white
4) paperback version on Amazon – in full color
*****
And Now Let’s Move On…
In the Bets screen we have one thing to do. Look at this lengthy section of the kv file:
# File name: bets.kv
...
<BetsScreen>:
...
### PLAYER BETS ###
BoxLayout:
orientation: 'vertical'
# player 1
BoxLayout:
spacing: 10
RegularLabel:
text: 'Player 1'
RegularLabel:
text: 'bets'
size_hint: (.4, 1)
BoxLayout:
spacing: 5
RegularLabel:
text: '$'
halign: 'right'
BetInput:
text: '1000'
Slider:
min: 1
max: 1000
value: 1000
step: 1
RegularLabel:
text: 'on'
size_hint: (.3, 1)
BoxLayout:
PlayerSlugButton:
group: 'player1'
RegularLabel:
text: 'Speedster'
BoxLayout:
PlayerSlugButton:
group: 'player1'
RegularLabel:
text: 'Trusty'
BoxLayout:
PlayerSlugButton:
group: 'player1'
RegularLabel:
text: 'Iffy'
BoxLayout:
PlayerSlugButton:
group: 'player1'
RegularLabel:
text: 'Slowpoke'
# player 2
BoxLayout:
spacing: 10
RegularLabel:
text: 'Player 2'
RegularLabel:
text: 'bets'
size_hint: (.4, 1)
BoxLayout:
spacing: 5
RegularLabel:
text: '$'
halign: 'right'
BetInput:
text: '1000'
Slider:
min: 1
max: 1000
value: 1000
step: 1
RegularLabel:
text: 'on'
size_hint: (.3, 1)
BoxLayout:
PlayerSlugButton:
group: 'player2'
RegularLabel:
text: 'Speedster'
BoxLayout:
PlayerSlugButton:
group: 'player2'
RegularLabel:
text: 'Trusty'
BoxLayout:
PlayerSlugButton:
group: 'player2'
RegularLabel:
text: 'Iffy'
BoxLayout:
PlayerSlugButton:
group: 'player2'
RegularLabel:
text: 'Slowpoke'
# player 3
BoxLayout:
spacing: 10
RegularLabel:
text: 'Player 3'
RegularLabel:
text: 'bets'
size_hint: (.4, 1)
BoxLayout:
spacing: 5
RegularLabel:
text: '$'
halign: 'right'
BetInput:
text: '1000'
Slider:
min: 1
max: 1000
value: 1000
step: 1
RegularLabel:
text: 'on'
size_hint: (.3, 1)
BoxLayout:
PlayerSlugButton:
group: 'player3'
RegularLabel:
text: 'Speedster'
BoxLayout:
PlayerSlugButton:
group: 'player3'
RegularLabel:
text: 'Trusty'
BoxLayout:
PlayerSlugButton:
group: 'player3'
RegularLabel:
text: 'Iffy'
BoxLayout:
PlayerSlugButton:
group: 'player3'
RegularLabel:
text: 'Slowpoke'
# player 4
BoxLayout:
spacing: 10
RegularLabel:
text: 'Player 4'
RegularLabel:
text: 'bets'
size_hint: (.4, 1)
BoxLayout:
spacing: 5
RegularLabel:
text: '$'
halign: 'right'
BetInput:
text: '1000'
Slider:
min: 1
max: 1000
value: 1000
step: 1
RegularLabel:
text: 'on'
size_hint: (.3, 1)
BoxLayout:
PlayerSlugButton:
group: 'player4'
RegularLabel:
text: 'Speedster'
BoxLayout:
PlayerSlugButton:
group: 'player4'
RegularLabel:
text: 'Trusty'
BoxLayout:
PlayerSlugButton:
group: 'player4'
RegularLabel:
text: 'Iffy'
BoxLayout:
PlayerSlugButton:
group: 'player4'
RegularLabel:
text: 'Slowpoke'
### GO BUTTON ###
...
Here we have a BoxLayout with a lot of widgets each to represent each player’s bet. Let’s refactor this code using Kivy properties again. First, let’s find out how these BoxLayouts differ. Here are the differences:
– The text on the first RegularLabel is different for each player – it’s the player’s name.
– The value of BetInput’s text doesn’t differ now, but as it represents a particular player’s bet (amount of money that the player bets), it will be different for each player, depending on how much money each player wants to bet. So, let’s assume this property’s value will be different for each player.
– As far as the sliders are concerned, they all look the same at this moment, but the truth is that only two out of the four slider properties will be the same for each player, min and step. The max property will represent the maximum amount of money a player can bet, so it will change pretty often. The value property will represent the bet that the player wants to put on a slug, so the same value as the value displayed in BetInput. The player will just have the option to set the bet either by typing it in or by moving the slider. So, these two properties, max and value, will be different for each player.
– In the BoxLayouts with a PlayerSlugButton and a RegularLabel, the group property will be different for each player, but the names of the slugs will be the same.
As you can see, there are quite a few differences. So, in the Python file let’s create the Bet class that inherits from BoxLayout and define the following properties (remember to import the classes first):
– the StringProperty player_name initialized to an empty string,
– the NumericProperty bet_amount initialized to 0,
– the NumericProperty max_bet_amount initialized to 0,
– the StringProperty player_group initialized to an empty string.
Here’s the Python file:
# File name: bets.py
import kivy
from kivy.app import App
from kivy.uix.boxlayout import BoxLayout
from kivy.config import Config
from kivy.properties import NumericProperty, StringProperty
# Configuration
Config.set('graphics', 'width', '1200')
Config.set('graphics', 'height', '675')
class Bet(BoxLayout):
player_name = StringProperty('')
bet_amount = NumericProperty(0)
max_bet_amount = NumericProperty(0)
player_group = StringProperty('')
class BetsScreen(BoxLayout):
pass
class BetsApp(App):
def build(self):
return BetsScreen()
if __name__ == '__main__':
BetsApp().run()
Then, in the kv file let’s add the corresponding rule for the Bet class. Let’s use the bet_amount property to set both the BetInput’s text and the slider’s value. Finally, let’s use the Bet instances in the code. Here’s the kv file:
# File name: bets.kv
...
<Bet>:
spacing: 10
RegularLabel:
text: root.player_name
RegularLabel:
text: 'bets'
size_hint: (.4, 1)
BoxLayout:
spacing: 5
RegularLabel:
text: '$'
halign: 'right'
BetInput:
text: str(root.bet_amount)
Slider:
min: 1
max: root.max_bet_amount
value: root.bet_amount
step: 1
RegularLabel:
text: 'on'
size_hint: (.3, 1)
BoxLayout:
PlayerSlugButton:
group: root.player_group
RegularLabel:
text: 'Speedster'
BoxLayout:
PlayerSlugButton:
group: root.player_group
RegularLabel:
text: 'Trusty'
BoxLayout:
PlayerSlugButton:
group: root.player_group
RegularLabel:
text: 'Iffy'
BoxLayout:
PlayerSlugButton:
group: root.player_group
RegularLabel:
text: 'Slowpoke'
<BetsScreen>:
...
### PLAYER BETS ###
BoxLayout:
orientation: 'vertical'
# player 1
Bet:
player_name: 'Player 1'
bet_amount: 1000
max_bet_amount: 1000
player_group: 'player1'
# player 2
Bet:
player_name: 'Player 2'
bet_amount: 1000
max_bet_amount: 1000
player_group: 'player2'
# player 3
Bet:
player_name: 'Player 3'
bet_amount: 1000
max_bet_amount: 1000
player_group: 'player3'
# player 4
Bet:
player_name: 'Player 4'
bet_amount: 1000
max_bet_amount: 1000
player_group: 'player4'
### GO BUTTON ###
RedButton:
text: 'Go'
That’s it. Run the app to make sure it still works. And in the next part we’ll add some Kivy properties to the Results screen.