在flutter中与textformfield小部件交互时重建OverlyEntry ?

Question

我创建了一个基本的OverlyEntry

我创建了一个基本的OverlyEntry来显示一些像搜索一样的想法，当我仍然在textfromfield中写作时，仍然重建OverlyEntry构建器，当尝试打开dropDownButton重建时。

我试图修复它，但无论如何，它没有工作。

final FocusNode _focusNode = FocusNode();
final GlobalKey globalKey = LabeledGlobalKey('OverlayEntry');

,

@override
void initState() {
_focusNode.addListener(() {
if (_focusNode.hasFocus) {
print('showed');
_overlayEntry = _createOverlayEntry();
Overlay.of(context)!.insert(_overlayEntry);
} else {
_overlayEntry.remove();
}
});
}

,

OverlayEntry _createOverlayEntry() {
RenderBox renderBox = globalKey.currentContext!.findRenderObject() as RenderBox;
var size = renderBox.size;
var offset = renderBox.localToGlobal(Offset.zero);
return OverlayEntry(
maintainState: true,
builder: (context) {
print('OverlayEntry');
return Builder( 
builder: (context) {
return Positioned(
left: offset.dx,
top: offset.dy + size.height + 5.0,
width: size.width,
child: Material(
elevation: 4.0,
child: ListView(
padding: EdgeInsets.zero,
shrinkWrap: true,
children: const [
ListTile(
title: Text('Syria'),
),
ListTile(
title: Text('Lebanon'),
),
ListTile(
title: Text('Lebanon'),
),ListTile(
title: Text('Lebanon'),
)
],
),
),
);
}
);
});
}

,

@override
Widget build(BuildContext context) {
return Scaffold(
body: Center(
widthFactor: 50,
child: TextFormField(
key: globalKey,
focusNode: _focusNode,
decoration: const InputDecoration(labelText: 'Country'),
),
),
);
}

Answer 1

使用状态管理工具，事件和函数都写在状态管理工具上