Flutter BottomNavigationBarItem принимает только Icon и никаких других виджетов? - PullRequest
Новая
       21

Flutter BottomNavigationBarItem принимает только Icon и никаких других виджетов?

3 голосов
/ 05 июня 2019

В нашем проекте Flutter Cupertino нам нужно показать значок на одном из значков нижней панели. Сколько уже товаров в корзине, если быть точным.

Я пробовал разные виджеты и решения, представленные здесь, но BottomNavigationBarItem принимает только icon: Icon(..) и ничего больше. Если я, например, вместо icon: Icon(..) поставлю icon: Stack(..), появятся сообщения об ошибках, например «Неверное значение константы ...»

Вот пример кода: 

class CupertinoStoreHomePage extends StatelessWidget {
  @override
  Widget build(BuildContext context) {
    return CupertinoTabScaffold(
      tabBar: CupertinoTabBar(
        items: const <BottomNavigationBarItem>[
          BottomNavigationBarItem(
            icon: Icon(CupertinoIcons.home),
            title: Text('Kühlschrank'),
          ),
          BottomNavigationBarItem(
            icon: Icon(CupertinoIcons.profile_circled),
            title: Text('Konto'),
          ),
          BottomNavigationBarItem(
            icon: Icon(CupertinoIcons.shopping_cart),
            title: Text('Warenkorb'),
          ),
        ],
      ),

Так что если я не смогу ничего поставить вместо Icon(..). Нет другого виджета, нет Stack(..).

Почему? Как можно поставить какой-нибудь другой виджет, например Badge(..): 

badges: ^1.0.2
import 'package:badges/badges.dart';

Этот вопрос отличается от возможного дубликата, поскольку я уже попробовал опубликованное там решение и до сих пор не могу использовать стек (..), а только значок (..).

1 Ответ

3 голосов
/ 05 июня 2019

Я попытался воспроизвести проблему, но она работает после нескольких изменений. Прежде всего, свойство icon исключает Widget и, следовательно, не только Icon, так что это не проблема.

Однако я заметил, что в items: const <BottomNavigationBarItem>[ вы должны удалить ключевое слово const, так как оно необязательно и также не является константой.

И, наконец, вам нужно добавить конструктор вкладок к CupertinoTabScaffold, это в основном возвращает то, что отображается над нижней панелью навигации.

Ваш окончательный код выглядит следующим образом: 

return CupertinoTabScaffold(
      tabBuilder: (BuildContext context, int i) {
        return CupertinoActivityIndicator();
      },
      tabBar: CupertinoTabBar(
        items: <BottomNavigationBarItem>[
          BottomNavigationBarItem(
            icon: Badge(
              badgeContent: Text('3'),
              child: Icon(Icons.settings),
            ),
            title: Text('Kühlschrank'),
          ),
          BottomNavigationBarItem(
            icon: Icon(CupertinoIcons.profile_circled),
            title: Text('Konto'),
          ),
          BottomNavigationBarItem(
            icon: Icon(CupertinoIcons.shopping_cart),
            title: Text('Warenkorb'),
          ),
        ],
      ),
    );
...