Flutter: 使用 FocusNode 实现 Container 获取 Tab 聚焦

Flutter 中可以通过设置 FocusNode 来使得某个 Widget 可以获得 tab 聚焦。

例如，在一个 Container 中添加一个 TextField，通过设置 FocusNode 来让 Container 可以获得 tab 聚焦：

FocusNode _focusNode = FocusNode();

Container(
  decoration: BoxDecoration(
    border: Border.all(
      color: _focusNode.hasFocus ? Colors.blue : Colors.grey,
    ),
  ),
  child: TextField(
    focusNode: _focusNode,
    decoration: InputDecoration(
      hintText: 'Enter text',
    ),
  ),
)

在上述代码中，我们在 Container 的 decoration 中添加了一个边框，根据 _focusNode 是否获得聚焦来判断边框颜色。同时，在 TextField 中设置了 _focusNode，使得 Container 可以获得 tab 聚焦。

当 Container 获得聚焦时，边框颜色会变为蓝色。