Kivy レイアウトの中に別のレイアウトを作る（Python Kivyの取説・使い方第５回）

レイアウトの中に別のレイアウトを作る方法

KivyのチュートリアルにあるPong Gameを参考にしていきます。

レイアウトの中に別のレイアウトで「Pong Game」ぽいのを作っていきます。

前回のプログラムを少し変更します。

# フル画面を解除して画面の幅と高さを設定
from kivy.config import Config
Config.set('graphics', 'fullscreen', 0)
Config.set('graphics', 'width', 320)
Config.set('graphics', 'height', 568)
Config.set('graphics', 'resizable', 0)

from kivy.app import App
from kivy.uix.boxlayout import BoxLayout
from kivy.uix.widget import Widget  # 追加部分
#from kivy.uix.button import Label  # 削除部分
#from kivy.uix.button import Button  # 削除部分


class MainScreen(BoxLayout):
    pass

class CustomLayout(Widget):
    pass

class TestApp(App):
    def build(self):
        self.title = 'テスト'
        return MainScreen()

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

kvファイル（test.kv）の、<CustomLayout>:の部分が「Pong Game」のレイアウトです。

<MainScreen>:
    BoxLayout:
        orientation: "vertical"

        BoxLayout:
            Button:
                size_hint_x: 0.2
                text: "1"
            Label:
                size_hint_x: 0.6
                text: "today"
            Button:
                size_hint_x: 0.2
                text: "2"

        CustomLayout:
            size_hint_y: 10

        BoxLayout:
            Button:
                text: "3"
            Button:
                text: "4"
            Button:
                text: "5"

<CustomLayout>:
    canvas:
        Rectangle:
            #pos: self.center_x - 5, 0
            pos: self.center_x - 5, self.y
            size: 10, self.height 

    Label:
        font_size: 70  
        center_x: root.width / 4
        top: root.top - 50
        text: "0"

    Label:
        font_size: 70  
        center_x: root.width * 3 / 4
        top: root.top - 50
        text: "0"