Do you think IIT Guwahati certified course can help you in your career?
No
Introduction
Kivy is an open-source Python toolkit for quickly developing applications with novel user interfaces, like multi-touch apps. It is mainly used to create android applications, but it may also create desktop applications. In this blog, we'll look at how to shape and decorate a button in Kivy-created windows.
Buttons
In Kivy, a button is a type of label that triggers the corresponding actions when clicked. We can add functionalities to a button and design it.
Shaping a button in kivy
Widgets are by default rectangles, but utilizing the background_normal and background_down parameters of buttons, we can change the background of widgets and add a pair of images for the normal and down states of the button.
To round the corners of the button in kivy, you must also be familiar with another property of the button, the border property.
Background_down: The background image of a button used when the button is clicked. It is a string property.
Background_normal: The background image of a button used when the button is not clicked. It is also a string property.
Border: BorderImage graphics instruction uses a border. Background_normal and background_down are also supported. Custom backgrounds are possible. It is a list of four values: (bottom, right, top, and left).
Approach
The basic approach to shaping a button in kivy is as follows:=
import kivy, kivyApp
import button, float layout
set minimum version(optional)
Create the Layout class
Create App class
Create .kv file:
Add Base class
Add Button properties
Add Image as a button
Round the corners of the button using the border property
Return instance of the layout class.
Run an instance of the class.
Implementation
Let's learn how to implement the above approach.
main.py
import kivy
# Restricting the version of kivy
kivy.require("1.9.1")
# Importing required classes
from kivy.app import App
from kivy.uix.floatlayout import FloatLayout
from kivy.uix.button import Button
# To change the kivy default settings we use this module config
from kivy.config import Config
Config.set('graphics', 'resizable', True)
# Creating the root widget
class Base(FloatLayout):
pass
# Creating the image button in kivy
class MyButtonApp(App):
def build(self):
# Returning the instance of button class
return Base()
if __name__ == "__main__":
MyButtonApp().run()
You can also try this code with Online Python Compiler
# Creating a styled button in kivy
<Base>:
Button:
text: 'Click me!'
# Properties of button in kivy
background_normal: 'normal.png' # Add image path here
background_down: 'down.png' # Add image path here
# Adding background color to the button
background_color: 0.1, 0.5, 0.5, 1
size_hint: .3, .3
pos_hint: {"x": 0.35, "y": 0.3}
Output:
Frequently Asked Questions
What do you know about Kivy?
Kivy is an open-source Python toolkit for quickly developing applications with novel user interfaces, like multi-touch apps. It is mostly used to create Android applications, but it may also be used to create desktop applications.
What is the use of button in Kivy?
In Kivy, a button is a type of label that triggers the corresponding actions when clicked. We can add functionalities to a button and design it.
How to decorate a button in kivy?
We can decorate a button in kivy by utilizing the background_normal and background_down parameters of buttons. We can round the corners of a button using the border property
How to change the background image of a button in kivy?
We can change the background image of a button using the background_normal and background_down functions.
Conclusion
This article extensively discussed how to shape and decorate a button in Kivy with examples.