为 Zed 编辑器 添加 flutter dart snippets

0 阅读1分钟

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 回车确定

image.png

image.png

  • select snippets scope 输入 dart

image.png

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

{
  "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 扩展。

image.png