Skip to content

SearchAnchor View wrong position in nested navigator  #126435

@romaingyh

Description

@romaingyh

Is there an existing issue for this?

Steps to reproduce

  1. Create a Scaffold with a Row as body.
  2. Add a fixed width child in the row, like a Container or a SizedBox
  3. Add a Navigator as second child
  4. Make the navigator always returning a Widget with a SearchAnchor inside.

Expected results

The search view should be just under the Anchor or the SearchBar

Actual results

The view is translated in X axis by the width of the row's first child.

Code sample

Code sample
import 'package:flutter/material.dart';

void main() {
  runApp(const MyApp());
}

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

  @override
  Widget build(BuildContext context) {
    return MaterialApp(
      title: 'Flutter Demo',
      theme: ThemeData(useMaterial3: true),
      home: const MyHomePage(),
    );
  }
}

const _searchValues = ['Toulon', 'Marseille', 'Nice', 'Montpellier', 'Aix', 'Avignon'];

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

  @override
  Widget build(BuildContext context) {
    return Scaffold(
      body: Row(
        children: [
          Container(
            width: 200,
            color: Colors.red,
          ),
          Expanded(
            child: Navigator(
              onGenerateRoute: (settings) {
                return MaterialPageRoute(
                  builder: (context) {
                    return Scaffold(
                      body: SearchAnchor.bar(
                        suggestionsBuilder: (context, controller) {
                          final query = controller.text;
                          final matchs = _searchValues.where((element) => element.contains(query));

                          return [
                            for (final match in matchs)
                              ListTile(
                                title: Text(match),
                                onTap: () {
                                  controller.closeView(match);
                                },
                              )
                          ];
                        },
                      ),
                    );
                  },
                );
              },
            ),
          ),
        ],
      ),
    );
  }
}

Screenshots or Video

Screenshots / Video demonstration
Enregistrement.de.l.ecran.2023-05-10.a.17.54.30.mov

Logs

Logs
[Paste your logs here]

Flutter Doctor output

Doctor output
[✓] Flutter (Channel master, 3.11.0-2.0.pre.84, on macOS 13.3.1 22E261 darwin-arm64, locale fr-FR)
    • Flutter version 3.11.0-2.0.pre.84 on channel master at /Users/X/flutter_arm
    • Upstream repository https://github.com/flutter/flutter.git
    • Framework revision df789c9e76 (2 hours ago), 2023-05-10 06:42:25 -0700
    • Engine revision 8ca16cba8c
    • Dart version 3.1.0 (build 3.1.0-89.0.dev)
    • DevTools version 2.23.1

[✓] Android toolchain - develop for Android devices (Android SDK version 33.0.0)
    • Android SDK at /Users/X/Library/Android/sdk
    • Platform android-33, build-tools 33.0.0
    • Java binary at: /Applications/Android Studio.app/Contents/jbr/Contents/Home/bin/java
    • Java version OpenJDK Runtime Environment (build 11.0.15+0-b2043.56-8887301)
    • All Android licenses accepted.

[✓] Xcode - develop for iOS and macOS (Xcode 14.2)
    • Xcode at /Applications/Xcode.app/Contents/Developer
    • Build 14C18
    • CocoaPods version 1.12.0

[✓] Chrome - develop for the web
    • CHROME_EXECUTABLE = /Applications/Chromium.app/Contents/MacOS/Chromium

[✓] Android Studio (version 2022.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 11.0.15+0-b2043.56-8887301)

[✓] IntelliJ IDEA Ultimate Edition (version 2022.1.4)
    • IntelliJ at /Applications/IntelliJ IDEA.app
    • 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

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

[✓] Connected device (2 available)
    • macOS (desktop) • macos  • darwin-arm64   • macOS 13.3.1 22E261 darwin-arm64
    • Chrome (web)    • chrome • web-javascript • Chromium 112.0.5569.0

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

• No issues found!```

</details>

Metadata

Metadata

Assignees

Labels

f: material designflutter/packages/flutter/material repository.found in release: 3.10Found to occur in 3.10found in release: 3.11Found to occur in 3.11frameworkflutter/packages/flutter repository. See also f: labels.has reproducible stepsThe issue has been confirmed reproducible and is ready to work onr: fixedIssue is closed as already fixed in a newer version

Type

No type

Projects

No projects

Milestone

No milestone

Relationships

None yet

Development

No branches or pull requests

Issue actions