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。
安装前端依赖并运行：