1.创建新的StatelessWidget或者StatefulWidget
stless 然后回车,会自动创建以下代码,并定位到名字的编辑处
class Mingzi extends StatelessWidget {
@override
Widget build(BuildContext context) {
return Container();
}
}
stful 然后回车,会自动创建以下代码,并定位到名字的编辑处
class extends StatefulWidget {
@override
_State createState() => _State();
}
class _State extends State<> {
@override
Widget build(BuildContext context) {
return Container();
}
}
2.使用Flutter Outline,查看当前页面的组件布局
如果只是通过看代码,来看widget之间的嵌套情况,可能需要不断滚动代码,并且也很难理解代码的结构。这个时候,我们需要使用到Flutter Outline。
Flutter Outline可以在IDE的最右侧找到,位于Flutter Inspector的正上方。打开Flutter Outline,显示的情况是这样的
3.使用Alt + Enter可以做更多的事情
3.1 Alt + Enter(在mac中是option + Enter)是用于Flutter开发中经常要用到的的快捷键。可以单击任何一个widget,然后按Alt + Enter,就可以查看对该widget进行特定的操作
3.2给widget添加padding 只需要按下Alt + Enter,单击Add Padding就可以给widget的外面加上一层Padding,并且不会弄乱你之前的代码结构。
3.3设置widget居中 只需要按下Alt + Enter,单击Center Widget就可以给widget的外面加上一层Center的小部件,使widget居中。
3.4将widget放到Container中 只需要按下Alt + Enter,单击Wrap with Container就可以给widget的外面加上一层Container。
3.5将多个widget放到Row,Column中 只需要按下Alt + Enter,单击Wrap with Column或者Row就可以一次性将多个widget放置到Row或者Column中。
3.6将widget放到任意的小部件中 只需要按下Alt + Enter,单击Wrap with a new widget就可以将widget放到任意的小部件中。
3.7移除widget 只需要按下Alt + Enter,单击Remove Widget就可以将当前的widget进行删除。
4.鼠标双击某个组件然后,CTRL+W
如果整个widget的代码行数非常多,那么要自己找出相关的代码,那就会很麻烦。
所以在整个时候,我们需要快捷键Ctrl + W。可以无需移动光标,就可以帮我们选择出整个widget的相关代码。
持续更新中......