開發原生頁面的時候，在處理鍵盤事件上，通常的需求是，點選輸入框外螢幕，要隱藏鍵盤，同樣的，這樣的需求也需要在 Flutter 上實現，

Android 上的實現方式是在基類 Activity 裡實現事件分發，判斷觸控位置是否在輸入框內。

 /**
   * 獲取點選事件
   */
  @CallSuper
  @Override
  public boolean dispatchTouchEvent(MotionEvent ev) {
    if (ev.getAction() == MotionEvent.MotionEvent ) {
      View view = getCurrentFocus();
      if (isShouldHideKeyBord(view,ev)) {
        hideSoftInput(view.getWindowToken());
      }
    }
    return super.dispatchTouchEvent(ev);
  }

  /**
   * 判定當前是否需要隱藏
   */
  protected boolean isShouldHideKeyBord(View v,MotionEvent ev) {
    if (v != null && (v instanceof EditText)) {
      int[] l = {0,0};
      v.getLocationInWindow(l);
      int left = l[0],top = l[1],bottom = top + v.getHeight(),right = left + v.getWidth();
      return !(ev.getX() > left && ev.getX() < right && ev.getY() > top && ev.getY() < bottom);
    }
    return false;
  }

  /**
   * 隱藏軟鍵盤
   */
  private void hideSoftInput(IBinder token) {
    if (token != null) {
      InputMethodManager manager = (InputMethodManager) getSystemService(Context.INPUT_METHOD_SERVICE);
      manager.hideSoftInputFromWindow(token,InputMethodManager.HIDE_NOT_ALWAYS);
    }
  }

那麼在 Flutter 上如何實現呢？

許多文章的做法如下，每個包含TextField的螢幕中包裹GestureDetector，手動控制Focus。一旦失去焦點，就請求關閉鍵盤。這是一個臨時的解決方案，容易出錯，並且生成大量程式碼。

GestureDetector(
  behavior: HitTestBehavior.translucent,onTap: () {
    // 觸控收起鍵盤
    FocusScope.of(context).requestFocus(FocusNode());
  },child: *******
}

通常這種需求是對應整個 app 的，有沒有一勞永逸的方法呢？當然有，我們可以藉助MaterialApp的builder方法，在 Navigator上方但在其他小部件下方插入小部件，僅添加了一個“全域性” GestureDetector，它將為我們處理鍵盤關閉：

void main() {
 runApp(MyApp());
}

class MyApp extends StatelessWidget {
 @override
 Widget build(BuildContext context) {
  return MaterialApp(
   title: 'Flutter Demo',theme: ThemeData(
    primarySwatch: Colors.blue,visualDensity: VisualDensity.adaptivePlatformDensity,),builder: (context,child) => Scaffold(
    // Global GestureDetector that will dismiss the keyboard
    body: GestureDetector(
     onTap: () {
     hideKeyboard(context);
     },child: child,home: MyHomePage(title: 'Flutter Demo Home Page'),);
 }

 void hideKeyboard(BuildContext context) {
  FocusScopeNode currentFocus = FocusScope.of(context);
  if (!currentFocus.hasPrimaryFocus && currentFocus.focusedChild != null) {
   FocusManager.instance.primaryFocus.unfocus();
  }
 }
}

當然也可以使用下面這個方法關閉鍵盤：

SystemChannels.textInput.invokeMethod（'TextInput.hide'）;

這樣就全域性控制，再也不用在每個頁面寫了。

到此這篇關於詳解Flutter點選空白隱藏鍵盤的全域性做法的文章就介紹到這了,更多相關Flutter點選空白隱藏鍵盤內容請搜尋我們以前的文章或繼續瀏覽下面的相關文章希望大家以後多多支援我們！