Flutter TextField清除表单并设置焦点后无法输入问题求助
Flutter单选切换后输入框无法输入问题
我已将代码修改为最小可复现示例,您可以直接复制到Flutter项目中运行。
我怀疑这可能是Flutter的bug,但在提交bug报告前,先在此咨询。我做了如下表单:表单打开时单选按钮默认选中Check Out;当用户切换到另一个单选按钮时,表单字段应被清除,且焦点应设置到location输入框并允许立即输入。
打开表单后选择Check In选项时,焦点会切换到location输入框,我可以正常输入内容。但如果我随后切换到Check Out选项,焦点看似仍在location输入框上,却无法输入内容;再次切换回Check In选项时,同样无法输入。可能是我的实现有误,但似乎在未输入内容前连续多次请求焦点存在异常。
表单初始状态:
选择Check In选项(焦点切换到location输入框,可立即输入):
选择Check Out选项(location字段清空,光标仍存在,但无法输入):
import 'package:flutter/material.dart'; void main() { runApp(const MyApp()); } class MyApp extends StatelessWidget { const MyApp({super.key}); // This widget is the root of your application. @override Widget build(BuildContext context) { return MaterialApp( title: 'Flutter Demo', theme: ThemeData( colorScheme: ColorScheme.fromSeed(seedColor: Colors.deepPurple), useMaterial3: true, ), home: const MyHomePage(title: 'Flutter Demo Home Page'), ); } } enum CheckInOutType { checkIn, checkOut } class MyHomePage extends StatefulWidget { const MyHomePage({super.key, required this.title}); final String title; @override State<MyHomePage> createState() => _MyHomePageState(); } class _MyHomePageState extends State<MyHomePage> { CheckInOutType? selectedCheckInOut = CheckInOutType.checkOut; final locController = TextEditingController(); late FocusNode locFocusNode; // = FocusNode(); @override void initState() { super.initState(); //Run this first initialize(); } @override dispose() { super.dispose(); //Run this last locFocusNode.dispose(); } void initialize() async { locFocusNode = FocusNode(); } void clearFields() { locController.text = ''; locFocusNode.requestFocus(); setState(() { }); } @override Widget build(BuildContext context) { return Scaffold( appBar: AppBar( title: const Text('Overflow Inventory'), centerTitle: true, leading: IconButton( icon: const Icon(Icons.arrow_back), onPressed: () { Navigator.pop(context); }, ), ), body: Column( children: [ Row( children: [ Expanded( flex: 1, child: ListTile( title: const Text('Check In'), leading: Radio<CheckInOutType>( value: CheckInOutType.checkIn, groupValue: selectedCheckInOut, onChanged: (CheckInOutType? value) { setState(() { selectedCheckInOut = value; }); clearFields(); }, ), ), ), Expanded( flex: 1, child: ListTile( title: const Text('Check Out'), leading: Radio<CheckInOutType>( value: CheckInOutType.checkOut, groupValue: selectedCheckInOut, onChanged: (CheckInOutType? value) { setState(() { selectedCheckInOut = value; }); clearFields(); }, ), ), ), ], ), Row( children: [ Expanded( child: Text('${selectedCheckInOut == CheckInOutType.checkOut ? 'From' : 'To'} Location:', style: const TextStyle(fontSize: 18, fontWeight: FontWeight.w700)) ), Expanded( child: TextField( focusNode: locFocusNode, controller: locController, ) ), ], ), ], ), ); } }
内容的提问来源于stack exchange,提问作者TheMortiestMorty
相关产品推荐
相关产品推荐

