Flutter 實際項目填坑記錄

  Flutter是一個全新的跨平臺開發的語言，我在實際項目開發中也有幸使用到 Flutter 進行完整開發，在這個開發過程當中也是一步步的實驗，在這其中也遇到了各類各樣的坑， 網上經過各類谷歌，stackoverflow，Flutter官網等查資料，有些問題是解決，但仍是有些問題不能及時解決，因而就本身慢慢的嘗試着摸索除了一些解決方案，因此在這裏就整理一下分享給你們，跟你們一塊兒學習、討論。

一、Waiting for another flutter command to release the startup lock...

問題描述

在項目中使用Flutter Packages get時或命令行執行flutter build 時 會 出現: Waiting for another flutter command to release the startup lock...

解決方案：

找到\bin\cache中的lockfile文件刪除，若是仍是不行則重啓IDE從新試下。

二、The context used to push or pop routes from the Navigator must be that of a widget that is a descendant of a Navigator widget.

問題描述

在頁面 initState、build、或者頁面返回沒辦法直接使用 context 或 setState

解決辦法

使用

Future.delayed(Duration.zero).then((e) {
      ....
    });
複製代碼

三、PageView保存狀態報錯

問題描述

Build functions must never return null. To return an empty space that causes the building widget to fill available room, return "new Container()". To return an empty space that takes as little room as possible, return "new Container(width: 0.0, height: 0.0)"

解決辦法

在 build 方法必須加上super.build

@override
  Widget build(BuildContext context) {
    super.build(context); //保存狀態必須加上
    [...]
  }
複製代碼

四、EventManager使用問題

post                        : 發送消息
on                          : 監聽消息
destroy                     : 銷燬

複製代碼

問題描述

錯誤的使用destory 使得整個應用沒辦法監聽消息

解決辦法

在 BaseWidget 的 dispose不能 destory EventManager。EventManager是單例，基類取消就所有取消了。

五、IOS 調起相機/相冊點擊事件穿透

問題描述

在調起相機、相冊選擇圖片時，點擊相機區域、圖片選擇區域會響應下層 flutter 界面的點擊事件

具體參與：github.com/flutter/flu…

解決辦法

目前處理的辦法是調起相機、相冊時顯示一個帶蒙層的彈窗，收起相機、機冊時取消蒙層彈窗。

六、官方 Webview_flutter 使用問題

問題描述

在 android 中輸入框獲焦點，點擊兩次會閃退。

在IOS須要 配置了io.flutter.embedded_views_preview屬性,會致使鍵盤卡頓。

解決辦法

待官方解決，暫時使用第三方flutter_webview_plugin 插件

七、flutter_webview_plugin 插件使用問題

問題描述

flutter_webview_plugin是調用原生 webview.並加到原生主頁面上。因此該 webview 是最頂層的，沒法在其上顯示flutter的視圖

解決辦法

要顯示彈窗等視圖時先判斷當前是否有webview頁面，而且在進入webview頁面時調用FlutterWebviewPlugin().show();退出 webviewd頁面時調用FlutterWebviewPlugin().hide();

八、命名路由沒法關閉指定頁面

問題描述

flutter 關閉彈窗、頁面都會都是調用 Navigator.pop(context, result)，在這裏沒辦法指定特定的頁面路由或彈窗

解決辦法

修改源碼把底層的history釋放出來，或者儘可能避免這種須要關閉指定頁面的作法。

九、點擊控件區域沒事件響應

問題描述

正確的設置了控件的點擊事件，點擊卻沒有反應

解決辦法

• 給控件設置背景
• 設置behavior屬性

return GestureDetector(
                    behavior: HitTestBehavior.translucent,
                    child: Text("測試${index}"),
                    onTap: () {},
                  );


enum HitTestBehavior {
  /// Targets that defer to their children receive events within their bounds
  /// only if one of their children is hit by the hit test.
  deferToChild, //只生效在child的區域好比文字

  /// Opaque targets can be hit by hit tests, causing them to both receive
  /// events within their bounds and prevent targets visually behind them from
  /// also receiving events.
  opaque,//GestureDetector的整個區域，不包括它下面的區域

  /// Translucent targets both receive events within their bounds and permit
  /// targets visually behind them to also receive events.
  translucent,// GestureDetector的整個區域以及它下面的區域
}

複製代碼

十、Appbar/Tabbar/的高度設置問題

問題描述

Appbar、Tabbar 默認有固定的高度，如何改變其高度

解決辦法

使用PreferredSize。

最後

  若是在使用過程遇到問題，歡迎下方留言交流。

學習資料

• Flutter Github
• Flutter 中文網
• Flutter Packages
• Flutter 電子書
• Flutter 社區中文資源網

請你們不吝點贊！由於您的點贊是對我最大的鼓勵，謝謝！