#flutter #autocomplete #typeahead
Вопрос:
Я создаю текстовое поле, содержащее предложения, с помощью TypeAheadField пакетов. Я хочу показывать предложение только при вводе пользователем (а не при нажатии пользователем на текстовое поле). Но как показывают в пабе [https://pub.dev/packages/flutter_typeahead][1], пример был тем, что я искал.
Мой код :
TypeAheadField(
textFieldConfiguration:
TextFieldConfiguration(
autofocus: false,
decoration: InputDecoration(
border: InputBorder.none,
focusedBorder:
InputBorder.none,
enabledBorder:
InputBorder.none,
errorBorder:
InputBorder.none,
disabledBorder:
InputBorder.none,
hintText: localization
.insertCustomerName,
),
controller:
_typeAheadController,
),
suggestionsCallback:
(pattern) async {
return await getSuggestions(
pattern);
},
hideSuggestionsOnKeyboardHide:
true,
hideOnEmpty: true,
itemBuilder: (context,
String suggestion) {
return Padding(
padding:
const EdgeInsets.all(
10.0),
child: Text(
suggestion,
),
);
},
onSuggestionSelected:
(String suggestion) {
_typeAheadController.text =
suggestion;
},
),
Спасибо
[1]: https://pub.dev/packages/flutter_typeahead
Ответ №1:
В вашей suggestionsCallback функции вы могли бы попробовать что-то вроде этого:
suggestionsCallback: (pattern) async {
if (pattern != null amp;amp; pattern.length > 0) {
return await getSuggestions(pattern);
} else {
return [];
}
},
Комментарии:
1. Спасибо за ваш ответ. Теперь он отлично работает, ценю это ;). У меня есть другие проблемы, из-за которых окно предложений, например, мигает на секунду, я не знаю, почему это происходит, или, может быть, оно загружает окно предложений. Это плохо, ха-ха-ха. Есть какое-нибудь решение для этого? Спасибо
2. ооо, только что нашел, добавьте свойство hideOnLoading: true.
Ответ №2:
для меня это прекрасно работает.
TypeAheadFormField(
direction: AxisDirection.down,
textFieldConfiguration: TextFieldConfiguration(
controller: controller,
style: primary14PxNormal.apply(color: blackColor),
autofocus: false,
enabled: true,
decoration: InputDecoration(
fillColor: whiteColor,
filled: true,
focusedBorder: textFormFieldBorderStyle,
disabledBorder: textFormFieldBorderStyle,
enabledBorder: textFormFieldBorderStyle,
errorBorder: textFormFieldBorderStyle,
focusedErrorBorder: textFormFieldBorderStyle,
contentPadding: EdgeInsets.fromLTRB(10.0, 16.0, 10.0, 16.0),
hintText: "Choose a Project",
hintStyle: primary14PxBold.copyWith(fontSize: isDisplayDesktop(context) ? 15 : 12,
fontWeight: FontWeight.w500,
color: hintTextColor),
border: new OutlineInputBorder(borderSide: new BorderSide(color: borderColor)),
suffixIcon: Icon(Icons.arrow_drop_down, color: primaryColor)),
onChanged: (text) {
setState(() {
clearCallback!();
});
},
),
validator: (value) {
return validationFunction != null ? validationFunction(value) : null;
},
suggestionsBoxDecoration: SuggestionsBoxDecoration(color: whiteColor),
suggestionsCallback: (pattern) async {
List<String> searchCityArray = [];
if(controller.text.length > 0){
searchCityArray.add(pattern);
return searchCityArray;
}
return searchCityArray;
},
errorBuilder: (context, error) {
return ListTile(
title: Text(
error.toString(),
style: primary14PxNormal.copyWith(color: titleColor),
),
);
},
itemBuilder: (context, String? project) {
return project == null
? new Container()
: ListTile(
title: Text(
project,
style: primary14PxNormal.copyWith(color: titleColor),
),
);
},
onSuggestionSelected: (String? suggestion) {
setState(() {
if (suggestion != null) {
FocusScope.of(context).unfocus();
controller.text = suggestion;
if (selectionCallBack != null) {
selectionCallBack(suggestion);
}
}
});
});