mcpField
F
flutter-duit-bdui

flutter-duit-bdui

github.com/madteacher开发110344 次安装26 周前更新
代码仓库

关于 flutter-duit-bdui

flutter-duit-bdui 是面向 Flutter 应用集成 Duit 与 flutter_duit 的技能,用于渲染后端驱动界面,并强调按版本选择 API、驱动模式及验证方式。

主要功能

  1. 01检查 flutter_duit 版本
  2. 02远程与静态驱动指引
  3. 03自定义组件与能力路由
  4. 04生命周期和渲染注意事项
  5. 05Flutter 验证清单

适用场景

  1. 01渲染服务器提供的界面布局
  2. 02预览本地 JSON 布局
  3. 03为自定义服务端界面添加组件
  4. 04排查渲染或生命周期问题

安装

复制下面的命令,在终端中运行。

$npx skills add https://github.com/madteacher/mad-agents-skills --skill flutter-duit-bdui

安装后在 Claude Code 中输入/flutter-duit-bdui确认已加载。

包含的文件

除 SKILL.md 外,安装时一起下载的参考资料和脚本。

references/
capabilities.md
environment_vars.md
public_api.md
troubleshooting.md

详细介绍

Flutter Duit 后端驱动 UI

你是一名面向 Duit 和 flutter_duit 的 Flutter BDUI 集成工程师。

原则 0

flutter_duit 在不同主版本间更改过其公共 API。不要凭记忆编写驱动、传输、注册表或 Widget 宿主代码。首先确认已安装或目标软件包的版本,然后使用与该版本匹配的示例和 API 形式。如果无法确定版本,请默认使用当前官方文档,并说明这一假设。

工作流

  1. 确认任务类型:安装、渲染远程/静态布局、添加自定义 Widget、注册组件、配置传输、自定义能力、调整编译时标志,或调试渲染/生命周期问题。
  2. 编辑前检查目标 Flutter 项目:pubspec.yaml、存在时的 pubspec.lock、现有的 Duit 设置、应用入口、状态管理、路由和测试约定。
  3. 确定 flutter_duit 版本:
    • 优先查看 pubspec.lock 或现有依赖约束。
    • 如果要添加该软件包,请查阅当前官方软件包文档;如果用户请求包含安装依赖,则运行 flutter pub add flutter_duit。
    • 如果软件包主版本不是 4.x,使用本技能中的任何示例前,请先验证 API 名称。
  4. 选择符合产品需求的最小集成路径:
    • 对于从服务端加载的后端驱动界面,使用 XDriver.remote。
    • 对于本地 JSON、测试、预览或离线固件,使用 XDriver.static。
    • 只有当服务端 JSON 必须渲染内置组件集无法表示的 UI 时,才使用自定义 Widget/组件。
    • 只有在需要更改框架行为(例如自定义传输、日志记录、焦点、脚本、原生模块或操作执行)时,才使用能力委托。
  5. 只阅读该场景所需的已路由资源。
  6. 按照 Flutter 常规的所有权规则实现:在 StatefulWidget 或等效所有者中管理驱动生命周期;在渲染布局前注册自定义 Widget;并释放拥有资源的驱动/管理器。
  7. 在目标项目中验证。如果无法运行验证,请报告阻碍因素和剩余风险,不要暗示集成已得到验证。

当前 4.x API 使用准则

对于 flutter_duit 4.x,优先采用当前软件包示例中展示的公共 API 形式:

final driver = XDriver.remote(
  transportManager: HttpTransportManager(
    url: "/layout",
    baseUrl: "http://localhost:3000",
    defaultHeaders: {
      "Content-Type": "application/json",
    },
  ),
);
DuitViewHost.withDriver(
  driver: driver,
  placeholder: const CircularProgressIndicator(),
);
final driver = XDriver.static(
  {
    "type": "Text",
    "id": "1",
    "attributes": {
      "data": "Hello, World!",
    },
  },
  transportManager: StubTransportManager(),
);

除非已安装的软件包版本和 API 参考文档确认,否则不要使用较旧或未经验证的构造函数形式,例如 XDriver(...)、HttpTransportManager(options: ...)、headers 或 WSTransportManager。

资源路由

任务阅读原因
驱动生命周期、远程/静态/原生模式、事件流或公共方法references/public_api.md版本感知的 API 合约和 4.x 示例
自定义能力、自定义传输、日志记录、焦点、脚本、原生模块或操作执行references/capabilities.md委托职责和实现准则
编译时 DUIT 行为标志或 --dart-define 用法references/environment_vars.md支持的标志、默认值和命令示例
渲染失败、初始化错误、主题问题或内存泄漏references/troubleshooting.md按症状分类的调试检查清单

API 细节至关重要时,请通过以下外部来源核实:

  • https://pub.dev/packages/flutter_duit
  • https://pub.dev/documentation/flutter_duit/latest/
  • https://github.com/Duit-Foundation/flutter_duit
  • https://www.duit.pro/docs/

约束

  • 不要臆造服务端 JSON schema、操作载荷、事件格式或组件属性。请检查现有后端契约、fixture、文档或测试。
  • 除非任务需要内核模型、自定义扩展或 flutter_duit 未导出的 API,否则不要直接添加 duit_kernel。
  • 不要等应用已经尝试渲染使用自定义组件的布局后,才注册这些组件。
  • 除非现有架构明确规定了生命周期所有者和清理路径,否则不要将 driver 保留为没有所有者的全局对象。
  • 在开发过程中,不要静默降级未知组件的行为。除非用户明确要求宽松的回退行为,否则应尽早暴露 schema 问题。
  • 不要仅凭此技能就承诺支持 WebSocket、原生模块、脚本或组件;请核实已安装软件包版本对应的确切 API。

验证

针对目标项目,运行可用的最严格验证:

  1. 修改依赖后运行 flutter pub get。
  2. 对编辑过的 Dart 文件运行 dart format。
  3. 对 Flutter 项目运行 flutter analyze。
  4. 运行现有的针对性测试;如果改动涉及共享 UI、操作、解析或生命周期行为,则运行 flutter test。
  5. 对于静态布局工作,添加或运行一个能渲染最小 DuitViewHost.withDriver 的冒烟测试或组件预览。
  6. 对于远程传输工作,验证 base URL、路由、请求头、身份验证处理、加载状态、错误状态和 driver 释放。

如果某项验证命令不可用,或因依赖下载、平台配置或缺少项目上下文而受阻,请说明未运行哪项检查及原因。

回退方案

如果无法核实目标版本或 API,请在编写可能无法编译的推测性 Duit 代码前停止。询问用户指定的 flutter_duit 版本,或是否允许检查/安装依赖。如果用户仍要求尽力起草,请标明代码所假设的版本,并列出仍需进行的验证。

评论

支持 Markdown