FloatingActionButton появляется на панели приложений вместо нижней панели навигации.

Я ожидал увидеть FloatingActionButton в середине нижней панели навигации. Как поместить FloatingActionButton внизу экрана и объяснить, почему теперь он вверху экрана?

      class _BTMState extends State<BTM> {
  int currentIndex = 0;
  @override
  Widget build(BuildContext context) {
    return SafeArea(
      child: Scaffold(
        bottomNavigationBar: CupertinoTabScaffold(
          tabBar: CupertinoTabBar(
            backgroundColor: Colors.white,
            activeColor: Colors.blue,
            inactiveColor: const Color.fromARGB(228, 159, 203, 240),
            iconSize: 40,
            height: 70,
            border: const Border(
                top: BorderSide(width: 1, color: Colors.grey),
                bottom: BorderSide(width: 16, color: Colors.blue)),
            currentIndex: 0,
            items: const <BottomNavigationBarItem>[
              BottomNavigationBarItem(
                icon: Icon(Icons.home),
                label: '',
              ),
              BottomNavigationBarItem(
                icon: Icon(Icons.favorite),
                label: '',
              ),
            ],
          ),
          tabBuilder: (context, index) {
            switch (index) {
              case 0:
                return CupertinoTabView(builder: (context) {
                  return const CupertinoPageScaffold(
                    child: Categories(),
                  );
                });
              case 1:
                return CupertinoTabView(builder: (context) {
                  return const CupertinoPageScaffold(
                    child: FavPage(),
                  );
                });
              default:
                return CupertinoTabView(builder: (context) {
                  return const CupertinoPageScaffold(
                    child: HomePage(),
                  );
                });
            }
          },
        ),
        floatingActionButtonLocation: FloatingActionButtonLocation.centerDocked,
        floatingActionButton: FloatingActionButton(
          onPressed: () {
            onTabTapped(0);
          },
          tooltip: "Message",
          elevation: 4.0,
          backgroundColor: Colors.blue,
          child: const Icon(Icons.shopping_cart, color: Colors.white),
        ),
      ),
    );
  }

  void onTabTapped(int index) {
    setState(() {
      currentIndex = index;
    });
  }
}

0 ответов

Другие вопросы по тегам