Python kivy マルチタッチアプリ作成の第一歩！！ウインドウ、ボタン、kvファイル作成の基礎

まくまく

PythonのGUIアプリ作成ライブラリ kivyを用いて、ウインドウ、ボタン、ラベルなどを作成してみましょう。マルチタッチアプリケーション作成の第一歩を踏み出してみましょう！！

コンテンツ

1 ウインドウの作成
2 ボタン、ラベルの作成
3 kvファイルの作成

ウインドウの作成

#ライブラリのインポート
from kivy.app import App
from kivy.uix.label import Label
from kivy.config import Config

class MyApp(App):
    def build(self):
        self.title = "window"
        return Label(text="Hello World")

if __name__ == '__main__':
    MyApp().run()

コードはクラスを使用して記載します。kivyでウインドウを作成して、「Hello World!!」を表示するだけのプログラムです。

出力はこちら。

ウインドウを作成することができました。中央に「Hello World」と記載されています。ウインドウの端をドラッグして、ウインドウサイズを変えても「Hello World」の文字が常に中央に位置することが分かると思います。

ボタン、ラベルの作成

#ライブラリのインポート
from kivy.app import App
from kivy.uix.label import Label
from kivy.uix.gridlayout import GridLayout
from kivy.uix.textinput import TextInput
from kivy.uix.button import Button

class MyGridLayout(GridLayout):
    def __init__(self, **kwargs):
        super(MyGridLayout, self).__init__(**kwargs)
        
        self.cols=1

        self.add_widget(Label(text="Name: ", font_size=32))
        self.name = TextInput(multiline=False)
        self.add_widget(self.name)
                
        self.enter = Button(text="Enter", font_size=32 )

        self.enter.bind(on_press=self.press)
        self.add_widget(self.enter)
        
    def press(self, instance):
        name = self.name.text
        print(f"Hello {name}!!")

class MyApp(App):
    def build(self):
        self.title = "window"
        return MyGridLayout()

if __name__ == '__main__':
    MyApp().run()

ウインドウが作成できたら、次はボタンやラベルを表示してみましょう。グリッドレイアウトでそれぞれを配置してみます。12行目の「self.cols=1」にしているで、今回は1列のみですが、ここを2にすると2列レイアウト、3なら3列レイアウトになります。

またボタンを押すと、def pressが呼び出され、「Hello name!!」が出力されます。

上段がラベル、中段がテキストインプット、下段がボタンです。中段に名前を入力して、ボタンを押すと、以下の文章が出力されます。

Hello Mike!!

kvファイルの作成

さきほどのラベルとボタンのプログラムを次はkvファイルを用いて書いてみようと思います。pyファイルとkvファイルは、ちょうどhtmlとcssみたいな関係です。

kvファイルの作成は、visual studio codeなら新規作成して「ファイル名.kv」と拡張子を含めて記載すればokです。Anaconda/jupyterなどでしたら、新規でテキストファイルを作成して拡張子をkvに書き換えてもokです。

Windowsのメモ帳にKV言語を記載して、その後拡張子を「.txt」から「.kv」に変更してもOKですが、インデントがズレやすくなるので注意が必要です。使いにくいので、あまりオススメはしません。

pyファイル

#ライブラリのインポート
from kivy.app import App
from kivy.lang import Builder
from kivy.uix.widget import Widget
from kivy.properties import ObjectProperty
from kivy.config import Config

Config.set("graphics","width",400)
Config.set("graphics","height",300)
Config.set("graphics","resizable",1)

Builder.load_file("buttontest.kv")

class MyGridLayout(Widget):
    name=ObjectProperty(None)
        
    def press(self):
        name = self.name.text
        print(f"Hello {name}!!")
        #self.add_widget(Label(text=f"Hello {name}!!")) 

class MyApp(App):
    def build(self):
        self.title = "window"
        return MyGridLayout()

if __name__ == '__main__':
    MyApp().run()

kvファイル

#ファイル名: buttontest.kv
<MyGridLayout>:

    name:name

    GridLayout:
        cols:1
        size: root.width, root.height

        Label:
            text: "Name"

        TextInput:
            id:name
            multiline:False

        Button:
            text: "Enter"
            font_size:32
            on_press: root.press()