kivy 스터디 017. Widget - BoxLayout

Widget - BoxLayout

BoxLayout 위젯은 출력 창에 그려지는 Children 위젯의 크기와 위치를 제어할 수 있는 위젯으로 Layout에 속한다.

 

BoxLayout 위젯은 BoxLayout 위젯에 속하는 Children 위젯을 수평 또는 수직으로 배치하고자 할 때 사용할 수 있다.

 

아래의 <코드 1>은 3개의 Button 위젯을 BoxLayout 위젯에 수평으로 배치하는 예이다.

 

<코드 1>

import kivy
kivy.require('2.0.0')

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

class MyRootWidget(BoxLayout):
    def __init__(self, **kwargs):
        BoxLayout.__init__(self, **kwargs)
        self.add_widget(Button(text='Button'))
        self.add_widget(Button(text='Button'))
        self.add_widget(Button(text='Button'))

class MyApp(App):
    def build(self):
        self.title = 'My App'
        return MyRootWidget()

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

 

 

BoxLayout 위젯의 orientation 프라퍼티는 Children 위젯을 수평으로 배치할지 수직으로 배치할지를 결정하는 데 사용한다. orientation 프라퍼티의 기본 설정값은 'horizontal'이다.

 

orientation = OptionProperty('horizontal', options=('horizontal', 'vertical'))

 

아래의 <코드 2>는 3개의 Button 위젯을 BoxLayout 위젯에 수직으로 배치하는 예이다.

 

<코드 2>

import kivy
kivy.require('2.0.0')

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

class MyRootWidget(BoxLayout):
    def __init__(self, **kwargs):
        BoxLayout.__init__(self, **kwargs)
        self.orientation = 'vertical'
        for n in range(1, 4):
            self.add_widget(Button(text='Button'))

class MyApp(App):
    def build(self):
        self.title = 'My App'
        return MyRootWidget()

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

 

 

Children 위젯을 BoxLayout에 추가할 때 size_hint 프라퍼티를 설정해 Children의 크기를 조절할 수 있다. size_hint로 설정하는 값은 0-1의 범위를 갖는다.

 

아래의 <코드 3>은 Button 위젯의 size_hint 프라퍼티로 BoxLayout에 그려지는 Button의 크기를 상대적 크기 또는 절대적 크기로 설정하는 예이다.

 

<코드 3>

import kivy
kivy.require('2.0.0')

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

class MyRootWidget(BoxLayout):
    def __init__(self, **kwargs):
        BoxLayout.__init__(self, **kwargs)
        self.add_widget(Button(text='Button', size_hint=(0.5, 0.25)))
        self.add_widget(Button(text='Button', size_hint=(0.75, None)))
        self.add_widget(Button(text='Button', size_hint=(1, 0.5)))
        self.add_widget(Button(text='Button', size_hint=(0.5, 1)))

class MyApp(App):
    def build(self):
        self.title = 'My App'
        return MyRootWidget()

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

 

 

Button 위젯의 size_hint 프라퍼티 타입은 ReferenceListProperty이다.

 

size_hint = ReferenceListProperty(size_hint_x, size_hint_y)

 

위의 <코드 3>에서 두번째로 추가한 Button 위젯의 size_hint_y의 값은 None으로 절대적인 크기를 의미한다.

 

self.add_widget(Button(text='Button', size_hint=(0.75, None)))

 

위의 <코드 3>을 실행해 만들어진 애플리케이션의 창 크기를 줄이면 3개의 Button 크기는 애플리케이션 창의 크기에 따라 변하지만, 두번째 Button의 세로(y) 크기는 변하지 않음을 확인할 수 있다. 물론 두번째 Button도 가로(x)의 크기는 애플리케이션 창의 크기 변화에 따라 바뀐다.

 

 

 

BoxLayout 위젯의 padding 및 spacing 프라퍼티로 출력 창에 그려지는 위젯의 간격을 제어할 수 있다.

 

아래의 <코드 4>는 BoxLayout 위젯의 padding 및 spacing 프라퍼티를 사용한 예이다.

 

<코드 4>

import kivy
kivy.require('2.0.0')

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

class MyRootWidget(BoxLayout):
    def __init__(self, **kwargs):
        BoxLayout.__init__(self, **kwargs)

        self.padding = 20
        self.spacing = 5

        for i in range(5):
            self.add_widget(Button(text=f'Button {i}'))

class MyApp(App):
    def build(self):
        self.title = 'My App'
        return MyRootWidget()

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