flutter - 在 Flutter 的嵌套导航中输入焦点

Question

我正在尝试在 Flutter 中创建主细节平板电脑 View 布局，但遇到了错误或其他问题。

伪布局

Scaffold
-- Column
---- Navigator => Container => Input (works)
---- Container => Input (no focus)

要点

我创建了一个要点来说明问题: https://gist.github.com/markmooibroek/3459f73bbd89deefeb488060f5bfd87e

视频

还有一段视频展示了错误行为。第二个输入(下方)未正确聚焦。

https://user-images.githubusercontent.com/1412238/58686402-0507e700-837f-11e9-977d-c16e7a858f27.gif

Answer 1

当您使用嵌套的 MaterialApps 时会发生这种情况。解决方法是使用 FocusScope 和 FocusScopeNode。这将使您能够专注于与您的主要应用程序重叠的其他 MaterialApps。在 Overlay 小部件上使用 TextField 时也是如此。

所以像显示的那样包装东西:

FocusScope(
   node : FocusScopeNode(),
   child : return Container(
              color: Colors.green,
              child: Center(
                child: TextFormField(
                  controller: controller,
                  decoration: InputDecoration(hintText: "Input"),
                ),
              ),
            );
)

这应该能让您在该屏幕上获得焦点。