Python Kivy is an open-source graphical user toolkit. This library allows us to make a desktop application or mobile application.

What will you learn?

  1. Create a first app with kivy
  2. Learn about Grid Layout
  3. Learn about Float Layout
  4. Learn about Page Layout
  5. Build our main app
  6. Creating Mobile (Android, IOS) applications with Python

 

Create a first app with Kivy:

from kivy.app import App
from kivy.uix.label import Label

class MyFirstApp(App):
    def build(self):
        return Label(text="IG Tech Team")

MyFirstApp().run()

Output:


GridLayout:

Let's use GridLayout to create a container and then insert a label and a button inside of it.

from kivy.app import App
from kivy.uix.gridlayout import GridLayout
from kivy.uix.label import Label
from kivy.uix.button import Button

class MyLayout(GridLayout):
    def __init__(self, **kwargs):
        super().__init__(**kwargs)
        self.rows = 2
        self.cols = 2

        self.lbl1 = Label(text = "IG Tech Team")
        self.add_widget(self.lbl1)

        self.b1 = Button(text="Click me", background_color = (0,128,0), color=(0,0,0))
        self.add_widget(self.b1)

        self.lbl2 = Label(text = "Kivy tutorial")
        self.add_widget(self.lbl2)

        self.b2 = Button(text="Learn more")
        self.add_widget(self.b2)

class MyApp(App):
    def build(self):
        return MyLayout()

MyApp().run()

Output:


FloatLayout:

In most cases, I go with this layout. This is because we can set the size of different widgets in this layout and we don't need to mention the number of rows and columns.

from kivy.app import App
from kivy.uix.floatlayout import FloatLayout
from kivy.uix.label import Label
from kivy.uix.button import Button

class MyLayout(FloatLayout):
    def __init__(self, **kwargs):
        super().__init__(**kwargs)

        self.l1 = Label(
            text = "IG Tech Team", 
            size_hint = (0.2,0.1), 
            pos_hint={"x":0.2, "y":0.8}
            )
        self.add_widget(self.l1)

        self.b1 = Button(
            text="Click me", 
            background_color = (0,128,0), 
            color=(0,0,0),
            size_hint = (0.2,0.1),
            pos_hint={"x":0.4, "y":0.8}
            )
        self.add_widget(self.b1)

        self.l2 = Label(
            text = "Kivy tutorial", 
            size_hint = (0.2,0.1),
            pos_hint={"x":0.2, "y":0.6}
            )
        self.add_widget(self.l2)

        self.b2 = Button(
            text="Learn more", 
            size_hint = (0.2,0.1),
            pos_hint={"x":0.4, "y":0.6}
            )
        self.add_widget(self.b2)

class MyApp(App):
    def build(self):
        return MyLayout()

MyApp().run()

Output:


PageLayout:

Each widget occupied a whole page.

from kivy.app import App
from kivy.uix.pagelayout import PageLayout
from kivy.uix.label import Label
from kivy.uix.button import Button

class MyLayout(PageLayout):
    def __init__(self, **kwargs):
        super().__init__(**kwargs)


        self.b1 = Button(text="Click me", background_color = (0,128,0), color=(0,0,0))
        self.add_widget(self.b1)

        self.b2 = Button(text="Learn more")
        self.add_widget(self.b2)

        self.b3 = Button(text="IG Tech Team")
        self.add_widget(self.b3)

class MyApp(App):
    def build(self):
        return MyLayout()

MyApp().run()

Let's build our main app:

I am implementing the following things here:

  • Using FlowLayout
  • Change the title of my application
  • Change the icon of my app
  • adding an image to my window
  • using a label, text input, and button
  • When a button is pressed, show a popup message.
from kivy.app import App
from kivy.uix.floatlayout import FloatLayout
from kivy.uix.label import Label
from kivy.uix.button import Button
from kivy.uix.image import Image
from kivy.uix.textinput import TextInput
from kivy.uix.popup import Popup

class MyLayout(FloatLayout):
    def __init__(self, **kwargs):
        super().__init__(**kwargs)

        self.img = Image(
            source="img.png",
            pos_hint={"x":0.4, "y":0.45}
        )
        self.add_widget(self.img)

        self.l1 = Label(
            text = "Enter your name", 
            size_hint = (0.2,0.1), 
            pos_hint={"x":0.2, "y":0.8},
            font_size=40
            )
        self.add_widget(self.l1)

        self.t1 = TextInput(
            text="",
            size_hint = (0.3,0.1),
            pos_hint={"x":0.5, "y":0.8},
            font_size=40
        )
        self.add_widget(self.t1)

        self.l2 = Label(
            text = "Enter your age", 
            size_hint = (0.2,0.1), 
            pos_hint={"x":0.2, "y":0.6},
            font_size=40
            )
        self.add_widget(self.l2)

        self.t2 = TextInput(
            text="",
            size_hint = (0.3,0.1),
            pos_hint={"x":0.5, "y":0.6},
            font_size=40
        )
        self.add_widget(self.t2)

        self.b1 = Button(
            text="Submit", 
            size_hint = (0.2,0.1),
            pos_hint={"x":0.35, "y":0.45},
            font_size=40
            )
        self.b1.bind(on_press = self.callback)
        self.add_widget(self.b1)

        self.pop = Popup(
            title="Message",
            size_hint = (None, None),
            size = (400,400),
            content = Label(
                text = ""
            )
        )

    def callback(self, e):
        self.pop.content.text = "Welcome " + self.t1.text
        self.pop.open()

class MyApp(App):
    def build(self):
        self.title="My First App"
        self.icon = "icon.png"
        return MyLayout()

MyApp().run()

Creating Mobile (Android, IOS) applications with Python

With the Python programming language, creating applications is quite simple. Of course, using Python code alone is insufficient.

Convert GUI APP into Android application using Buildozer:

Run these codes in Google colaboratory.
First of all, upload all the files (i.e. python file and all its dependencies)

from google.colab import files
uploaded = files.upload()

Install the required package i.e. buildozer.

!pip install buildozer
Then, install all the dependencies of buildozer:
!pip install cython==0.29.19
!sudo apt-get install -y \
    python3-pip \
    build-essential \
    git \
    python3 \
    python3-dev \
    ffmpeg \
    libsdl2-dev \
    libsdl2-image-dev \
    libsdl2-mixer-dev \
    libsdl2-ttf-dev \
    libportmidi-dev \
    libswscale-dev \
    libavformat-dev \
    libavcodec-dev \
    zlib1g-dev
!sudo apt-get install -y \
    libgstreamer1.0 \
    gstreamer1.0-plugins-base \
    gstreamer1.0-plugins-good
!sudo apt-get install -y \
    libgstreamer1.0 \
    gstreamer1.0-plugins-base \
    gstreamer1.0-plugins-good
!sudo apt-get install libffi-dev

This step is essential. When you run the below cell, buildozer.spec file is created from where you can set the title, icon, version, and all other important information.

!buildozer init

This is the final step. This may take about 10-15 minutes to complete execution. So, be patient and wait.

!buildozer -v android debug

Your apk file is stored in the bin directory at last.

Conclusion

In this way, we can make a GUI application with Kivy Framework. We have learned how to convert our project into a mobile/Android application. For this, buildozer dependency is required.

I hope this post is very helpful to you. If you have any doubt, ask me in the comment section. I will reply as soon as possible. Thanks.