こんにちは！まっきーです（@makky_study）
Kivyを使って簡単なアプリを作成していこうと思います。
今回は第一弾ということで簡単な使い方を確認していきます！
本記事の内容
- Kivyの仕組みを簡単に説明
- Kivyの使い方
- 日本語フォント設定方法
- タッチパネルが反応しない問題を解決
Kivyのインストール方法はラズパイにKivy（1.11.1）をインストールする方法にまとめてありますので、インストールがまだの方は先にインストールしてしまいましょう！
使用機器
- RaspberryPi 3B+
- ラズパイタッチディスプレイ
基本的な操作方法
kivyでは.kvという拡張子のファイルにKivy言語（CSSのようなもの）を記述して書くのが一般的です。
レイアウトは.kv（kivy言語）、機能は.py（Python）と
Kv Languageを使用することでレイアウトと機能の記述を分けることができます。
また、Kivyはパーツ、レイアウトなどのwidget（ グラフィカルユーザインタフェースを構成する部品要素、およびその集まり）を組み合わせてGUIを作成します。
Kivyでアプリを作る際に行うこと
- Appクラスを継承してサブクラスを作る（Python側）
- ラベルやボタンなどのレイアウトを追加する（kivy側）
たったこれだけです！
実際にプログラムを動かしてみます。下記のプログラムの実行結果です。
Pythonコード
|
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 40 41 42 |
# 必要なパッケージをインポート import kivy from kivy.app import App from kivy.uix.widget import Widget from kivy.properties import StringProperty,ListProperty from kivy.core.text import LabelBase,DEFAULT_FONT # デフォルトに使用するフォントを変更 LabelBase.register(DEFAULT_FONT,'/usr/share/fonts/truetype/takao-gothic/TakaoPGothic.ttf') # Widgetクラスを継承してTextWidgetというサブクラスを作成 class TextWidget(Widget): # kivyのpropertiesはボタンが押された場合に # イベントが実行された場合のオブジェクトの属性に値の変更があった場合に実行する仕組み text=StringProperty() #Color[r,g,b,a] 色の要素はListPropertyに赤、緑、青、透明度というように格納されている color=ListProperty([1,1,1,1]) def __init__(self,**kwargs): super(TextWidget,self).__init__(**kwargs) self.text='はじまり' # ボタンが押された時 def buttonClicked(self): # テキストにGoot Morningを格納 self.text='Good Morning' # テキストの色は赤 self.color=[1,0,0,1] def buttonClicked2(self): self.text='Good Afternoon' self.color=[0,1,0,1] def buttonClicked3(self): self.text='Good Evening' self.color=[0,0,1,1] #Appクラスは、Kivyアプリを作成するための基本になるクラス。 #Appクラスを継承してTestAppというサブクラスを作成 class TestApp(App): def __init__(self,**kwargs): super(TestApp,self).__init__(**kwargs) self.title = 'greeting' if __name__=='__main__': # .runでプログラムが動作します TestApp().run() |
Kivy言語
|
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 40 41 42 43 44 |
#ファイル名（test.kv）とAppの前の名前（Test）が一致していないといけない #ボタン表示を実装 TextWidget: <TextWidget>: # Layoutを組み合わせることで複雑なレイアウトを作成することができる BoxLayout:#①ここで画面が2分割 #orientationで縦一列（vertical）か横一列(horizontal[デフォルト]) 並びを決めることができる orientation:'vertical' size:root.size #ラベルは、Kivyのwedget(グラフィカルユーザーインターフェースを構成する部品要素及びその集まり)の一つ Label: #size_hint_y,x:＜値＞でラベルの位置が変わる #Kivyは左下が座標（0,0） size_hint_y:0.7 id:label1 font_size:68 text:root.text#root(TextWidget)の変数テキストの値を取得 color:root.color#root(TextWidget)の色の値を取得 BoxLayout:#②ここで下側のレイアウト設定→横並び size_hint_y:0.3 padding:20,30,20,10 # ボタンウィジェット # ラベルのサブクラスなのでラベルで使用したパラメータ使用可能 Button: id:button1 text:"morning" font_size:68 on_press:root.buttonClicked()#ボタンをクリックしたときにPython側の関数を呼ぶ Button: id:button2 text:"day" font_size:68 on_press:root.buttonClicked2() Button: id:button3 text:"night" font_size:68 on_press:root.buttonClicked3() |
KivyファイルとPythonファイルを結び付けているのは、kivyファイルの名前です。Python側でTestApp(App)、Kivy側でtest.kvとすることが必要です。
クラスの名前が、AbcApp(App)だったとしたら、Kivy側はabc.kvということです（小文字に注意）
基本的な説明についてはPython Kivyの使い方① ～Kv Languageの基本～がめちゃめちゃわかりやすいので是非参考にしてください。
日本語フォントの表示
Python側コードのマーカーが引いてある部分は、日本語フォントを使用するための設定です。
その前に、日本語用のフォントをインストールします。今回はTakaoフォントをインストールします。
|
1 2 3 4 |
# Takaoフォントのインストール sudo apt-get install fonts-takao # インストールされた場所を確認します。 fc-list | grep takao |
お好きなタイプのパスをコピーして、Pythonコード内に追加して下さい。
タッチパネルが反応しないときの対処法
クリックでは反応するけど、タッチでは反応しない....
というトラブルが発生しましたので色々調べて、解決方法を見つけました！
以下の方法で試してみてください！
①ディスプレイ環境の設定
|
1 |
KIVY_BCM_DISPMANX_ID=2 python3 main.py |
ID=〇のところの数字を0~6まで変更しながらPythonファイルを実行してみてください。
数字の意味については公式ドキュメントに書いてあります。
私の場合、それでもできませんでしたので、次の方法で実行しました。
②ラズパイモニター用の設定
私の使用しているディスプレイはラズパイ用だったようです。（公式ではないですが）
以下の設定を行います。まず、nanoテキストを開きます。
|
1 |
sudo nano ~/.kivy/config.ini |
様々なことが書いてあるエディタが開くはずです。[input]と書いてある部分を以下のように書き換えてしまってください。そうするとタッチできるようになるはずです！
|
1 2 3 |
mouse = mouse mtdev_%(name)s = probesysfs,provider=mtdev hid_%(name)s = probesysfs,provider=hidinput |
こちら参考にしました。
今回はここまでです。次回は画像を表示させていきます！