Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

[Bug] Suggestion box closes on scroll if the typeahead is wrapped in a scroll view #610

Open
BunnyBuddy opened this issue Nov 5, 2024 · 0 comments
Labels
bug Something isn't working

Comments

@BunnyBuddy
Copy link

Steps to reproduce

Wrap the typeahead in a scroll view maybe a SingleChildScrollView().
If we scroll the suggestions box, the keyboard closes as well as the suggestions box even with,

hideKeyboardOnDrag: false,
hideWithKeyboard: false,

But this only happens when we wrap it in a scrolling widget, otherwise it works fine.

Expected results

It shouldn't close the suggestions box on drag.

Actual results

Closing the suggestions box on drag

Package Version

5.2.0

Platform

Android, iOS

Code sample

Code sample
final SuggestionsController<AutocompletePrediction> suggestionsController = SuggestionsController();
ScrollController? scrollControllerTypeAhead;

TypeAheadField<AutocompletePrediction>(
                          scrollController: scrollControllerTypeAhead,
                          constraints: BoxConstraints(
                            maxHeight: 0.42.sh,
                          ),
                          suggestionsController: suggestionsController,
                          showOnFocus: true,
                          hideOnLoading: true,
                          hideOnEmpty: true,
                          hideKeyboardOnDrag: false,
                          hideWithKeyboard: false,
                          hideOnUnfocus: false,
                          debounceDuration: const Duration(milliseconds: 750),
                          builder: (context, suggestionController, focusNode) {
                            return TextFormField(
                              controller: cartController.shipAddress1.value,
                              validator: (value) => validateDefault(value, hint: "Address"),
                              focusNode: focusNode,
                              onChanged: (val) {
                                suggestionController.text = val;
                              },
                              style: ThemeStyles.NORMAL_STYLE_LIGHT,
                              decoration: InputDecoration(
                                hintText: 'Address',
                                enabledBorder: OutlineInputBorder(
                                  borderRadius: BorderRadius.circular(8.r),
                                  borderSide: BorderSide(color: Colors.grey),
                                ),
                                focusedBorder: OutlineInputBorder(
                                  borderRadius: BorderRadius.circular(8.r),
                                  borderSide: BorderSide(color: Colors.grey),
                                ),
                                focusedErrorBorder: OutlineInputBorder(
                                  borderRadius: BorderRadius.circular(8.r),
                                  borderSide: BorderSide(color: Colors.grey),
                                ),
                                errorBorder: OutlineInputBorder(
                                  borderRadius: BorderRadius.circular(8.r),
                                  borderSide: BorderSide(color: Colors.red),
                                ),
                                errorStyle: TextStyle(
                                  color: Colors.red,
                                  fontSize: 12.sp,
                                  fontWeight: FontWeight.w500,
                                ),
                                filled: true,
                                fillColor: Colors.white,
                                contentPadding: EdgeInsets.symmetric(vertical: 12.h, horizontal: 12.w),
                              ),
                              textInputAction: TextInputAction.next,
                            );
                          },
                          suggestionsCallback: (String pattern) async {
                            if (pattern != null && pattern.trim().isNotEmpty) {
                              return await cartController.autoCompleteSearchAddress(value: pattern.trim());
                            } else {
                              suggestionsController.suggestions?.clear();
                              return <AutocompletePrediction>[];
                            }
                          },
                          itemSeparatorBuilder: (BuildContext context, int index) => Divider(
                            height: 1.h,
                            color: Colors.grey[100],
                          ),
                          decorationBuilder: (context, child) => Material(
                            type: MaterialType.card,
                            elevation: 4,
                            color: Constant.backgroundColor,
                            borderRadius: BorderRadius.circular(8.r),
                            child: child,
                          ),
                          itemBuilder: (context, AutocompletePrediction suggestion) {
                            return ListTile(
                              leading: Icon(
                                Icons.pin_drop,
                                color: Constant.bottomBarColor,
                                size: 30.h,
                              ),
                              horizontalTitleGap: 14.w,
                              minLeadingWidth: 2.4.w,
                              title: Text(
                                suggestion.description!,
                                style: ThemeStyles.NORMAL_STYLE,
                              ),
                            );
                          },
                          onSelected: (AutocompletePrediction suggestion) async {
                            suggestionsController.unfocus();
                            suggestionsController.close();
                            cartController.getDetails(placeId: suggestion.placeId!, ship: true);
                          },
                        ),

Logs

Logs
[Paste your logs here]

Screenshots or Video

Screenshots / Video demonstration [Upload media here]
@BunnyBuddy BunnyBuddy added the bug Something isn't working label Nov 5, 2024
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
bug Something isn't working
Projects
None yet
Development

No branches or pull requests

1 participant