将小部件拆分到另一个文件时，unfocus 不起作用

Question

我有 main.dart

part 'home_page.dart';
class MyApp extends StatelessWidget {
  const MyApp({Key? key}) : super(key: key);
  static const String _judul = 'Private Chat';

  @override
  Widget build(BuildContext context) {
    return GestureDetector(
      onTap: () {
        FocusScope.of(context).unfocus();
      },
      child: MaterialApp(
        title: _judul,
        home: HomePage(), // Using separated file
      ),
    );
  }
}

还有 home_page.dart

part of 'main.dart';
class HomePage extends StatelessWidget {
  const HomePage({Key? key}) : super(key: key);

  @override
  Widget build(BuildContext context) {
    return Scaffold(
      body: TextField(),
    );
  }
}

当我将小部件从 main.dart 拆分到另一个文件（在本例中为 home_page.dart）时，FocusScope.of(context).unfocus() 不起作用，因此项目将整洁。

但是，当我直接将 HomePage() return (Scaffold) 放入 main.dart 时，它是有效的，（我说有效，因为 android 键盘在从文本字段中失焦时会消失）

part 'home_page.dart';
class MyApp extends StatelessWidget {
  const MyApp({Key? key}) : super(key: key);
  static const String _judul = 'Private Chat';

  @override
  Widget build(BuildContext context) {
    return GestureDetector(
      onTap: () {
        FocusScope.of(context).unfocus();
      },
      child: MaterialApp(
        title: _judul,
        home: Scaffold(...), //Directly put textfield
      ),
    );
  }
}

我怀疑这是上下文错误，我不知道上下文属性和方法。

Answer 1

将您的GestureDetector 放在MaterialApp 下（交换它们）并用Builder 包裹它，如下所示：

 class MyApp extends StatelessWidget {
  const MyApp({Key? key}) : super(key: key);
  static const String _judul = 'Private Chat';

  @override
  Widget build(BuildContext context) {
    return MaterialApp(
      title: _judul,
      home: Builder(
        builder: (context) {
          return GestureDetector(
            onTap: () {
              FocusScope.of(context).unfocus();
            },
            child: HomePage(),
          );
        },
      ),
    );
  }
}

之所以起作用，是因为Builder 为您提供了新的上下文，该上下文在您的GestureDetector 的onTap 函数中使用。与您之前使用的（来自 build 方法参数）相比，这个新的上下文包含有关小部件树中位置的更具体的详细信息。