Flutter 快捷開發 Mac Android Studio 篇

Flutter 快捷開發 Mac Android Studio 篇


老孟導讀:此快捷方式適用於Mac下的 Android Studio 。Windows 下的快捷方式請參考這篇文章:https://juejin.im/post/5efe71365188252e7d7fd0ca

快速創建一個新的Stateless or Stateful組件

創建新的 Stateless 組件,輸入stless,回車:

Flutter 快捷開發 Mac Android Studio 篇

創建新的 Stateful 組件,輸入 stful,回車:

Flutter 快捷開發 Mac Android Studio 篇

創建新的 動畫組件,輸入 stanim,回車:

Flutter 快捷開發 Mac Android Studio 篇

還有其他的一些快捷方式,這裡不一一介紹,這些快捷方式在 Preferences 中可以找到,路徑:Preferences -> Editor -> Live Templates:

Flutter 快捷開發 Mac Android Studio 篇

Dart 和 Flutter 下就是快捷方式,也可以進行修改,上面我的快捷方式直接導入包和註釋,是自己加的,默認是沒有的:

Flutter 快捷開發 Mac Android Studio 篇

自定義快捷鍵,選中 Flutter,點擊右上角的 + 號,選擇 Live Template,然後輸入名稱和生成的代碼,點擊 OK

Flutter 快捷開發 Mac Android Studio 篇

最低部會出現警告,選中 Dart ,點擊 OK。

Flutter 快捷開發 Mac Android Studio 篇

使用的方法是一樣的,輸入 test,回車即可。

File And Code Templates

創建 Dart 文件時,生成默認代碼,打開 Preferences -> Editor -> File And Code Templates,選中右側的 Files 標籤,默認裡面是空的

Flutter 快捷開發 Mac Android Studio 篇

加入自動生成代碼:

<code>import 'package:flutter/material.dart'; 


///
/// des:
///
class ${NAME} extends StatelessWidget {
  @override
  Widget build(BuildContext context) {
    return Container();
  }
}
/<code>
Flutter 快捷開發 Mac Android Studio 篇

創建一個 home_page 的 dart 文件:

Flutter 快捷開發 Mac Android Studio 篇

新創建的 dart 文件自動生成了預置的代碼。

格式化代碼

快捷鍵:option + command + L(字母 L 鍵)

Flutter 快捷開發 Mac Android Studio 篇

清除無用引用

快捷鍵:control + option + O(字母 O 鍵)

Flutter 快捷開發 Mac Android Studio 篇

前進/後退光標的位置

當跟蹤代碼的時候,經常跳轉到其他類,後退快捷鍵:option+command+方向左鍵,前進快捷鍵:option+command+方向右鍵,

Flutter 快捷開發 Mac Android Studio 篇

查看當前類的繼承關係

快捷鍵: control + H

Flutter 快捷開發 Mac Android Studio 篇

注意:選中 build 中 Container ,按快捷鍵無效,必須進入 Container 源代碼,選中 Container 類名,才可以。

註釋

單行註釋:command + / 。

多行註釋/**/:option + command + / 或者選中多行 :command + /

Flutter 快捷開發 Mac Android Studio 篇

查找引用

選中要查找的類或者方法,按下快捷鍵:command + G,底部彈出引用列表。

Flutter 快捷開發 Mac Android Studio 篇

自動引入包

快捷鍵:option + 回車,選擇正確的包。

Flutter 快捷開發 Mac Android Studio 篇

自動定位

右側進入一個代碼文件時,左側自定定位到此文件,在 project 標籤 設置中勾選 Autoscroll to source 和 Autoscroll from source。

Flutter 快捷開發 Mac Android Studio 篇

注意左側 project 標籤變化。

Flutter 快捷開發 Mac Android Studio 篇

當前文件搜索

快捷鍵: command + F

Flutter 快捷開發 Mac Android Studio 篇

全局搜索

快捷鍵:command + shift + F

Flutter 快捷開發 Mac Android Studio 篇

搜索文件:

快捷鍵:點擊2次 shift

Flutter 快捷開發 Mac Android Studio 篇

自動生成構造函數:

選中 final 參數,快捷鍵:option + 回車

Flutter 快捷開發 Mac Android Studio 篇

添加父組件、變為子組件、刪除子組件

快捷鍵: option+回車

Flutter 快捷開發 Mac Android Studio 篇

可以給當前組件添加 CenterPaddingColumn 等父組件。

也可以選擇組件進行刪除、移動組件。

查看UI大綱

打開 Flutter Outline 標籤

Flutter 快捷開發 Mac Android Studio 篇

可以清楚的看清 UI 結構。

將代碼提取到方法中

打開 Flutter Outline 標籤,點擊向右箭頭的圖標:

Flutter 快捷開發 Mac Android Studio 篇

Flutter 資源網站

  1. 官網:https://flutter.dev/
  2. 中文網:https://flutterchina.club/
  3. Flutter 中文社區資源:https://flutter-io.cn/
  4. pub(國內):https://pub.flutter-io.cn/
  5. pub:https://pub.dev/
  6. DartPad:https://dartpad.dartlang.org/
  7. Dart 官網:https://dart.dev/
  8. CodePen:https://codepen.io/
  9. Json 轉實體類:https://javiercbk.github.io/json_to_dart/

最後隆重推薦一下我的博客:http://laomengit.com/flutter/widgets/widgets_structure.html,包含了 330 個組件詳細用法和 Flutter 實戰系列文章。


交流

老孟Flutter博客地址(330個控件用法):http://laomengit.com

歡迎加入Flutter交流群(微信:laomengit)、關注公眾號【老孟Flutter】


分享到:


相關文章: