Виджет SearchAnchor

Виджет SearchAnchor открывает view с подсказками при вводе. Поле строят в builder с SearchController, список подсказок - в suggestionsBuilder, закрытие - через controller.closeView(). Альтернатива - showSearch с SearchDelegate.

Синтаксис

SearchAnchor(
	builder: (BuildContext context, SearchController controller) {
		return SearchBar(controller: controller, hintText: 'abcde');
	},
	suggestionsBuilder: (BuildContext context, SearchController controller) {
		return [
			ListTile(title: Text('12345')),
		];
	},
)

Параметры

Параметр	Описание
`builder`	Строит `SearchBar` или другой якорь с controller.
`suggestionsBuilder`	Возвращает список виджетов подсказок по текущему запросу.

Методы

Метод	Описание
`bar`	Фабрика `SearchBar`, уже связанная с anchor.

Пример

Давайте покажем SearchAnchor в теле Scaffold:

import 'package:flutter/material.dart';

void main()
{
	runApp(
		MaterialApp(
			home: Scaffold(
				body: Padding(
					padding: EdgeInsets.all(16),
					child: SearchAnchor(
						builder: (context, controller) {
							return SearchBar(
								controller: controller,
								hintText: 'abcde',
							);
						},
						suggestionsBuilder: (context, controller) {
							return [
								ListTile(title: Text('12345')),
							];
						},
					),
				),
			),
		),
	);
}

По нажатию на поле откроется view с подсказкой '12345'.

Пример

Давайте отфильтруем подсказки по тексту controller:

import 'package:flutter/material.dart';

void main()
{
	runApp(const MaterialApp(home: SearchAnchorDemo()));
}

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

	@override
	Widget build(BuildContext context)
	{
		return Scaffold(
			body: SearchAnchor(
				builder: (context, controller) {
					return SearchBar(
						controller: controller,
						hintText: '12345',
					);
				},
				suggestionsBuilder: (context, controller) {
					final query = controller.text;
					if (query.isEmpty) {
						return [ListTile(title: Text('abcde'))];
					}
					return [
						ListTile(title: Text(query)),
					];
				},
			),
		);
	}
}

Подсказки меняются по мере ввода в SearchBar.

Смотрите также

виджет SearchBar,
поле поиска в builder
класс SearchController,
текст и openView
функция showSearch,
маршрут с SearchDelegate
метод bar,
готовый SearchBar для anchor