Flutter开发中经常使用的快捷键

介绍

若是您是Flutter开发的新手，那么咱们会对这嵌套结构挺烦的，好比咱们要从代码中间添加或者删除一个widget是很麻烦的，要找到一个widget相关代码的开始位置和结束位置，是比较麻烦的。

下面利用一些快捷键，来提升Flutter的开发效率。

建立新的StatelessWidget或者StatefulWidget

咱们没必要手动去编写继承StatelessWidget或者StatefulWidget并重写build()方法。IDE已经提供了相应的快捷键。

只须要输出stless就能够建立一个StatelessWidget。

或者输入stful建立一个StatefulWidget。

若是一开始咱们建立了一个StatelessWidget，可是后来咱们想把它改成一个StatefulWidget的话，咱们会新建一个State类，并修改以前StatelessWidget的相关代码。

其实能够没必要要这样作，咱们只须要将光标StatelessWidget的地方，按住Alt + Enter(在mac中是option + Enter)，而后单击Convert to StatefulWidget，将自动为你建立全部的样板代码。

使用Alt + Enter能够作更多的事情

Alt + Enter(在mac vscode里 Alt + Enter 是 option + .)是用于Flutter开发中常常要用到的的快捷键。能够单击任何一个widget，而后按Alt + Enter，就能够查看对该widget进行特定的操做。

给widget添加padding

只须要按下Alt + Enter，单击Add Padding就能够给widget的外面加上一层Padding，而且不会弄乱你以前的代码结构。

设置widget居中

只须要按下Alt + Enter，单击Center Widget就能够给widget的外面加上一层Center的小部件，使widget居中。

将widget放到Container中

只须要按下Alt + Enter，单击Wrap with Container就能够给widget的外面加上一层Container。

将多个widget放到Row,Column中

只须要按下Alt + Enter，单击Wrap with Column或者Row就能够一次性将多个widget放置到Row或者Column中。

将widget放到任意的小部件中

只须要按下Alt + Enter，单击Wrap with a new widget就能够将widget放到任意的小部件中。

移除widget

只须要按下Alt + Enter，单击Remove Widget就能够将当前的widget进行删除。

快速选择整个小部件

当咱们须要提取或者删除整个小部件的时候，通常状况下，咱们须要找到整个widget的相关代码的开始位置和结束位置，而后再进行操做。

可是若是整个widget的代码行数很是多，那么要本身找出相关的代码，那就会很麻烦。

因此在整个时候，咱们须要快捷键Ctrl + W。能够无需移动光标，就能够帮咱们选择出整个widget的相关代码。 对应的keymap 是Select successively increasing code blocks：Ctrl + W（Windows）或 Option + Up（Mac）

格式化代码

大多数的IDE都具备格式化代码的功能。咱们只须要按下Ctrl+Alt+L就能够格式化代码，而且修复缩进不对齐的问题。

使用Flutter Outline

若是只是经过看代码，来看widget之间的嵌套状况，可能须要不断滚动代码，而且也很难理解代码的结构。这个时候，咱们须要使用到Flutter Outline。

Flutter Outline能够在IDE的最右侧找到，位于Flutter Inspector的正上方。打开Flutter Outline，显示的状况是这样的：

如今，咱们能够清楚地看到全部的小部件，在UI中的排列状况，也能够看出小部件的嵌套状况。

将相关的代码提取成一个方法

Flutter Outline是一个很是有用的工具。Alt + Enter快捷键能够作的事情，大部分也能够在 Flutter Outline上进行操做，不过仍是Alt + Enter可以实现的功能，仍是尽可能用Alt + Enter就行，比较快。

可是Flutter Outline还有更多的功能，好比Extract Method。当咱们编写来一个Widget，而且代码行数比较长，那能够考虑将这个widget相关的代码，提取到一个方法中。这个操做能够利用Extract Method来快速完成，不须要你手动将代码转移到一个方法中

上下移动小部件

若是在一个widget中有多个孩子widget，那么咱们可使用Flutter Outline，来从新排序这些孩子widget的顺序。

重命名

重命名方法，重命名widget，重命名类或者文件名，只须要使用Shift + F6 就能够输入新名称了。

删除未使用的import

若是咱们正在开发一个项目，并导入了大量文件，可是到最后，有些文件实际上是没有被使用到的，因此咱们是不须要这些多余的导入的。直接使用Ctrl+Alt+O，就能够代替手动删除了全部未使用的import。

原文连接

本文是在原文的基础上简单翻译了一下，并作了一些简单的修改。

原文连接：medium.com/flutter-com…

最后，欢迎你们关注个人公众号，会推送关于Flutter和Android学习的一些文章