sdfx

其他源碼

1.0.0

下載

SDFX

特點|截圖| SDFX 應用指南 |安裝|跑步

終極無程式碼平台，用於建立和共享具有漂亮 UI 的 AI 應用程式。

加入我們的 Discord Server 社區，獲取最新新聞、視訊教學和演示應用程式。

SDFX 截圖

SDFX 可以為複雜的工作流程建立簡單的使用者介面。 SDFX 應用程式將 Comfy 工作流程與使用者介面結合。描述工作流程的 JSON 豐富了有關應用程式及其作者的額外元信息，以及 UI 元件和節點小部件之間的關聯。

特徵
截圖
SDFX 應用程式 JSON 結構指南
安裝
跑步
已在本機使用 ComfyUI 的使用者的安裝

為什麼？

這個專案最初是為了滿足 A1111（基於表單的 UI）和 ComfyUI（基於圖形節點）的使用者的需求而創建的，這兩個社群具有不同的願景。透過 SDFX，我們的目標是融合兩個世界的優點，同時消除缺點。例如，SDFX 允許創建複雜的圖形（就像在 ComfyUI 上所做的那樣），但疊加了更簡單的高級 UI（例如基於表單的介面，具有令人難以置信的 UI）。因此，理論上，有人可以使用 SDFX 重新創建 A1111 並在線上分享 JSON。

這是一個初稿，還有很多工作要做（主要是即將發布的 App Creator）。有些人對我們失去了信心，甚至稱我們為「蒸汽軟體」。事實上，正如您透過瀏覽原始程式碼所看到的那樣，SDFX 需要大量的工作。它是由一位獨立開發人員製作的，現在團隊正在不斷成長。我們試著把事情做好，只專注於我們最擅長的事情：具有現代前端堆疊的 UI 和產品設計。因此，我們100%依賴Comfy的後端，讓SDFX與ComfyUI完全相容。然而，安裝 ComfyUI 並不是必要的，因為一切都是抽象的。我們也努力簡化安裝過程；在大多數情況下，您只需雙擊 setup.bat / setup.sh 並按照精靈操作即可。

我們希望您會喜歡它，我們很高興與您分享我們的願景和這個儲存庫，希望它能為您的許多貢獻鋪平道路，進一步推動開源人工智慧領域的發展。

特徵

在複雜的工作流程之上建立和共享用戶友好的應用程式
100% 相容於 ComfyUI 及其所有功能
可以與您現有的 Comfy 安裝一起使用（使用我們的 SDFXBridgeForComfy 自訂節點）
LiteGraph 幾乎在打字稿中從頭開始重構
動畫圖片導航
節點書籤和高級圖形搜索
閃電般快速的 UI 實例化和漂亮的高階元件（比 Gradio 快 450 倍）
UI 調試器（目前還處於初級階段）
本機自訂節點管理器（感謝 Dr.Lt.Data）
導出並共享應用程式和模板（群組節點即將導出）
進階基於圖層的影像和蒙版編輯器 (WIP)
進階檢查點選擇器和圖庫
進階輸入影像選擇器
現代且超快速的前端堆疊（vitejs、vuejs、電子）
編譯為本機應用程式（Windows、Linux、Mac）或 Web 應用程式
非常容易維護和添加新功能

截圖

圖表視圖

SDFX 截圖

應用程式視圖

提示時間軸組件

SDFX 截圖

使用者介面偵錯工具

SDFX 截圖

節點書籤

SDFX 截圖

節點管理器

SDFX 截圖

SDFX 應用程式 JSON 結構指南

歡迎使用 SDFX 應用程式的 JSON 結構指南。以下是對希望了解並利用 JSON 格式透過 SDFX 創建用戶友好的 UI 的開發人員的全面概述。我們的目標是確保清晰度和易用性，以便您可以放心地整合和交換 SDFX 應用程式。

SDFX 應用程式的基本 JSON 結構：

{
  "name" : " SDFX Timeline SD15 " ,
  "meta" : {},
  "type" : " sdfx " ,
  "mapping" : {
    "leftpane" : [],
    "mainpane" : [],
    "rightpane" : []
  },
  "version" : 0.4 ,
  "last_node_id" : 287 ,
  "last_link_id" : 569 ,
  "nodes" : [],
  "links" : [],
  "groups" : [],
  "config" : {},
  "extra" : {}
}

應用程式名稱

name ：您指派給應用程式的名稱。

元資訊

meta ：此鍵包含有關您的應用程式的基本詳細信息，例如：

 - ` version ` : "0.4.1"
- ` description ` : "Timeline for SD15"
- ` icon ` : null (This should be updated with a link to a 512x512 image, or a base64 URL)
- ` keywords ` : "timeline, SD15, upscaler, LCM"
- ` author ` : "SDFX"
- ` license ` : "MIT"
- ` url ` : " https://sdfx.ai "

應用程式類型

type ：指定為"sdfx" ，此鍵將應用程式標識為 SDFX 應用程序，同時保持與 ComfyUI 的兼容性。這意味著 SDFX 應用程式可以拖放到 ComfyUI 上，反之亦然。

UI映射結構

mapping ：指定 UI 結構。在映射中，您可能會發現以下結構來描述具有檢查點載入器的 Tab 元件，與 Tailwind CSS 類別完全相容：

{
  "label": "Generation",
  "component": "Tab",
  "class": "p-4 lg : p-8 xl : p-10 overflow-y-scroll",
  "childrin": [
    {
      "component": "div",
      "class": "flex justify-between space-x-4 lg : space-x-8 ",
      "childrin": [
        {
          "label": "Section 1",
          "class": "leftview w-80",
          "component": "div",
          "childrin": [
            {
              "label": "Checkpoint",
              "showLabel": true,
              "type": "control",
              "component": "ModelPicker",
              "target": {
                "nodeId": 4,
                "nodeType": "CheckpointLoaderSimple",
                "widgetNames": [ "ckpt_name" ] ,
                "widgetIdxs": [ 0 ]
              }
            }
          ]
        }
      ]
    }
  ]
}

LiteGraph 按鍵

其餘按鍵是用來描述工作流程的標準 LiteGraph 屬性。

用於映射的 UI 元件

開發人員可以利用一組豐富的 UI 元件來建立使用者介面。以下是可透過 VueJS 和 Tailwind CSS 使用和自訂的可用元件清單：

Button
DragNumber
ImageLoader
Input
ModelPicker
Number
Preview
Prompt
PromptTimeline
Selector
Slider
TextArea
Toggle
BoxDimensions
BoxSeed

此外， div 、 p 、 ul 、 li 、 img 、 iframe 、 video等 HTML 元素可用於豐富使用者介面。

對於佈局和結構設計， SplitPane 、 SplitH 、 SplitV 、 Tab 、 TabBox 、 TabBar和ToggleSettings等元素提供進一步的自訂。

使用 VueJS 和 Tailwind CSS 創建新元件的簡單性是無與倫比的，可以實現快速開發和高品質的使用者介面設計。隨著 SDFX 走向開源版本，本指南對於期望使用專業且以使用者為中心的平台的開發人員來說將非常寶貴。

享受使用 SDFX 進行創作的樂趣，讓 JSON 結構的簡單性和強大功能增強您的應用程式開發流程。

即將推出的功能：SDFX 應用程式建立器

注意：目前，設計 SDFX 應用程式並將 UI 元件對應到節點參數的過程是手動的。我們了解其中的複雜性，並很高興地宣布 SDFX App Creator 即將發布。

SDFX App Creator 將讓您透過引入具有拖放功能的視覺設計介面來建立 UI 映射。這將大大簡化將 UI 控制項與工作流程圖中對應節點參數連結的過程。請繼續關注此功能。

安裝

確保您的系統符合以下要求：

Node.js 版本 18.9.1
npm 版本 8.19.1
Python 3.11
git

視窗

  git clone https://github.com/sdfxai/sdfx.git
  cd sdfx

然後開啟setup.bat安裝依賴

錯誤提示沒有Python，但已經安裝了？

一個常見的錯誤是在安裝過程中忘記選取將 Python 新增至 PATH 的選項，因為安裝程式精靈中預設通常未選取該選項。確保將 Python 新增至系統的環境變數中，以便順利執行腳本。

SDFX 截圖

Linux/MacO

  git clone https://github.com/sdfxai/sdfx.git
  cd sdfx
  ./setup.sh

手動安裝

點擊展開

若要執行手動安裝，請依照下列步驟操作：

安裝前端相依性：
導覽至 SDFX 的src目錄並安裝 npm 依賴項：
```
 cd src
npm install
cd ..
```
複製並安裝 ComfyUI：
從 ComfyUI GitHub 將 ComfyUI 儲存庫複製到 SDFX 的根目錄中，並依照自述文件中提供的安裝說明安裝 ComfyUI 依賴項。
新增自訂節點 SDFXBridgeForComfyUI
按照自訂節點 SDFXBridgeForComfyUI 儲存庫上的說明將其新增至您的 ComfyUi custom_nodes 資料夾中。
建立設定檔：
在專案的根目錄下建立一個名為sdfx.config.json的檔案。請按照此處提供的說明根據您的要求建立設定檔。
跑步
啟動 ComfyUI 然後啟動 SDFX：
```
  cd src
  npm run start
```

已在本機使用 ComfyUI 的使用者的安裝

點擊展開

如果您的電腦上已安裝 ComfyUI，請依照下列步驟整合 SDFX：

在 ComfyUI custom_node 路徑上克隆 SDFXBridgeForComfyUI custom_node：
```
git clone https://github.com/sdfxai/SDFXBridgeForComfyUI.git
```
詳細說明請參考SDFX for ComfyUI官方README。
安裝前端依賴並運行：