vscode中Flutter开发中常用的快捷键

2,853 阅读3分钟

这是我参与8月更文挑战的第1天,活动详情查看:8月更文挑战

vscode 选中多行 快捷键

选中Alt+鼠标左键,按鼠标中间垂直多选 ESC退出

vscode Gitlens插件 查看代码提交

image.png

Code Runner 插件 Dart在VS code中调试插件

我们可以在自己的工作空间下(或者某个文件下某个文件)新建.dart后缀的Dart类型可编译文件。那么问题来了,我在dart里写了一些简单dart语法的代码怎么编译查看运行效果呢?安装 Code Runner 插件,如下图: Avator

安装完Code Runner 插件后,在文件右键,选择 Run Code或者当前文件页卡,右边的三角形运行按钮单击,就可以运行当前代码,运行结果会在下面控制台弹出展示。

json转换成dart类 JSON to Dart

json_to_dart的使用 如果我们得到一个特别复杂的JSON,有时候会无从下手开始写Model,这时候就可以使用一些辅助工具。我认为json_to_dart是比较好用的一个。它可以直接把json转换成dart类,然后进行一定的修改,就可以快乐的使用了。 工作中我拿到一个json,都是先操作一下,然后再改的。算是一个小窍门吧。

升级包

flutter packages upgrade
使用以下快捷键的前提是安装如下插件

首先,安装一个插件,搜索@recommended:keymaps 选择 IntelliJ IDEA Keybindings

IntelliJ.png

移除项目中没有必要的import

1. Ctrl+Alt+O

手动删除了所有未使用的import

如果我们正在开发一个项目,并导入了大量文件,但是到最后,有些文件其实是没有被使用到的,所以我们是不需要这些多余的导入的。直接使用Ctrl+Alt+O,就可以代替手动删除了所有未使用的import。

2.Alt + Enter

使用Alt + Enter可以做更多的事情 Alt + Enter(在mac中是option + Enter)是用于Flutter开发中经常要用到的的快捷键。可以单击任何一个widget,然后按Alt + Enter,就可以查看对该widget进行特定的操作。

3.Shift + F6

重命名

重命名方法,重命名widget,重命名类或者文件名,只需要使用Shift + F6 就可以输入新名称了。

4.Ctrl + W

快速选择整个小部件

当我们需要提取或者删除整个小部件的时候,一般情况下,我们需要找到整个widget的相关代码的开始位置和结束位置,然后再进行操作。

但是如果整个widget的代码行数非常多,那么要自己找出相关的代码,那就会很麻烦。

所以在整个时候,我们需要快捷键Ctrl + W。可以无需移动光标,就可以帮我们选择出整个widget的相关代码。

5.自动导入用到的包 Alt + Enter

6.使用Flutter Outline

如果只是通过看代码,来看widget之间的嵌套情况,可能需要不断滚动代码,并且也很难理解代码的结构。这个时候,我们需要使用到Flutter Outline。

Flutter Outline可以在IDE的最右侧找到,位于Flutter Inspector的正上方。打开Flutter Outline,显示的情况是这样的:

image.png

7.设置模拟器一直悬浮在ide上面。

image.png

如果以上快捷键不生效,请升级vscode版本,我的是1.60.0-insider版本,亲测有效的~~

image.png image.png