Как создать панель поиска и прокрутить список (созданный с помощью StreamBuilder и Listview из FireStore)? - PullRequest
Новая
       4

Как создать панель поиска и прокрутить список (созданный с помощью StreamBuilder и Listview из FireStore)?

0 голосов
/ 02 февраля 2020

Я относительно плохо знаком с флаттером / дротиком и пытаюсь заставить работать форматирование на одной из моих страниц. Мне бы хотелось, чтобы вверху находилась строка поиска, за которой следовал бы список (заполненный информацией из Firestore), и я хочу, чтобы они прокручивались вместе, а не просто список.

Вот часть моего кода, так что далеко: 

  return Column (children: <Widget>[
    TextField(
        controller: _controller,
        onSubmitted: (String value) async {
          await showDialog<void>(
            context: context,
            builder: (BuildContext context) {
              return AlertDialog(
                title: const Text('Thanks!'),
                content: Text('You typed "$value".'),
                actions: <Widget>[
                  FlatButton(
                    onPressed: () {
                      Navigator.pop(context);
                    },
                    child: const Text('OK'),
                  ),
                ],
              );
            },
          );
        }),
    Expanded(child: buildLearnCards(context))
  ]);
}

Widget buildLearnCards(BuildContext context) {
  return StreamBuilder(

Как мне go об этом?

1 Ответ

0 голосов
/ 02 февраля 2020

Я попытаюсь дать общее описание того, как это реализовать, поскольку для этого требуется немного инфраструктуры и знаний государственного управления. Я бы рекомендовал использовать provider для управления состоянием. В конструкторе вашего провайдера / модели получите список документов из Firestore и сохраните его в списке. Затем используйте этот учебник , чтобы отфильтровать ваши документы по текстовому полю поиска. Каждый раз, когда вызывается метод filterSearchResults, вызывайте notifyListeners() в конце вашей функции. Затем в вашем списке документов в вашем виджете используйте Consumer, как указано в этом руководстве, чтобы получить список документов от вашего провайдера и отобразить в ListView так, как вы хотите. Надеюсь, что это поможет, и задавайте любые вопросы, если вы сталкиваетесь с проблемами.

...