# 使用 FLET 和 PYTHON 建立影像產生器

介紹

你們好，軟體開發人員？ ‍？ ，這裡是 Arsey？ ，

抱歉更新晚了，我是一名學生，正在處理一些個人項目，但從現在開始我會繼續為您提供更新。

所以在我的上一篇教程中有人評論說我們是否可以在 kivy 和 flet 等 python 框架中使用 GenAI，我的答案是肯定的，你可以用它們構建 GenAI 應用程序。它可能不是最具可擴展性的框架，但對於使用這些框架的副項目來說，這是一個安靜的選擇。

在本教程中，我們將使用 flet 和名為 Flux.dev 的圖像生成模型在 Python 中建立一個簡單的圖像生成器應用程式。

由於flux是一個強大的圖像生成器模型，它需要很高的計算能力才能在您的機器上運行，我的機器就那麼強大，所以在這裡我們將使用replicate，這個平台將為我們提供flux的API端點，以便我們集中精力在使用者體驗上，影像產生將由API 處理，因此不會出現系統崩潰或滯後的情況，儘管您可以使用Huggingsface，它也具有Flux API，但接下來我們將使用複製。還等什麼，讓我們開始吧。

先決條件

在我們開始建立我們的應用程式之前，我建議您了解python 基礎知識，例如函數和一些oop 概念，並確保您的系統中安裝了必要的軟體包，我們將使用以下軟體包：

• flet 用於建立使用者介面，對於不了解 Flet 的人。 Flet 是一個基於 flutter 的 python 函式庫，flutter 是最受歡迎的行動框架之一。 Flet 使我們能夠即時建立快速、美觀的使用者介面，並且可以跨平台運行。

• replicate Replicate 是一個平台即服務 (PAAS)，該平台將為我們提供預製模型，我們無需安裝即可使用它們。我在這裡的意思是，複製將提供我們將從應用程式存取的 API 端點。 Replicate 將在雲端處理請求和回應，讓您無需擔心就可以專注於應用程式的功能。

• 對 API 端點的請求，我們將能夠在此處發送請求並接收來自複製的回應。

• 哦，即使是檔案管理作業系統，這也將允許我們將映像保存在本機系統上。

項目設定（環境設定）

安裝所需的軟體包，

pip install flet 複製請求

安裝完成後，就可以開始使用你的鍵盤了；您需要從這裡建立一個具有複製功能的帳戶建立複製帳戶，確保使用您的 GitHub 憑證進行驗證和授權。

建立帳戶後，您現在將被重定向到複製儀表板，在這裡您將能夠看到不同的模型，但在本教程中我們將使用 Flux.dev。找到並使用 Flux.dev 模型，選擇任何其他模型也可以工作。

提醒安裝複製以便能夠使用他們的 API。全部完成，然後前往複製並建立 API 令牌，這將設定從複製到我們的客戶端應用程式的端點。

注意：開發版本不用於生產或商業目的，請注意，您使用免費版本模型的代幣有限，所以不要興奮並生成隨機圖像或否則您將失去所有免費積分。

現在我們在哪裡，哦，好吧，我想到目前為止您已經完成了所有設置，讓我們去使用他們的 API。

建構使用者介面

首先我們將建立使用者介面，在本部分結束時，您將擁有一個模擬 UI，現在就準備好，打開您最喜歡的 IDE/程式碼編輯器並輸入此程式碼。

import os
import flet as ft
import replicate
import requests

# Set the Replicate API token in the environment
os.environ["REPLICATE_API_TOKEN"] = "YOUR_API_TOKEN"

# Function to interact with Replicate API for image generation
def generate_image(prompt):
    pass

# Function to save the image locally
def save_image(image_url, filename="generated_image.webp"):
    pass

# Main function to define the Flet app
def main(page: ft.Page):
    page.title = "ArseyGen"
    page.horizontal_alignment = 'center'
    page.scroll = ft.ScrollMode.AUTO
    page.theme_mode = ft.ThemeMode.DARK

    page.appbar = ft.AppBar(
        title=ft.Text("REPLICATE IMAGE GENERATOR"), center_title=True
    )

    # Placeholder image to avoid missing src error
    result_image = ft.Image(
        src="https://via.placeholder.com/512", width=512, height=512
        )

    # Define the save button (initially disabled)
    save_image_button = ft.ElevatedButton(text="Save Image", disabled=True)

    # Function to handle image generation
    def generate_and_display_image(e):
        pass

    prompt_input = ft.TextField(label="Enter a text prompt")
    generate_button = ft.ElevatedButton(
        text="Generate Image", on_click=generate_and_display_image
        )

    # Add components to the page
    page.add(
        ft.SafeArea(
            content=ft.Column(
                [
                    prompt_input,
                    generate_button, result_image,
                    save_image_button,
                ],
                horizontal_alignment=ft.CrossAxisAlignment.CENTER
            )
        )
    )

# Run the Flet app
if __name__ == '__main__':
    ft.app(target=main)

輸出
這一步你會得到這樣的東西，

程式碼說明

這就是我們所做的，我們首先導入所需的模組。
然後我們設定複製提供的 api_token。
然後在這裡我們設定稍後將使用的佔位符函數，我們使用了 pass 語句
忽略他們。

主函數然後描述並建立我們的UI，在這裡我們設定頁面標題，對齊方式，
捲動行為，使我們的頁面可捲動。其餘的是 UI 元素，如您所見，我們有 AppBar、Image，它允許我們在 UI 中顯示圖像，最後我們
新增TextField來捕捉使用者的提示；產生和儲存按鈕分別用於處理影像產生和儲存。

最後我們將元件加入頁面，注意我們使用了 SafeArea，這將幫助我們提供足夠的填充並避免作業系統的入侵，在我們的例子中它將縮排
Column 小工具可以避免 AppBar 進行插值，至於 Column 小工具，讓我們在垂直陣列中顯示 UI 元素。

整合複製

我能感受到你的興奮，這是最關鍵的一步，所以請確保你沒有犯任何錯誤，否則你將最終破壞程式碼，並最終進行調試，哦，調試是一項很好的技能，因為我花了2天時間才完成修復ui 和3days 來調試我有無效令牌的api 端點。

令人沮喪的是，所以如果您在嘗試調試並查看結果的過程中遇到任何錯誤/錯誤，我會盡力幫助您，所以提出問題可能是我或其他開發人員會提供幫助。

好吧，現在讓我們整合模型，前往 Flux.dev 進行複製等。
複製提供的程式碼，我們將對其進行一些更改，好嗎！完成。

更新generate_image函數，使其看起來像這樣，

import os
import flet as ft
import replicate
import requests

# Set the Replicate API token in the environment
os.environ["REPLICATE_API_TOKEN"] = "YOUR_API_TOKEN"

# Function to interact with Replicate API for image generation
def generate_image(prompt):
    pass

# Function to save the image locally
def save_image(image_url, filename="generated_image.webp"):
    pass

# Main function to define the Flet app
def main(page: ft.Page):
    page.title = "ArseyGen"
    page.horizontal_alignment = 'center'
    page.scroll = ft.ScrollMode.AUTO
    page.theme_mode = ft.ThemeMode.DARK

    page.appbar = ft.AppBar(
        title=ft.Text("REPLICATE IMAGE GENERATOR"), center_title=True
    )

    # Placeholder image to avoid missing src error
    result_image = ft.Image(
        src="https://via.placeholder.com/512", width=512, height=512
        )

    # Define the save button (initially disabled)
    save_image_button = ft.ElevatedButton(text="Save Image", disabled=True)

    # Function to handle image generation
    def generate_and_display_image(e):
        pass

    prompt_input = ft.TextField(label="Enter a text prompt")
    generate_button = ft.ElevatedButton(
        text="Generate Image", on_click=generate_and_display_image
        )

    # Add components to the page
    page.add(
        ft.SafeArea(
            content=ft.Column(
                [
                    prompt_input,
                    generate_button, result_image,
                    save_image_button,
                ],
                horizontal_alignment=ft.CrossAxisAlignment.CENTER
            )
        )
    )

# Run the Flet app
if __name__ == '__main__':
    ft.app(target=main)

這個函數的作用是，它與 Replicate API 交互，根據使用者提供的文字提示產生圖像。
然後它發送提示和其他模型參數
到 API 並傳回產生圖像的 URL，如果出現問題，它會透過傳回 None 來處理錯誤。

貼上從複製複製的 API 令牌。所以它看起來像這樣，

os.environ["REPLICATE_API_TOKEN"]="r8_KhysOWTKUjRsagyyyLNIWvvg2K78qrE48RwTh"

確保您擁有令牌，您可以透過此處取得您的 api 令牌來取得您的 API 令牌

應用產生和顯示影像功能

完成後，我們也可以更新generate_and_display_image函數，在下面輸入此程式碼，

 def generate_image(prompt):
    try:
        # Make the API call to Replicate to generate an image
        output = replicate.run(
            "bingbangboom-lab/flux-dreamscape:b761fa16918356ee07f31fad9b0d41d8919b9ff08f999e2d298a5a35b672f47e",
            # "black-forest-labs/flux-dev",
            input={
                "model": "dev",
                "prompt": prompt,
                "lora_scale": 1,
                "num_outputs": 1,
                "aspect_ratio": "1:1",
                "output_format": "webp",
                "guidance_scale": 3.5,
                "output_quality": 80,
                "prompt_strength": 0.8,
                "extra_lora_scale": 0.8,
                "num_inference_steps": 28
            }
        )
        # Return the generated image URL
        return output[0]
    except Exception as e:
        print(f"Error: {e}")
        return None

此時，當您執行應用程式時，請嘗試輸入提示並點擊生成按鈕，您將看到一個進度條，幾秒鐘內您將在 UI 中看到生成的圖像。請記住不要過度生成，否則您將失去您的積分。我向你保證這不會很有趣。

代碼說明

此函數管理在我們的應用程式中產生和顯示影像的工作流程。它需要使用者的提示，呼叫generate_image()來
產生 image_url 並使用 result_image 更新應用程式 UI。如果該程序失敗，則會顯示錯誤對話方塊。並且在影像成功生成後啟用“儲存影像”按鈕。

應用 save_image 函數

累了已經節省你的精力了，喝點咖啡並完成項目，因為我們現在要添加節省功能。

到目前為止，我們已經有了基本的用戶界面，我們現在可以成功生成圖像，但是我們有一個問題，如果我們想將圖像保存在我們的系統上怎麼辦，因為現在我們當前的應用程序剛剛生成並且......
完成了，為了解決這個問題我們必須新增保存功能。

因此，在您的程式碼中更新 save_image 函數，使其看起來像這樣：

def generate_and_display_image(e):
        prompt = prompt_input.value
        if prompt:
            page.splash = ft.ProgressBar()  # Display progress bar while generating image
            page.update()

            # Generate image based on user's prompt
            image_url = generate_image(prompt)
            page.splash = None  # Hide progress bar

            if image_url:
                # Update image source only if we have a valid URL
                result_image.src = image_url
                result_image.update()

                # Enable save button after image is generated
                save_image_button.disabled = False
                save_image_button.update()

                # Define save button's functionality (save the image locally when clicked)
                def save_image_click(e):
                    save_image(image_url, "anime.webp")

                save_image_button.on_click = save_image_click

            else:
                # Display an error message if image generation fails
                page.dialog = ft.AlertDialog(
                    title=ft.Text("Error"),
                    content=ft.Text("Failed to generate image. Please try again."),
                    actions=[
                        ft.TextButton(
                            "OK",
                            on_click=lambda _: page.dialog.close()
                            )
                        ]
                    )

                page.dialog.open = True
                page.update()

代碼解釋

現在我們做了什麼，讓我們來分解一下。
函數允許我們下載並保存generate_image到本機系統。它採用 image_url 和可選的檔案名，透過 HTTP 請求檢索影像數據，並將其寫入檔案。
它確保下載失敗時的錯誤處理。

結論

嗯！就是這樣，開發者們，一個使用 python、flet 和 Flux 的簡單圖像生成器。
從事這個專案很有趣，希望能得到您的幫助。

這是我的最終輸出，

自從參加最近的一次黑客馬拉松以來，我就沒有上傳過，而且我還在為學生和職業人士寫一本書，這是一個令人頭痛的擁抱，因此暫停了一些編程並休息了一段時間。

但是現在我會上傳內容。

感謝您的耐心等待，我會為你們的開發者上傳更多內容。

以上是# 使用 FLET 和 PYTHON 建立影像產生器的詳細內容。更多資訊請關注PHP中文網其他相關文章！