見出し画像

stable-diffusion-webui拡張機能(extension) 開発入門【AUTOMATIC1111】


前提

  • AUTOMATIC1111/stable-diffusion-webuiを利用している

  • AUTOMATIC1111/stable-diffusion-webuiの拡張機能を利用している

  • コードの読み書きがある程度可能である

(以下AUTOMATIC1111/stable-diffusion-webuiをwebuiと略します)

拡張機能(extension)とは

webuiの拡張機能とは、第三者がwebuiに追加の機能を加えるための基盤です
ControlNetやcutoffなどの便利な機能も、この拡張機能を利用して提供されています

おなじみのtxt2imgオプション

拡張機能の仕組み

webuiは、Gradioという機械学習モデルの実行に特化したWebアプリケーションのフレークワークに、更に一つ上のレイヤーとして実装されています
そのため、拡張機能は、そのwebui上で動的にPython/Gradioのコードを実行することで実現します
また、拡張機能の配布はGitHubベースで行われていて、任意のrepositoryのURLを指定してinstallする形です

extensionインストール画面

拡張機能の作り方

1. ベースのフォルダを作成

stable-diffusion-webui/extensions/${作りたい拡張機能の名前} でフォルダを作成

2. スクリプト用のフォルダを作成

stable-diffusion-webui/extensions/${作りたい拡張機能の名前}/scripts フォルダを作成

3. 拡張機能の本体を作成

scripts/extension.py を作成して以下のコードを書く

import modules.scripts as scripts
import gradio as gr
import os

from modules import script_callbacks

# コンポーネントを作成
def on_ui_tabs():
    with gr.Blocks(analytics_enabled=False) as ui_component:
        with gr.Row():
            angle = gr.Slider(
                minimum=0.0,
                maximum=360.0,
                step=1,
                value=0,
                label="Angle"
            )
            checkbox = gr.Checkbox(
                False,
                label="Checkbox"
            )
            # TODO: ここにコンポーネント/処理を足していく (cf. https://gradio.app/docs/#components)
        return [(ui_component, "$Your Extension Name", "extension_template_tab")]

# 作成したコンポーネントをwebuiに登録
script_callbacks.on_ui_tabs(on_ui_tabs)

4. 書いたコードを反映

webuiの画面下にあるReload UIボタンで書いたコードを反映
webuiのタブに拡張機能の名前が追加されます

上記のコードで追加されるUI


これ以降、コードを書く -> Reload UI の繰り返しが、開発の基本になります

5. 作りたい機能を実装

任意の作りたい機能を実装
(Python/Gradioに不慣れな方は、UIを適当に足してみる、pytorchのバージョンを表示する機能を作る、などで一通り流れを掴むのがおすすめです)

以下はチェックを入れてボタンを押すと特定のURLの画像をwebui上で表示する例:

実際の動作画面
import modules.scripts as scripts
import gradio as gr
import os

from modules import script_callbacks


def on_ui_tabs():
    with gr.Blocks(analytics_enabled=False) as ui_component:
        with gr.Row():
            checkbox = gr.Checkbox(
                True,
                label="Show image"
            )
            btn = gr.Button(
                "Dummy image"
            ).style(
                full_width=False
            )
        with gr.Row():
            gallery = gr.Gallery(
                label="Dummy Image",
                show_label=False,
            )

        btn.click(
            dummy_images,
            inputs = [checkbox],
            outputs = [gallery],
        )

        return [(ui_component, "Extension Example", "extension_example_tab")]

def dummy_images(checkbox):
    if (checkbox):
        return [
            "https://chichi-pui.imgix.net/uploads/post_images/eee3b614-f126-4045-b53d-8bf38b98841d/05aba7f3-208b-4912-92f3-32d1bfc2edc3_1200x.jpeg?auto=format&lossless=0"
        ]
    else:
        return []

script_callbacks.on_ui_tabs(on_ui_tabs)

6. 拡張機能を公開

GitHubで ${ユーザーネーム}/${作りたい拡張機能の名前}/ のrepositoryを作成

git remote add origin git@github.com:${ユーザーネーム}/${作りたい拡張機能の名前}.git
git push origin main

資料


いいなと思ったら応援しよう!