OptionsViewOpenDirection.up in (Raw)AutoComplete makes the autocomplete list disappear.

Steps to reproduce

The issue was already addressed (and purportedly resolved) in #138773, but is still reproducible in the exact same way with the latest stable flutter version, even in the online editor. I will add the same reproduction because the issue still persists.

Go to https://api.flutter.dev/flutter/material/Autocomplete-class.html
In any of the code samples, add optionsViewOpenDirection: OptionsViewOpenDirection.up, to the Autocomplete widget and click Run.
Type 'a' in the text field
No options show up
Change OptionsViewOpenDirection.up to OptionsViewOpenDirection.down, click Run again and type 'a' in the text field. It works.

Expected results

The list with options appears above the textfield

Actual results

Nothing appears

Code sample

import 'package:flutter/material.dart';

/// Flutter code sample for [RawAutocomplete].

void main() => runApp(const AutocompleteExampleApp());

class AutocompleteExampleApp extends StatelessWidget {
  const AutocompleteExampleApp({super.key});

  @override
  Widget build(BuildContext context) {
    return MaterialApp(
      home: Scaffold(
        appBar: AppBar(
          title: const Text('RawAutocomplete Basic'),
        ),
        body: const Center(
          child: AutocompleteBasicExample(),
        ),
      ),
    );
  }
}

class AutocompleteBasicExample extends StatelessWidget {
  const AutocompleteBasicExample({super.key});

  static const List<String> _options = <String>[
    'aardvark',
    'bobcat',
    'chameleon',
  ];

  @override
  Widget build(BuildContext context) {
    return RawAutocomplete<String>(
      optionsBuilder: (TextEditingValue textEditingValue) {
        return _options.where((String option) {
          return option.contains(textEditingValue.text.toLowerCase());
        });
      },
      fieldViewBuilder: (
        BuildContext context,
        TextEditingController textEditingController,
        FocusNode focusNode,
        VoidCallback onFieldSubmitted,
      ) {
        return TextFormField(
          controller: textEditingController,
          focusNode: focusNode,
          onFieldSubmitted: (String value) {
            onFieldSubmitted();
          },
        );
      },
      optionsViewOpenDirection: OptionsViewOpenDirection.up,
      optionsViewBuilder: (
        BuildContext context,
        AutocompleteOnSelected<String> onSelected,
        Iterable<String> options,
      ) {
        return Align(
          alignment: Alignment.topLeft,
          child: Material(
            elevation: 4.0,
            child: SizedBox(
              height: 200.0,
              child: ListView.builder(
                padding: const EdgeInsets.all(8.0),
                itemCount: options.length,
                itemBuilder: (BuildContext context, int index) {
                  final String option = options.elementAt(index);
                  return GestureDetector(
                    onTap: () {
                      onSelected(option);
                    },
                    child: ListTile(
                      title: Text(option),
                    ),
                  );
                },
              ),
            ),
          ),
        );
      },
    );
  }
}

Screenshots or Video

Screenshots / Video demonstration

[Upload media here]

Logs

[Paste your logs here]

Flutter Doctor output

Doctor output

[✓] Flutter (Channel stable, 3.24.0, on macOS 14.4.1 23E224 darwin-arm64, locale en-BE)
    • Flutter version 3.24.0 on channel stable at /Users/ghijs/development/flutter
    • Upstream repository https://github.com/flutter/flutter.git
    • Framework revision 80c2e84975 (13 days ago), 2024-07-30 23:06:49 +0700
    • Engine revision b8800d88be
    • Dart version 3.5.0
    • DevTools version 2.37.2

[✓] Android toolchain - develop for Android devices (Android SDK version 35.0.0)
    • Android SDK at /Users/ghijs/Library/Android/sdk
    • Platform android-35, build-tools 35.0.0
    • Java binary at: /Applications/Android Studio.app/Contents/jbr/Contents/Home/bin/java
    • Java version OpenJDK Runtime Environment (build 17.0.11+0-17.0.11b1207.24-11852314)
    • All Android licenses accepted.

[✓] Xcode - develop for iOS and macOS (Xcode 15.0)
    • Xcode at /Applications/Xcode 15.app/Contents/Developer
    • Build 15A240d
    • CocoaPods version 1.15.2

[✗] Chrome - develop for the web (Cannot find Chrome executable at /Applications/Google Chrome.app/Contents/MacOS/Google Chrome)
    ! Cannot find Chrome. Try setting CHROME_EXECUTABLE to a Chrome executable.

[✓] Android Studio (version 2024.1)
    • Android Studio at /Applications/Android Studio.app/Contents
    • Flutter plugin can be installed from:
      🔨 https://plugins.jetbrains.com/plugin/9212-flutter
    • Dart plugin can be installed from:
      🔨 https://plugins.jetbrains.com/plugin/6351-dart
    • Java version OpenJDK Runtime Environment (build 17.0.11+0-17.0.11b1207.24-11852314)

[✓] VS Code (version 1.91.0)
    • VS Code at /Applications/Visual Studio Code.app/Contents
    • Flutter extension version 3.94.0

[✓] Connected device (3 available)
    • iPhone 15 (mobile)              • 5E510911-C117-479B-93E4-3F8281DA7A19 • ios          • com.apple.CoreSimulator.SimRuntime.iOS-17-4
      (simulator)
    • macOS (desktop)                 • macos                                • darwin-arm64 • macOS 14.4.1 23E224 darwin-arm64
    • Mac Designed for iPad (desktop) • mac-designed-for-ipad                • darwin       • macOS 14.4.1 23E224 darwin-arm64
    ! Device emulator-5562 is offline.

[✓] Network resources
    • All expected network resources are available.

! Doctor found issues in 1 category.

Reproducible using the sample provided above.

This is not a recent regression, it seems like the fix didn't take. I tested on stable 3.22.0,3 as well as the latest stable and master and the issue reproduced on all versions. (3.22.0 is the first stable version the fix for this appears in)

flutter doctor -v

[!] Flutter (Channel stable, 3.24.0, on macOS 14.5 23F79 darwin-arm64, locale en-GB)
    • Flutter version 3.24.0 on channel stable at /Users/nexus/dev/sdks/flutter
    ! Warning: `flutter` on your path resolves to /Users/nexus/dev/sdks/flutters/bin/flutter, which is not inside your current Flutter SDK checkout at /Users/nexus/dev/sdks/flutter. Consider adding /Users/nexus/dev/sdks/flutter/bin to the front of your path.
    ! Warning: `dart` on your path resolves to /Users/nexus/dev/sdks/flutters/bin/dart, which is not inside your current Flutter SDK checkout at /Users/nexus/dev/sdks/flutter. Consider adding /Users/nexus/dev/sdks/flutter/bin to the front of your path.
    • Upstream repository https://github.com/flutter/flutter.git
    • Framework revision 80c2e84975 (13 days ago), 2024-07-30 23:06:49 +0700
    • Engine revision b8800d88be
    • Dart version 3.5.0
    • DevTools version 2.37.2
    • If those were intentional, you can disregard the above warnings; however it is recommended to use "git" directly to perform update checks and upgrades.

[✓] Flutter (Channel master, 3.24.0-1.0.pre.546, on macOS 14.5 23F79 darwin-arm64, locale en-GB)
    • Flutter version 3.24.0-1.0.pre.546 on channel master at /Users/nexus/dev/sdks/flutters
    • Upstream repository https://github.com/flutter/flutter.git
    • Framework revision 8e18b5a331 (10 hours ago), 2024-08-11 23:34:29 -0400
    • Engine revision 1a5e2e58d3
    • Dart version 3.6.0 (build 3.6.0-134.0.dev)
    • DevTools version 2.38.0

We think this falls under text input, but totally fine to kick it back if not. Thanks!

This was mentioned in #143249 (comment) and should be fixed in #143249, but that PR is a bit backed up at the moment. Thank you for opening an issue for this and hopefully I can get that moving soon.

@justinmc

This issue is assigned to @justinmc but has had no recent status updates. Please consider unassigning this issue if it is not going to be addressed in the near future. This allows people to have a clearer picture of what work is actually planned. Thanks!

Autocomplete Options Width (#143249)

Autocomplete Options Width (flutter#143249)

This thread has been automatically locked since there has not been any recent activity after it was closed. If you are still experiencing a similar issue, please open a new bug, including the output of flutter doctor -v and a minimal reproduction of the issue.

Autocomplete Options Width (#143249)

Navigation Menu

Repository navigation

OptionsViewOpenDirection.up in (Raw)AutoComplete makes the autocomplete list disappear. #153274

Steps to reproduce

Expected results

Actual results

Code sample

Screenshots or Video

Logs

Flutter Doctor output

Metadata

Assignees

Labels

Type

Projects

Milestone

Relationships

Development

OptionsViewOpenDirection.up in (Raw)AutoComplete makes the autocomplete list disappear. #153274

Description

Steps to reproduce

Expected results

Actual results

Code sample

Screenshots or Video

Logs

Flutter Doctor output

Activity

danagbemava-nc commented on Aug 12, 2024

Piinks commented on Aug 14, 2024

justinmc commented on Aug 15, 2024

flutter-triage-bot commented on Dec 20, 2024

github-actions commented on Jan 28, 2025

Metadata

Metadata

Assignees

Labels

Type

Projects

Milestone

Relationships

Development

Issue actions