为 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 扩展。

相关推荐
漂流瓶jz12 小时前
总结CSS组件化演进之路:命名规范/CSS Modules/CSS in JS/原子化CSS
前端·javascript·css
踩着两条虫13 小时前
「AI + 低代码」的可视化设计器
开发语言·前端·低代码·设计模式·架构
Jagger_13 小时前
项目上线忙碌结束之后,为什么总想找点事做?
前端
GalenZhang88814 小时前
OpenClaw 配置多个飞书账号实战指南
前端·chrome·飞书·openclaw
萌新小码农‍15 小时前
python装饰器
开发语言·前端·python
threelab15 小时前
Three.js 初中数学函数可视化 | 三维可视化 / AI 提示词
开发语言·前端·javascript·人工智能·3d·着色器
爱学习的程序媛15 小时前
浏览器工作原理全景解析
前端·浏览器·web
我是若尘17 小时前
用 Git Worktree 同时开多个需求,不用来回 stash
前端
IT_陈寒17 小时前
Vue的v-for为什么不加key也能工作?我差点翻车
前端·人工智能·后端
小碗羊肉17 小时前
【JavaWeb | 第十二篇】项目实战——登录功能
java·前端·数据库