Flet 시작하기

Flet 시리즈 글은 Flet 공식 사이트의 Docs(flet.dev/docs)를 정리한 것이다.
Flet은 파이썬 프레임워크로 웹, 데스크탑, 모바일앱을 만들수 있다. 다음은 간단한 예제인데, [+] 버튼을 클릭하면 텍스트상자의 숫자가 증가하고 [-]버튼을 클릭하면 텍스트상자의 숫자가 감소하는 앱이다.

# counter.py
import flet as ft

def main(page: ft.Page):
    page.title = "Flet counter example"
    page.vertical_alignment = ft.MainAxisAlignment.CENTER

    txt_number = ft.TextField(value="0", text_align=ft.TextAlign.RIGHT, width=100)

    def minus_click(e):
        txt_number.value = str(int(txt_number.value) - 1)
        page.update()

    def plus_click(e):
        txt_number.value = str(int(txt_number.value) + 1)
        page.update()

    page.add(
        ft.Row(
            [
                ft.IconButton(ft.icons.REMOVE, on_click=minus_click),
                txt_number,
                ft.IconButton(ft.icons.ADD, on_click=plus_click),
            ],
            alignment=ft.MainAxisAlignment.CENTER,
        )
    )

ft.app(target=main)

Flet은 다음과 같이 설치한다.

pip install flet

위의 counter.py를 다음과 같이 실행할 수 있다.

python counter.py

위의 코드는 데스크탑앱으로 만들어진 것인데, 웹용으로 바꾸고 싶다면 마지막 행을 다음과 같이 변경한다.

ft.app(target=main, view=ft.AppView.WEB_BROWSER)