🐙

fletでプログレスバーを実装してみよう!!

2023/12/04に公開

flet

https://flet.dev/
Flutterで構築されたPythonのGUIフレームワークです。

こんなものが作れます。

プログレスバー

処理中であること、進捗をユーザーに視覚的にわかりやすく伝えることができる要素です。
ダウンロード処理や長い処理をする際には必須と言えるでしょう。
さて、fletでのプログレスバーの実装は非常に簡単です。

import flet as ft

def main(page:ft.Page):
    page.title = "プログレスバーのデモ"
    # 要素の定義
    progress_bar = ft.ProgressBar()
    # ページに追加
    page.add(progress_bar)

ft.app(main)

これを実行すると…

永久にクルクルするプログレスバーが表示されます。

数値を入れる

処理の進捗はパーセント表示が多いはずです。プログレスバーにその値を入れてみましょう。
fletのプログレスバーは0から1の間で値が変わります。なので0から100のものは0.01倍しないといけません。
とりあえず次のようなコードを書いてみました。

import flet as ft
import time

def main(page:ft.Page):
    page.title = "プログレスバーのデモ"
    
    # 要素の定義
    progress_bar = ft.ProgressBar(value=0)
    # ページに追加
    page.add(progress_bar)
    # 徐々に値を増やすよ
    for i in range(0, 101):
        progress_bar.value = i*0.01
        progress_bar.update()
        time.sleep(0.8)

ft.app(main)

これを実行すると…

徐々に伸びていくことが確認できると思います。
とりあえず、0.01倍することをわすれずに!!(あと.update()もわすれずに!)

以上

以上です。プログレスバーを付けていい感じにしてください!

Discussion