为 Zed 编辑器 添加 flutter dart snippets

zed 添加 snippets 和 vscode 的 snippets 看起来非常的像,官方文档示例地址如下:zed.dev/docs/snippe...

参考了 宁浩 老师的 vscode snippets : github.com/ninghao/vsc...

为 zed 添加 snipptes 步骤如下:

  • command + shift + p 或者用 菜单 go-> command palette..., 然后输入 snippets: configure snippets 回车确定
  • select snippets scope 输入 dart

回车确定会打开 dart.json, 把如下代码复制粘贴进入你 zed 配置文件里面

json 复制代码
{
  "Flutter Stateless Widget": {
    "prefix": "sl",
    "body": [
      "class ${1:MyWidget} extends StatelessWidget {",
      "\tconst ${1:MyWidget}({super.key});",
      "\t@override",
      "\tWidget build(BuildContext context) {",
      "\t\treturn const ${2:Placeholder}();",
      "\t}",
      "}"
    ],
    "description": "Flutter Stateless Widget"
  },
  "Flutter Stateful Widget": {
    "prefix": "sf",
    "body": [
      "class ${1:MyWidget} extends StatefulWidget {",
      "\tconst ${1:MyWidget}({super.key});\n",
      "\t@override",
      "\tState<${1:MyWidget}> createState() => _${1:MyWidget}State();",
      "}\n",
      "class _${1:MyWidget}State extends State<${1:MyWidget}> {",
      "\t@override",
      "\tWidget build(BuildContext context) {",
      "\t\treturn const ${2:Placeholder}();",
      "\t}",
      "}"
    ],
    "description": "Flutter Stateful Widget"
  },
  "Flutter Widget with AnimationController": {
    "prefix": "wwa",
    "body": [
      "class ${1:MyWidget} extends StatefulWidget {",
      "\tconst ${1:MyWidget}({super.key});\n",
      "\t@override",
      "\tState<${1:MyWidget}> createState() => _${1:MyWidget}State();",
      "}\n",
      "class _${1:MyWidget}State extends State<${1:MyWidget}>",
      "  with SingleTickerProviderStateMixin {",
      "\tlate AnimationController _controller;\n",
      "\t@override",
      "\tvoid initState() {",
      "\t\tsuper.initState();",
      "\t\t_controller = AnimationController(vsync: this);",
      "\t}\n",
      "\t@override",
      "\tvoid dispose() {",
      "\t\t_controller.dispose();",
      "\t\tsuper.dispose();",
      "\t}\n",
      "\t@override",
      "\tWidget build(BuildContext context) {",
      "\t\treturn const ${2:Placeholder}();",
      "\t}",
      "}"
    ],
    "description": "Flutter Stateful Widget"
  },
  "StatelessWidget with Scaffold": {
    "prefix": "sls",
    "body": [
      "class ${1:WidgetName} extends StatelessWidget {",
      "\t@override",
      "\tWidget build(BuildContext context) {",
      "\t\treturn ${Scaffold}(",
      "\t\t\tappBar: AppBar(",
      "\t\t\t\ttitle: Text('${1:WidgetName}'),",
      "\t\t\t\televation: 0.0,",
      "\t\t\t),${2}",
      "\t\t);",
      "\t}",
      "}"
    ],
    "description": "StatelessWidget with Scaffold"
  },
  "StatefulWidget with Scaffold": {
    "prefix": "sfs",
    "body": [
      "class ${1:WidgetName} extends StatefulWidget {",
      "\t@override",
      "\t_${1:WidgetName}State createState() => _${1:WidgetName}State();",
      "}\n",
      "class _${1:WidgetName}State extends State<${1:WidgetName}> {",
      "\t@override",
      "\tWidget build(BuildContext context) {",
      "\t\treturn ${Scaffold}(",
      "\t\t\tappBar: AppBar(",
      "\t\t\t\ttitle: Text('${1:WidgetName}'),",
      "\t\t\t\televation: 0.0,",
      "\t\t\t),${2}",
      "\t\t);",
      "\t}",
      "}"
    ],
    "description": "StatefulWidget with Scaffold"
  },
  "InheritedWidget": {
    "prefix": "ih",
    "body": [
      "class ${1:WidgetName} extends InheritedWidget {",
      "\tfinal Widget child;",
      "\t${2}",
      "\t${1:WidgetName}({",
      "\t\tthis.child,",
      "\t\t${2}",
      "\t}) : super(child: child);\n",
      "\tstatic ${1:WidgetName} of(BuildContext context) =>",
      "\t\t\tcontext.inheritFromWidgetOfExactType(${1:WidgetName});\n",
      "\t@override",
      "\tbool updateShouldNotify(${1:WidgetName} oldWidget) {",
      "\t\treturn true;",
      "\t}",
      "}"
    ],
    "description": "InheritedWidget"
  },
  "setState": {
    "prefix": "ss",
    "body": ["setState(() {${1}});"],
    "description": "setState"
  },
  "build": {
    "prefix": "build",
    "body": [
      "@override",
      "Widget build(BuildContext context) {",
      "\treturn ${1:Container}(${2});",
      "}"
    ],
    "description": "Build Method"
  }
}

其中前三个是 和 vscodeflutter 扩展带来的 snippets 完全一致, 即在vscode里面打开 .dart为后缀的文件,输入小写 字母 s 触发,新建的 .dart 文件需要保存一下, 你要安装的有 flutter 扩展。

相关推荐
SoaringHeart8 小时前
Flutter 进阶:NCanvasImageLoader 让 Canvas 也能画网络图
前端·flutter
计算机魔术师9 小时前
英伟达两个月叫停360亿美元生意:芯片巨头怕了反垄断?
前端
创新技术阁9 小时前
FastapiAdmin 前后端启动全流程详解
前端·后端·fastapi
七牛开发者9 小时前
实测推荐 3 个 Skill,轻松上手 Codex 网页设计与交付流程
前端·javascript·后端
七牛开发者9 小时前
拆解 dsh 系列:从源码和版本变化看 DeepSeek Harness 的设计取舍
前端·javascript·后端
谭光志9 小时前
如何从网站提取设计风格:DOM、计算样式与 DESIGN.md
前端·javascript·agent
深念Y9 小时前
登录日志与管理员审计日志存储决策
前端·arm开发·后端·微服务·云原生·架构
笨笨饿10 小时前
#121_图传中的H.364编码与MP4的联系
linux·运维·前端·单片机·嵌入式硬件·面试·职场和发展
磐链科技10 小时前
钱包开发中的跨平台架构:Flutter与Rust构建高性能移动端钱包
flutter·架构·rust
默_笙10 小时前
☕ 我给 TS 类型做了台"瘦身手术",还顺手用 Docker 起了个 MySQL
前端·javascript