Kivy 3 Flashcards
Create an interface that has a button on the left that says ‘click me’ and a label that says ‘hello’
When you click the button change the label to something else
WidgetsExample:
<WidgetsExample>:
cols: 3
Button:
text: 'Click here"
on_press: root.on_button_click()
Label:
text: root.mytext
from kivy.properties import StringProperty
class WidgetsExample(GridLayout):
my_text = StringProperty('Hello')
def on_button_click(self):
print('Button Clicked')
self.my_text = 'You Clicked!'
We use root.on_button_click() instead of self, because self would refer to the button class, we need to go to the top level by using 'root'
'Button Clicked' is info sent to the command line.
StringProperty - allows your string to change immediately unlike just adding 'Hello'
we don't add self to self.mytext because kivy does this for us when the class is called, if we defined it earlier it would be redundant. Mucho confusing, but oh well.
</WidgetsExample>
WidgetsExample:
<WidgetsExample>:
cols: 3
Button:
text: 'Click here"
on_press: root.on_button_click()
Label:
text: root.mytext
from kivy.properties import StringProperty
class WidgetsExample(GridLayout):
my_text = StringProperty('Hello')
def on_button_click(self):
print('Button Clicked')
self.my_text = 'You Clicked!'
We use root.on_button_click() instead of self, because self would refer to the button class, we need to go to the top level by using 'root'
'Button Clicked' is info sent to the command line.
StringProperty - allows your string to change immediately unlike just adding 'Hello'
we don't add self to self.mytext because kivy does this for us when the class is called, if we defined it earlier it would be redundant. Mucho confusing, but oh well.
</WidgetsExample>
How do you add different fonts to your project?
The file name is Lcd.ttf
This will be a bit small, make it bigger
change the color
Just add the folder to your apps directory
in you Label:
font_name: ‘Lcd.ttf’
font_size: ‘80dp’
color: 1, .5, 1, 1
Create a button that when clicked on will show that it’s activated, when you press it again it should deactivate the button
When it’s toggled on it should do something
ToggleButton:
text: ‘toggle’
on_state: root.on_toggle_button_state(self)
class WidgetsExample(GridLayout):
def on_toggle_button_state(self, widget):
print(‘toggle state’ + widget.state)
if_widget.state == ‘normal’:
widget.text = ‘OFF’
else:
widget.text = ‘ON’
Try toggling on and off your counter button
How do you grey out your button?
just add a class variable called count_enabled and set it to false,
add conditions from there
or
count_enabled = BooleanProperty(False)
from kivy.properties import BooleanProperty, StringProperty
disabled = True
or
disabled = not root.count_enabled
Create a switch
Switch:
on_active: root.on_witch_active(self)
def on_switch_active(self, widget):
print(f”Switch: {srt(widget.active)}”)
Create a slider that goes from 0 to 100, the default value should be 50. The slider should also be vertical.
The slider should do something according to it’s values (remember to set it to integer, normally it’s a float)
Slider:
min: 0
max: 100
value: 50
orientation: ‘vertical’
on_value: root.on_slider_value(self)
def on_slider_value(self, widget):
print(‘Slider: ‘ + str(int(widget.value))
What would you use to make a variable for your slider that you can use to update a label with it’s number all in the kv file.
How would you make the switch on when the program opens
Slider:
id: my_slider
Label:
text: str(my_slider.value)
Switch:
active: True
Your widgets are all in GridLayout, but you would like to create a progress bar that follows your slider that goes from 0 100. This progress bar should be under your Label. The bar should start at 25, and then make it follow the progressbar next
Slider:
id: my_slider
orienatation: ‘vertical’
on_value: root.value_activity(self)
disabled: not my_switch.active
BoxLayout:
Label:
text: str(int(my_slider.value))
font_name: ‘Lcd.ttf’
font_size: ‘80dp’
color: .2, .5, 1, 1
ProgressBar: max: 100 value: 25 to make it follow your slider value: int(my_slider.value)
Make it to where you can add text to your program.
Give it a default text.
You should only be able to put in one line of text
When you press enter
Add that text to a label
TextInput:
id: my_text
text: ‘foo’
multiline: False
on_text_validate: root.on_text_validate(self)
Label:
text: ‘Your name is’ + root.on_text_validate(self)
IN YOUR CLASS
text_input_string = StringProperty(‘foo’)
def on_text_validate(self, widget):
self.text_input_string = widget.text
Create a Switch
Switch:
on_active: root.on_witch_active(self)
def on_switch_active(self, widget):
print(f”Switch: {srt(widget.active)}”)
Add three images of the cake in a row, use the grid layout
The middle should be allowed to stretch around
The third should fill it’s whole section
ImagesExample:
ImagesExample@GridLayout:
cols: 3
Image:
source: ‘images/cake.jpg’
Image:
source: ‘images/cake.jpg’
allow_stretch: True
Image:
source: ‘images/cake.jpg’
allow_stretch: True
keep_ratio: False
What is the difference between jpg and png?
jpg - no transparency but can compress better
png - transparency
How would we put multiple screens into our project?
This is known as ‘navigation’ and you can learn more about it looking up ‘screen manager kivy’ in google
