El ProgressBar en Flet sirve para ver el avance o progreso de ciertas tareas mediante una barra que va creciendo segun el avance.
Para este ejemplo tenemos un componente Texto, ProgressBar y un Boton para iniciar el progreso.
El componente ProgressBar es esencial para informar al usuario sobre el avance de tareas en segundo plano, como descargas, procesamientos de datos o cargas de archivos. En este tutorial, aprenderemos a implementar una barra de progreso funcional y dinámica.
¿Cómo funciona el ProgressBar?
A diferencia de otros sistemas que usan porcentajes de 0 a 100, el ProgressBar de Flet trabaja con valores decimales entre 0.0 y 1.0.
- 0.0 representa el 0%.
- 0.5 representa el 50%.
- 1.0 representa el 100%.
La ventana contiene 3 componentes, un titulo, el componente progressbar y un boton que dice iniciar , al darle click al boton inicia un progreso que va a ir actualizando el valor del progressbar de 0 a 100. Aunque enrealidad el progressbar acepta valores de 0 a 1, por lo que los valores deben ser decimales.
Codigo
A continuacion el codigo, contiene comentarios para hacerlo mas entendible
from time import sleep
import flet as ft
# Funcion principal
def main(page: ft.Page):
# Funcion que se ejecutara cuando se clickee el boton
def iniciar(e):
for i in range(0,101): # rango de 0 a 101
pb.value = i *0.01 # Asignamos el valor al progressbar
txt.value = (f"Progreso: {i}%") # Asignamos el valor del progreso a la etiqueta para mostrar el valor
sleep(0.1) # Esperamos o dormimos 0.1 segundo
page.update() # Actualizamos
pb = ft.ProgressBar() # Definimos el progressbar
btn = ft.ElevatedButton("Iniciar",on_click=iniciar) # Definimos el boton de inicial
txt = ft.Text("Progreso: 0%") # Definimos la etiqueta de progreso
# Agregamos todos los elementos a la pagina, segun el orden que los agreguemos asi se van a mostrar
page.add(
ft.Text("Como usar un Progress Bar",style="headlineSmall"),
ft.Column(
[txt,
pb]
),
btn
)
# Iniciamos la aplicacion flet y le pasamos la funcion main como parametro
ft.app(target=main)Solo tendremos que Guardar el script, ejecutar con Python y listo.
py progressbar_flet1.pyAprende mas sobre Flet
Aprende como usar otros componentes sobre Python y Flet.