Back to Details

stac-screen-builder

Compare original and translation side by side

🇺🇸

Original

English

🇨🇳

Translation

Chinese

Stac Screen Builder

Stac Screen Builder

Overview

概述

Use this skill to convert feature requirements into maintainable Stac DSL screens and theme definitions.

使用此技能可将功能需求转换为可维护的Stac DSL界面和主题定义。

Workflow

工作流程

Translate user requirements into route names, states, and actions.
Select widgets using
```
references/widget-selector.md
```
.
Select actions using
```
references/action-recipes.md
```
.
Apply style patterns from
```
references/style-recipes.md
```
.
Apply route semantics from
```
references/navigation-patterns.md
```
.
Scaffold files using scripts when requested.

将用户需求转换为路由名称、状态和动作。
使用
```
references/widget-selector.md
```
选择组件。
使用
```
references/action-recipes.md
```
选择动作。
应用
```
references/style-recipes.md
```
中的样式模式。
应用
```
references/navigation-patterns.md
```
中的路由语义。
按需使用脚本搭建文件结构。

Required Inputs

必要输入

Target screen name (
```
snake_case
```
recommended).
Desired interactions (navigation, network, forms, state changes).
Whether a theme reference is needed.

目标界面名称（推荐使用
```
snake_case
```
格式）。
所需交互（导航、网络请求、表单、状态变更）。
是否需要主题引用。

Output Contract

输出约定

Return valid Stac DSL snippets with
```
@StacScreen
```
or
```
@StacThemeRef
```
.
Keep generated screen names stable and explicit.
Use built-in Stac widgets/actions first, then custom extensions if needed.

返回包含
```
@StacScreen
```
或
```
@StacThemeRef
```
的有效Stac DSL代码片段。
保持生成的界面名称稳定且明确。
优先使用内置Stac组件/动作，必要时再使用自定义扩展。

References

参考资料

Read
```
references/widget-selector.md
```
to choose layout and interactive widgets.
Read
```
references/action-recipes.md
```
for navigation/form/network/state actions.
Read
```
references/style-recipes.md
```
for color, spacing, and text style patterns.
Read
```
references/navigation-patterns.md
```
for stack-safe navigation actions.

阅读
```
references/widget-selector.md
```
选择布局和交互组件。
阅读
```
references/action-recipes.md
```
获取导航/表单/网络/状态动作相关内容。
阅读
```
references/style-recipes.md
```
获取颜色、间距和文本样式模式。
阅读
```
references/navigation-patterns.md
```
获取栈安全的导航动作。

Scripts

脚本

scripts/new_screen.py --screen-name <name> --out-dir <path> [--with-navigation]

scripts/new_theme_ref.py --theme-name <name> --out-file <path>

scripts/new_screen.py --screen-name <name> --out-dir <path> [--with-navigation]

scripts/new_theme_ref.py --theme-name <name> --out-file <path>

Templates

模板

```
assets/templates/screen.dart.tmpl
```
```
assets/templates/theme_ref.dart.tmpl
```

```
assets/templates/screen.dart.tmpl
```
```
assets/templates/theme_ref.dart.tmpl
```