A story about an amateur making a breakout with python (kivy) ①

Preface 1 kivy until you start

It's been about half a year since I started programming in earnest, but when I was thinking of making something like an app, a pigeon I met on Twitter recommended kivy, so I started with momentum. I hope that the explanation of the production process and contents will make it easier for other people to get started with application development with kivy.

Preface 2 What is kivy in the first place?

kivy is a Python that allows you to develop multi-tap apps. An open source library, apps created with kivy can be run on iOS / Android devices, including PC environments such as macOS, Windows, and Linux. In addition, kivy can also use its own language called KV language together with Python, which is a feature that makes the program multi-layered. It seems that it is difficult to understand this KV language and that it does not support Japanese very well.

First of all, I tried to do a tutorial, but I don't understand at all ...

Well, even if you read only the outline, I'm not sure if you don't try it for the time being! So, let's install kivy immediately and start kivy by creating the tutorial Pong Game. ~~~. I started with a relaxed feeling, but I was able to make something like that with copy and paste, but I have no idea what is going on in the program. I'm an amateur, so I don't really understand what Widget is, and even if I go to the detailed explanation, I can't think of all the words I don't know. Also, because of the KV language mentioned above, the structure of the program feels very difficult to read. It seems that the position and size of what is displayed on the screen is decided.

I'm not sure. Is there any good material ... There is.

So, when I was looking for some good materials, I found [kivy programming book](https: / /www.asakura.co.jp/books/isbn/978-4-254-12896-3/) is out, isn't it? Fortunately, I bought it, but it was very easy to understand and I was finally able to get to the starting point. This time as well, I would like to proceed with the discussion with great reference.

Load-to-breakout-Learn the basic structure (Widget) of GUI programming ……-

Well, it is a story until finally making a breakout with kivy programming. Before we got into the seemingly esoteric KV language, we needed to know the structure of GUI programs and widgets in the first place. [Widget](https://ja.wikipedia.org/wiki/%E3%82%A6%E3%82%A3%E3%82%B8%E3%82%A7%E3%83%83%E3%83 % 88_ (GUI)), a famous word that appears on Wikipedia ... It seems that GUI programs are made by combining widgets, but kivy programs are also made by combining widgets with various functions. It is said that the program is managed by giving each Widget a parent-child relationship (configuring a Widget tree). In other words, it is important for program creation to have a hierarchical relationship with each part (Widget) such as buttons and labels, and to understand where each part is located. In a complicated program, it seems better to draw a diagram so that the relationships are easy to understand.

Load-to-breakout-Let's configure a widget tree with kivy-

Now that we know what to do, let's configure the Widget tree first! So, I tried to make something like the following with the reference in one hand. It is a program that adds Label (character string description) and Button (button) as child widgets by using add_widget () method to Boxlayout that defines the layout.

main.py


#Import the widget to use. This time Label, Button and Box Layout.
from kivy.app import App
from kivy.uix.label import Label
from kivy.uix.button import Button
from kivy.uix.boxlayout import BoxLayout

#A subclass of the App class that describes the content of the app
class testApp(App):
    #Definition of build method to be executed when the main loop is started
	def build(self):
        #Creation of Boxlayout object and Button object
		layout1 = BoxLayout(orientation='vertical')
		button1 = Button(text='children')
		label1 = Label(text='children')
        #Added button1 and label1 as child widgets of layout1
		layout1.add_widget(button1)
		layout1.add_widget(label1)
		return layout1

#Start of main loop
testApp().run()

After executing the above, the following screen will be displayed. Since the parent Widget Boxlayout is instructed to orientation ='vertical', the Buttons and Labels added as child widgets are lined up vertically. It is also possible to change it side by side by changing vertical to horizontal.

test.png

You can also create a wide variety of widget trees such as the following. Boxlayout has Button and Boxlayout as child Widget (children1), and Boxlayout of child Widget (children1) has Button and Label as child Widget (children2).

main.py



from kivy.app import App
from kivy.uix.label import Label
from kivy.uix.button import Button
from kivy.uix.boxlayout import BoxLayout

class testApp(App):
	def build(self):
        #Creation of Boxlayout object and Button object
		layout1 = BoxLayout(orientation='vertical')
		button1 = Button(text='children1')
		layout2 = BoxLayout(orientation='horizontal')
		label2 = Label(text='children2')
		button2 = Button(text='children2')
        #Added button2 and label2 as child widgets of layout2
		layout2.add_widget(button2)
		layout2.add_widget(label2)
		#Added button1 and layout2 as child widgets of layout1
		layout1.add_widget(button1)
		layout1.add_widget(layout2)
		return layout1

testApp().run()

The execution result is as follows. I was able to create a slightly complicated structure. I feel like I've finally set up at the entrance to GUI creation.

test.png

Summary and future

This time, I made a simple program to understand the basic structure Widget tree for displaying parts on the screen. Next time, I will explain how to make Buttons and Labels placed in the Widget tree related.

References / web

Kazuya Haraguchi (2018) "Practical Python Library Kivy Programming -Multi-tap App Created with Python-" Mikio Kubo, Asakura Shoten 254-12896-3 /) https://kivy.org/#home

Recommended Posts

A story about an amateur making a breakout with python (kivy) ②
A story about an amateur making a breakout with python (kivy) ①
A story about making 3D space recognition with Python
A story about making Hanon-like sheet music with Python
A story about trying a (Golang +) Python monorepo with Bazel
A story about making an x86 bootloader that can boot vmlinux with Rust
A story about how Windows 10 users created an environment to use OpenCV3 with Python 3.5
A story about installing matplotlib using pip with an error
A story about making a tanka by chance with Sudachi Py
A story about a python beginner stuck with No module named'http.server'
A story about developing a soft type with Firestore + Python + OpenAPI + Typescript
The story of making a module that skips mail with python
The story of making Python an exe
A story about Python pop and append
The story of making a university 100 yen breakfast LINE bot with Python
A story about a beginner making a VTuber notification bot from scratch in Python
[Python] Make a game with Pyxel-Use an editor-
[Python3] A story stuck with time zone conversion
A story stuck with handling Python binary data
A story about implementing a login screen with django
A story about running Python on PHP on Heroku
A story about modifying Python and adding functions
The story of making a tool to load an image with Python ⇒ save it as another name
A story about building an IDE environment with WinPython on an old Windows OS.
Automatic Zakuzaku, Bitcoin. A story about a Python beginner making a coin check 1-minute chart
A story about a liberal arts programming amateur getting a Python 3 engineer certification basic exam
A story about using Resona's software token with 1Password
A story about predicting exchange rates with Deep Learning
A story about how theano was moved with TSUBAME 2.0
A memo about building a Django (Python) application with Docker
A story about an error when loading a TensorFlow model created with Google Colab locally
[Python] A story about making a LINE Bot with a practical manned function on its own without using Salesforce [Messaging API]
A note about hitting the Facebook API with the Python SDK
How to convert an array to a dictionary with Python [Application]
A story about how to specify a relative path in python.
Creating an egg with python
A story about competing with a friend in Othello AI Preparation
Stumble story with Python array
A story about building a PyPI cache server (with Docker) and making me a little happy again
[Note] A story about trying to override a class method with two underscores in Python 3 series.
Make a fortune with Python
Machine learning A story about people who are not familiar with GBDT using GBDT in Python
A story about a war when two newcomers developed an app
A memorandum about Python mock
[Python] The first step to making a game with Pyxel
[Python Kivy] How to create an exe file with pyinstaller
Automate sushi making with Python
Create a directory with python
A story about trying to implement a private variable in Python.
Turn an array of strings with a for statement (Python3)
The story of making a question box bot with discord.py
A note about [python] __debug__
A story about a person who uses Python addicted to the judgment of an empty JavaScript dictionary
[Python, Selenium, PhantomJS] A story when scraping a website with lazy load
Try to extract a character string from an image with Python3
[Python] I made an image viewer with a simple sorting function.
A story about trying to run multiple python versions (Mac edition)
[Python] What is a with statement?
Cut out an image with python
Solve ABC163 A ~ C with Python
Operate a receipt printer with python