扑来 - 更改TextField自动完成位置
我正在使用Flutter的自动完成,但我想将其显示在Textfield上方。这可能吗?
这是基本设置:
Autocomplete<String>(
optionsBuilder: (TextEditingValue textEditingValue) {
if (textEditingValue.text == '') {
return const Iterable<String>.empty();
}
if (textEditingValue.text.contains('...')) {
return widget.myBloc.names
.where((String option) {
return option.contains(
textEditingValue.text.toLowerCase());
});
} else {
return const Iterable<String>.empty();
}
},
onSelected: (String selection) {
log('selection -> $selection');
},
optionsMaxHeight: 40,
fieldViewBuilder: (context, controller, focusNode,
onEditingComplete) {
return TextField();
}
)
I'm using Flutter's Autocomplete but I would like to have it display above the TextField. Is this possible?
Here's the base setup:
Autocomplete<String>(
optionsBuilder: (TextEditingValue textEditingValue) {
if (textEditingValue.text == '') {
return const Iterable<String>.empty();
}
if (textEditingValue.text.contains('...')) {
return widget.myBloc.names
.where((String option) {
return option.contains(
textEditingValue.text.toLowerCase());
});
} else {
return const Iterable<String>.empty();
}
},
onSelected: (String selection) {
log('selection -> $selection');
},
optionsMaxHeight: 40,
fieldViewBuilder: (context, controller, focusNode,
onEditingComplete) {
return TextField();
}
)
如果你对这篇内容有疑问,欢迎到本站社区发帖提问 参与讨论,获取更多帮助,或者扫码二维码加入 Web 技术交流群。

绑定邮箱获取回复消息
由于您还没有绑定你的真实邮箱,如果其他用户或者作者回复了您的评论,将不能在第一时间通知您!
发布评论
评论(1)
我发现了一下,但是您不喜欢答案...
在flutter图书馆中/widgets/autocomplete.dart#l367“ rel =“ nofollow noreferrer”>在Rawautocomplete实现的第367行上,他们对其对齐方式进行了硬编码以跟踪
textfield
的textfield
。我只能在复制其整个实施后才能绕过此操作,并执行以下操作:targetandanter:alignment.topleft
followeranchor:alignment.bottomleft.bottomleft
OptionViewsBuilder
wherever you decide to implement it,I figured it out, but you're not gonna like the answer...
In the Flutter library, on line 367 of the RawAutocomplete implementation, they hardcoded its alignment to track the bottom left of the
TextField
. I was able to circumvent this only after copying their entire implementation, and doing the following:targetAnchor: Alignment.topLeft
followerAnchor: Alignment.bottomLeft
OptionViewsBuilder
wherever you decide to implement it, shown here in the material Autocomplete implementation, change toalignment: Alignment.bottomLeft
.