user-interface - Flutter tabBar如何上下变化

Question

我是 Dart Flutter 的新手。

我有这个问题我按照指南创建标签栏，
但在顶部，我想要实现的是拥有标签
在底部而不是顶部。

我已经尝试过 BottomNavigationBar 并全部更改，
但没有工作并使所有应用程序崩溃。

请帮帮我谢谢

child: Scaffold(
    body: DefaultTabController(
      length: 5,
      initialIndex: 2,
      child: Scaffold(
          appBar: AppBar(
            elevation: 0,
            backgroundColor: primaryColor,
            automaticallyImplyLeading: false,
            title: TabBar(

                labelColor: Colors.white,
                indicatorColor: Colors.white,
                unselectedLabelColor: Colors.black,
                isScrollable: false,
                indicatorSize: TabBarIndicatorSize.label,
                tabs: [
                  Tab(
                    icon: Icon(
                      Icons.person,
                      size: 30,
                    ),
                  ),
                  Tab(
                    icon: Icon(
                      Icons.group,
                    ),
                  ),
                  Tab(
                    icon: Icon(
                      Icons.whatshot,
                    ),
                  ),
                  Tab(
                    icon: Icon(
                      Icons.notifications,
                    ),
                  ),
                  Tab(
                    icon: Icon(
                      Icons.message,
                    ),
                  )
                ]),
          ),
          body: TabBarView(
            children: [
              Center(child: Profile(currentUser)),
              Center(child: Chanels()),
              Center(child: CardPictures(currentUser, users)),
              Center(child: Notifications(currentUser, notification)),
              Center(child: HomeScreen(currentUser, matches)),
            ],
            physics: NeverScrollableScrollPhysics(),
          )),
    ),
  ),

Answer 1

您可以通过这种方式使用 BottomNavigationBar()。
您需要管理所有内容(例如监听选项卡事件并相应地呈现页面)。

原型(prototype) :

class _TabsScreenState extends State<TabsScreen> {
  final var  _pages = [Screen1(),Screen2()];

  int page_index = 0;

  void _pageSelect(int index) {
    setState(() {
      page_index = index;
    });
  }

  @override
  Widget build(BuildContext context) {
    return Scaffold(
      appBar: AppBar(
        title: Text(),
      ),
      body: _pages[page_index],
      bottomNavigationBar: BottomNavigationBar(
        onTap: _pageSelect,
        backgroundColor: '',
        unselectedItemColor: '',
        selectedItemColor: '',
        currentIndex: page_index,

        items: [
          BottomNavigationBarItem(
            backgroundColor: '',
            icon: Icon(''),
            title: Text(''),
          ),
          BottomNavigationBarItem(
            backgroundColor: '',
            icon: Icon('),
            title: Text(''),
          ),
        ],
      ),
    );
  }
}