Flutter：在物理键盘上按下某个键时如何将焦点更改到另一个小部件

Question

我正在 Windows 上开发一个桌面应用程序，当在另一个文本字段上按下 ENTER 键时，我试图将焦点移动到一个文本字段。我能够使用 RawKeyboardListener 检测到按键已被按下，但焦点未更改到新字段。我怎样才能让它工作？

import 'package:flutter/material.dart';

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

class MyApp extends StatefulWidget {
  @override
  _MyAppState createState() => _MyAppState();
}

class _MyAppState extends State<MyApp> {
  late FocusNode _txtNode;

  @override
  void initState() {
    super.initState();
    _txtNode = FocusNode();
  }

  @override
  void dispose() {
    _txtNode.dispose();

    super.dispose();
  }

  @override
  Widget build(BuildContext context) {
    return MaterialApp(
      home: Scaffold(
        body: SafeArea(
          child: Stack(
            children: [
              Container(
              height: 400,
              width: 500,
              color: Colors.grey[350],
              child: Column(
                children: [
                  Container(
                      height: 100,
                      child: RawKeyboardListener(
                        focusNode: FocusNode(),
                          onKey: (event){
                          if (event.toString().contains('RawKeyDownEvent') && event.toString().contains('Enter')) {
                            print("pressed ENTER");
                            _txtNode.requestFocus();
                          }
                          },
                          child: TextField(readOnly: true,))
                  ),
                  TextField(
                  ),
                  TextField(
                    focusNode: _txtNode,
                  ),
                ],
              ),
            ),
          ]
          ),
        ),
      ),
    );
  }
}

Answer 1

我只是修改了您的代码片段就实现了您的用例。请检查以下代码片段。 FocusScope.of(context).nextFocus()用于将焦点移到下一个。如果您想将焦点移动到特定的小部件。你就叫它 focusNode.requestFocus().


class FocusDemo extends StatefulWidget {
  @override
  _FocusDemoState createState() => _FocusDemoState();
}

class _FocusDemoState extends State<FocusDemo> {
  late FocusNode _txtNode;

  @override
  void initState() {
    super.initState();
    _txtNode = FocusNode();
  }

  @override
  void dispose() {
    _txtNode.dispose();
    super.dispose();
  }

  @override
  Widget build(BuildContext context) {
    return Scaffold(
      body: SafeArea(
        child: Focus(
          focusNode: _txtNode,
          onKey: (focusNode, event) {
            if (event.runtimeType == RawKeyUpEvent &&
                event.logicalKey == LogicalKeyboardKey.enter) {
              focusNode.nextFocus();
              return KeyEventResult.handled;
            }
            return KeyEventResult.ignored;
          },
          child: Container(
            height: 400,
            width: 500,
            color: Colors.grey[350],
            child: Column(
              children: [
                TextField(),
                TextField(),
                TextField(),
              ],
            ),
          ),
        ),
      ),
    );
  }
}

Flutter：在物理键盘上按下某个键时如何将焦点更改到另一个小部件

Flutter: How to change focus to another widget when a certain key is pressed on physical keyboard

dart

flutter

flutter-desktop