Flet 타이머

이 프로그램은 Flet 라이브러리를 사용하여 스톱워치 UI를 구현하고, 파이썬의 스레딩을 활용하여 타이머의 시간이 실시간으로 업데이트되도록 만듭니다. 사용자는 시작과 중지 버튼을 통해 스톱워치를 제어할 수 있으며, 시간은 시:분:초.밀리초 형식으로 정확하게 표시됩니다.

코드의 실행 과정

1. 초기화: 프로그램이 실행되면 StopwatchApp 클래스의 인스턴스가 생성됩니다.
2. UI 설정: run() 메서드를 호출하여 Flet 앱을 시작하고, main() 함수에서 UI를 설정합니다.
3. 타이머 동작:
   • 사용자가 "시작" 버튼을 클릭하면 타이머가 시작됩니다. 시간이 10밀리초마다 업데이트되어 화면에 표시됩니다.
   • "중지" 버튼을 클릭하면 타이머가 멈추고, 다시 클릭하면 타이머가 초기화된 상태로 대기합니다.

 

import flet as ft
import time
from threading import Thread

class StopwatchApp:
    def __init__(self):
        self.is_running = False
        self.start_time = 0
        self.elapsed_time = 0

    def main(self, page: ft.Page):
        self.page = page
        page.title = "스탑워치"
        page.theme_mode = ft.ThemeMode.DARK

        page.horizontal_alignment = ft.CrossAxisAlignment.CENTER
        page.vertical_alignment = ft.MainAxisAlignment.CENTER

        self.time_display = ft.Text(value="00:00:00.000", size=100)
        self.start_stop_button = ft.ElevatedButton(
            text="시작", on_click=self.start_stop_handler
        )

        page.add(
            ft.Column(
                controls=[self.time_display, self.start_stop_button],
                alignment=ft.MainAxisAlignment.CENTER,
                horizontal_alignment=ft.CrossAxisAlignment.CENTER,
            )
        )

    def start_stop_handler(self, e):
        if not self.is_running:
            if self.elapsed_time == 0:
                self.start_time = time.time()
            else:
                self.start_time = time.time() - self.elapsed_time
            self.is_running = True
            self.start_stop_button.text = "중지"
            Thread(target=self.update_time).start()
        else:
            self.is_running = False
            self.start_stop_button.text = "시작"
            if self.elapsed_time != 0:
                self.elapsed_time = 0
        self.page.update()

    def update_time(self):
        while self.is_running:
            self.elapsed_time = time.time() - self.start_time
            minutes, seconds = divmod(int(self.elapsed_time), 60)
            hours, minutes = divmod(minutes, 60)
            milliseconds = int((self.elapsed_time - int(self.elapsed_time)) * 1000)
            self.time_display.value = f"{hours:02}:{minutes:02}:{seconds:02}.{milliseconds:03}"
            time.sleep(0.01)
            self.page.update()

    def run(self):
        ft.app(target=self.main)

if __name__ == "__main__":
    stopwatch = StopwatchApp()
    stopwatch.run()

 

이 프로그램은 파이썬의 Flet 라이브러리를 사용하여 GUI 기반의 스톱워치를 구현한 코드입니다. 전체적인 프로그램의 작동 방식과 각 주요 함수들의 역할을 단계적으로 설명하겠습니다.

728x90

주요 구성 요소

라이브러리 임포트

• flet as ft: Flet은 파이썬으로 웹 및 데스크톱용 GUI를 만드는 라이브러리입니다. 이 코드에서는 이를 사용하여 버튼, 텍스트 등 인터페이스를 만들고 제어합니다.
• time: 시간을 측정하기 위해 Python 표준 라이브러리인 time을 사용합니다.
• Thread: 타이머를 업데이트하는 작업을 별도의 스레드에서 실행하기 위해 Thread 모듈을 사용합니다. 이는 타이머가 동시에 계속 진행될 수 있도록 합니다.

클래스 정의 (StopwatchApp)

• StopwatchApp은 스톱워치 애플리케이션의 전체 로직을 관리하는 클래스입니다.

클래스의 주요 속성

• self.is_running: 스톱워치의 상태를 나타내는 불리언 변수입니다. 타이머가 실행 중인지 여부를 추적합니다.
• self.start_time: 스톱워치를 시작한 시점의 시간을 저장합니다.
• self.elapsed_time: 타이머의 경과 시간을 기록합니다. 이를 통해 타이머를 중지하고 다시 시작할 때도 올바른 시간 계산이 가능합니다.

주요 메서드 설명

__init__(self):

• 클래스의 생성자로, 스톱워치의 초기 상태를 설정합니다. 초기에는 스톱워치가 멈춘 상태 (is_running = False)이며, start_time과 elapsed_time 모두 0으로 설정됩니다.

main(self, page: ft.Page):

• 이 메서드는 Flet에서 UI를 설정하는 메인 진입점 역할을 합니다. Flet에서 페이지를 정의하고 구성 요소를 배치합니다.
• 페이지 설정:
  • page.title: 페이지의 제목을 설정합니다 ("스탑워치").
  • page.horizontal_alignment 및 page.vertical_alignment: 페이지의 수평 및 수직 정렬을 중앙으로 설정하여 화면에 내용이 가운데에 위치하도록 합니다.
• UI 요소 생성:
  • self.time_display: 시간 표시를 위한 텍스트 위젯으로, 초기 값은 "00:00:00.000"이며 크기는 40입니다.
  • self.start_stop_button: 시작/중지 버튼입니다. 초기 상태는 "시작"이며, 클릭하면 start_stop_handler 메서드가 호출됩니다.
• UI 요소 추가:
  • ft.Column을 사용하여 시간 표시와 버튼을 수직으로 배치합니다. 중앙 정렬을 통해 깔끔하게 가운데에 표시되도록 합니다.

start_stop_handler(self, e):

• 시작 및 중지 버튼이 클릭될 때 호출되는 핸들러 함수입니다.
• 타이머 시작:
  • self.is_running이 False인 경우 타이머를 시작합니다.
  • 만약 이전에 타이머가 멈췄을 때(elapsed_time이 0이 아님)라면, 타이머를 멈췄던 지점부터 다시 시작하기 위해 현재 시간을 재설정합니다.
  • Thread(target=self.update_time).start(): 새로운 스레드를 시작하여 update_time 메서드를 실행합니다. 이를 통해 타이머가 백그라운드에서 계속 실행되도록 합니다.
• 타이머 중지:
  • self.is_running이 True인 경우 타이머를 중지합니다. 버튼 텍스트를 다시 "시작"으로 변경하고 경과 시간을 초기화합니다.
  • 마지막으로 self.page.update()를 호출하여 UI를 업데이트합니다.

update_time(self):

• 타이머가 실행 중일 때 계속해서 호출되는 함수입니다.
• self.elapsed_time을 계산하여 시간, 분, 초, 밀리초 단위로 나눈 후 self.time_display.value에 포맷된 시간 문자열을 설정합니다. 이 문자열은 시:분:초.밀리초 형식으로 표시됩니다.
• time.sleep(0.01)을 사용하여 10밀리초마다 시간을 업데이트합니다. 이 주기로 인해 밀리초 단위의 변화가 자연스럽게 표시됩니다.
• self.page.update()를 호출하여 UI에 새로운 시간이 반영되도록 합니다.

run(self):

• ft.app(target=self.main)을 호출하여 Flet 앱을 실행합니다. 여기서 target=self.main은 앱이 실행될 때 main 메서드를 호출하여 UI를 설정하도록 합니다.

 

Flet 타이머