使用 Flet 更新动态图像帧的正确方法-Python教程-PHP中文网

使用 Flet 更新动态图像帧的正确方法

碧海醫心

发布： 2025-09-14 22:36:01

原创

551人浏览过

使用 flet 更新动态图像帧的正确方法

本文旨在解决在使用 Flet 框架开发应用时，如何实时更新图像帧显示的问题。当图像文件被外部程序修改，且文件名保持不变时，传统的 page.update() 方法可能无法正确刷新 Flet 应用中的图像。本文将介绍一种有效的解决方案，通过重新读取图像文件并将其转换为 base64 编码，从而实现图像的动态更新。

问题分析

在使用 Flet 显示动态图像时，如果图像文件在外部被修改（例如，被另一个程序覆盖），但文件名保持不变，直接使用 ft.Image 组件和 page.update() 方法可能无法正确更新图像显示。这是因为 Flet 可能会缓存图像，导致即使文件内容已更改，显示的仍然是旧版本的图像。

解决方案

解决此问题的关键在于强制 Flet 重新读取图像文件。一种有效的方法是将图像转换为 base64 编码，然后将 base64 字符串作为 src_base64 属性传递给 ft.Image 组件。每次需要更新图像时，重新读取图像文件，将其转换为 base64 编码，并更新 ft.Image 组件的 src_base64 属性。

图像转图像AI

利用AI轻松变形、风格化和重绘任何图像

查看详情

以下是具体步骤和代码示例：

导入必要的库:

import numpy as np
import base64
import flet as ft
from flet import Image
from io import BytesIO
from PIL import Image as image

登录后复制

读取图像文件并转换为 base64 编码:

image_path = r"Python\plate_0.jpg"  # 图像文件路径
pil_photo = image.open(image_path)  # 使用 Pillow 打开图像
arr = np.asarray(pil_photo)  # 将图像转换为 NumPy 数组
pil_img = image.fromarray(arr)  # 再次将 NumPy 数组转换为图像对象
buff = BytesIO()  # 创建一个内存缓冲区
pil_img.save(buff, format="JPEG")  # 将图像保存到缓冲区，格式为 JPEG
image_string = base64.b64encode(buff.getvalue()).decode('utf-8')  # 将缓冲区内容编码为 base64 字符串

登录后复制

创建 ft.Image 组件并使用 base64 字符串初始化:

image1 = Image(src_base64=image_string)  # 创建 ft.Image 组件，并使用 base64 字符串初始化

登录后复制

创建更新图像的函数:

def updateTest(value):
    image_path = r"Python\plate_0.jpg"  # 重新读取图像文件路径

    pil_photo = image.open(image_path)  # 使用 Pillow 打开图像
    arr = np.asarray(pil_photo)  # 将图像转换为 NumPy 数组
    pil_img = image.fromarray(arr)  # 再次将 NumPy 数组转换为图像对象
    buff = BytesIO()  # 创建一个内存缓冲区
    pil_img.save(buff, format="JPEG")  # 将图像保存到缓冲区，格式为 JPEG

    newstring = base64.b64encode(buff.getvalue()).decode("utf-8")  # 将缓冲区内容编码为 base64 字符串
    image1.src_base64 = newstring  # 更新 ft.Image 组件的 src_base64 属性

    image1.update()  # 更新 ft.Image 组件

登录后复制

在 Flet 应用中使用 ft.Image 组件和更新函数:

def main(page=ft.Page):
    page.window_width = 375
    page.window_height = 300

    image_path = r"Python\plate_0.jpg" # First Reachable Path
    pil_photo = image.open(image_path) # Pillow Opens the Image
    arr = np.asarray(pil_photo) # Numpy transforms it into an array

    pil_img = image.fromarray(arr) # Then you convert it in an image again
    buff = BytesIO() # Buffer
    pil_img.save(buff, format="JPEG") # Save it
    image_string = base64.b64encode(buff.getvalue()).decode('utf-8')
    image1 = Image(src_base64=image_string)

    def updateTest(value):
        image_path = r"Python\plate_0.jpg" # Read the path again

        pil_photo = image.open(image_path)

        arr = np.asarray(pil_photo)
        pil_img = image.fromarray(arr)
        buff = BytesIO()
        pil_img.save(buff, format="JPEG")

        newstring = base64.b64encode(buff.getvalue()).decode("utf-8")
        image1.src_base64 = newstring

        image1.update() # "Voí'la"

    page.add(
        ft.Row(controls=[
            image1
        ], alignment='center'),
        ft.Row(controls=[
            ft.TextButton("Test", on_click=updateTest)
        ], alignment='center')
    )

ft.app(target=main)

登录后复制

注意事项

确保安装了必要的库：flet, Pillow, numpy。可以使用 pip install flet Pillow numpy 命令进行安装。
图像文件路径 (image_path) 必须正确。
频繁更新图像可能会影响性能。可以考虑使用线程或异步任务来更新图像，以避免阻塞 UI 线程。
如果图像文件非常大，转换为 base64 编码可能会占用大量内存。可以考虑使用其他方法，例如将图像文件保存到临时文件，然后使用 src 属性指定临时文件的路径。