In this Python and Kivy article we want to learn about How to Create UIs with Kivy and Python, so first of all let’s talk about Python Kivy, Kivy is Python framework that allows developers to create user interfaces (UIs) for desktop and mobile applications. it provides simple and easy way to create UIs using Python code, and this makes it popular choice for developers looking to create cross platform applications with modern look and feel. in this article we want to talk about creating a basic UI with Kivy and Python.
How to Create UIs with Kivy and Python
Let’s install Kivy library and you can use pip for that
1 |
pip install kivy |
After installation of Kivy, we can start creating our UI. this is a simple example that creates a window with label and button:
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 |
import kivy from kivy.app import App from kivy.uix.button import Button from kivy.uix.label import Label from kivy.uix.gridlayout import GridLayout class MyUIApp(GridLayout): def __init__(self, **kwargs): super(MyUIApp, self).__init__(**kwargs) self.cols = 1 # Add widgets self.add_widget(Label(text="Welcome to geekscoders.com")) self.button = Button(text="Click me") self.button.bind(on_press=self.on_button_press) self.add_widget(self.button) def on_button_press(self, instance): print("Button pressed!") class MyApp(App): def build(self): return MyUIApp() if __name__ == '__main__': MyApp().run() |
In the above code we have defined a MyUIApp class that extends from GridLayout class provided by Kivy. after that we have added two widgets to the layout, a Label and a Button . we also defined an on_button_press method that gets called when the button is pressed. and lastly we have defined MyApp class that extends from the App class provided by Kivy. build method of this class returns an instance of the MyUIApp class which is used to create the UI.
Run the code and this will be the result
![How to Create UIs with Kivy and Python](https://geekscoders.com/wp-content/uploads/2023/04/how-to-create-uis-with-python-and-kivy.jpg)
Kivy allows you to customize the appearance of your UI using CSS like styling. you can set attributes such as font size, color, background color and many more.
This is an example that styles the label and button from our previous example:
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 |
from kivy.app import App from kivy.uix.button import Button from kivy.uix.label import Label from kivy.uix.gridlayout import GridLayout from kivy.graphics import Color, Rectangle class MyUIApp(GridLayout): def __init__(self, **kwargs): super(MyUIApp, self).__init__(**kwargs) self.cols = 1 # Add widgets self.add_widget(Label(text="Welcome to geekscoders.com", font_size=30, color=(1, 0, 0, 1))) self.button = Button(text="Click me", font_size=30, background_color=(1, 0, 0, 1), color=(1, 1, 1, 1)) self.button.bind(on_press=self.on_button_press) self.add_widget(self.button) # Set background color of label with self.canvas.before: Color(0, 1, 0, 1) # green color self.rect = Rectangle(size=self.size, pos=self.pos) self.bind(size=self._update_rect, pos=self._update_rect) def _update_rect(self, instance, value): self.rect.pos = instance.pos self.rect.size = instance.size def on_button_press(self, instance): print("Button pressed!") class MyApp(App): def build(self): return MyUIApp() if __name__ == '__main__': MyApp().run() |
In the above example we have added some styling attributes to the Label and Button widgets. font_size attribute sets the font size and color and background_color attributes set the text color and background color. Note that Kivy supports different styling attributes, and it allows you to customize every aspect of your UI. you can find a full list of supported attributes in the Kivy documentation.
Run the complete code and this will be the result
![How to Create UIs with Kivy and Python](https://geekscoders.com/wp-content/uploads/2023/04/styling-python-kivy-app.jpg)
Learn More on Kivy
- Introduction to Python Kivy
- How to Integrate Yahoo Finance with Python Kivy
- How to Build Music Player with Kivy
- Build Android Application with Python Kivy
- How to Integrate Matplotlib with Python Kivy
- How to Integrate Pandas with Python Kivy
- Building Cross Platform GUI Applications with Python Kivy
- Getting Started with Kivy in Python