-
Notifications
You must be signed in to change notification settings - Fork 29.7k
Description
Is there an existing issue for this?
- I have searched the existing issues
- I have read the guide to filing a bug
Steps to reproduce
- Run code sample.
- Open search view by clicking on the bar.
- Click on the arrow of a suggestions to update controller value.
Expected results
suggestionsBuilder should now rebuild as controller value was updated.
Actual results
suggestionsBuilder doesn't rebuild and forces user to make additional updates to controller value with keyboard, submit the new controller value by clicking return on the keyboard, or open and close the search view if you run Flutter Web (official example have the exact same flaw: https://api.flutter.dev/flutter/material/SearchAnchor/SearchAnchor.bar.html).
For an illustration of a working example try Chrome or YouTube or practically any other app with search suggestions implemented. When you fill the text field from a suggestion in any of these apps the suggestion view will update accordingly.
As setState won't trigger a rebuild, the only way around this is to stop using the widget as it was intended and implement your own state management solution around this, e.g. using a single widget that controls a deeper array of widgets based on state changes. And I really don't think this was the idea when designing this from the beginning.
Either make suggestionsBuilder rebuild on controller value changes or give developers some sort of manual control over rebuilds. As it stands, developers have no control over it whatsoever, which seems very weird and I cannot believe it being a design choice.
Code sample
Code sample
import 'package:flutter/material.dart';
void main() {
runApp(const MyApp());
}
final data = ['foo', 'bar', 'baz'];
final history = ['fo', 'az'];
class MyApp extends StatelessWidget {
const MyApp({super.key});
@override
Widget build(BuildContext context) {
return MaterialApp(
title: 'Flutter Demo',
theme: ThemeData(
colorScheme: ColorScheme.fromSeed(
seedColor: Colors.deepPurple,
),
useMaterial3: true,
),
home: Scaffold(
body: SafeArea(
child: SearchAnchor.bar(
suggestionsBuilder: (_, controller) {
if (controller.text.isNotEmpty) {
final results = [
for (var dataEntity in data)
if (dataEntity.contains(controller.text)) dataEntity,
];
if (results.isNotEmpty) {
return [
for (var result in results)
ListTile(
title: Text(
result,
),
),
];
}
}
return [
for (var historyEntry in history)
ListTile(
title: Text(
historyEntry,
),
trailing: IconButton(
onPressed: () => controller.text = historyEntry,
icon: Transform.flip(
flipX: true,
child: const Icon(
Icons.arrow_outward,
),
),
),
),
];
},
),
),
),
);
}
}Screenshots or Video
Screenshots / Video demonstration
searchanchor_issue.webm
Logs
Logs
[Paste your logs here]Flutter Doctor output
Doctor output
[✓] Flutter (Channel beta, 3.13.0-0.2.pre, on macOS 13.4.1 22F770820d darwin-arm64, locale en-GB)
• Flutter version 3.13.0-0.2.pre on channel beta at /Users/per/dev/flutter
• Upstream repository https://github.com/flutter/flutter.git
• Framework revision ac71592bc6 (3 weeks ago), 2023-07-18 14:53:57 -0600
• Engine revision e14db68a86
• Dart version 3.1.0 (build 3.1.0-262.2.beta)
• DevTools version 2.25.0
[✓] Android toolchain - develop for Android devices (Android SDK version 31.0.0)
• Android SDK at /Users/per/Library/Android/sdk
• Platform android-33, build-tools 31.0.0
• Java binary at: /Applications/Android Studio.app/Contents/jbr/Contents/Home/bin/java
• Java version OpenJDK Runtime Environment (build 17.0.6+0-17.0.6b829.9-10027231)
• All Android licenses accepted.
[✓] Xcode - develop for iOS and macOS (Xcode 14.3.1)
• Xcode at /Applications/Xcode.app/Contents/Developer
• Build 14E300c
• CocoaPods version 1.12.1
[✓] Chrome - develop for the web
• Chrome at /Applications/Google Chrome.app/Contents/MacOS/Google Chrome
[✓] Android Studio (version 2022.3)
• 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.6+0-17.0.6b829.9-10027231)
[✓] VS Code (version 1.81.0)
• VS Code at /Applications/Visual Studio Code.app/Contents
• Flutter extension version 3.70.0
[✓] Connected device (3 available)
• sdk gphone64 arm64 (mobile) • emulator-5554 • android-arm64 • Android 13 (API 33) (emulator)
• macOS (desktop) • macos • darwin-arm64 • macOS 13.4.1 22F770820d darwin-arm64
• Chrome (web) • chrome • web-javascript • Google Chrome 115.0.5790.170
[✓] Network resources
• All expected network resources are available.
• No issues found!