首页 > 解决方案 > 打开应用后 Flutter 底部导航栏默认页面

问题描述

进入我的应用程序后,如何将 HomePage() 设置为我的默认页面?我的应用程序设计将主页按钮放在底部导航栏的中间。

底部导航栏很好,效果很好,从中间开始,但页面总是从 CameraPage()

代码看起来像这样

void main() {
  runApp(MyApp());
}

class MyApp extends StatelessWidget {
  // This widget is the root of your application.
  @override
  Widget build(BuildContext context) {
    return MaterialApp(
      title: 'Flutter Demo',
      theme: ThemeData(
        primarySwatch: Colors.cyan,
      ),
      home: Home(),
    );
  }
}

这是 Home()

class Home extends StatefulWidget {
  Home({Key key}) : super(key: key);

  @override
  _HomeState createState() => _HomeState();
}

class _HomeState extends State<Home> {
  PageController _pageController = new PageController();
  List<Widget> _screens = [
    CameraPage(),
    HomePage(),
    InventoryPage(),
  ];

  int _selectedIndex = 0;
  void _onPagedChanged(int index) {
    setState(() {
      _selectedIndex = index;
    });
  }

  void _onItemTapped(int selectedIndex) {
    _pageController.jumpToPage(selectedIndex);
  }

  @override
  Widget build(BuildContext context) {
    return Scaffold(
      backgroundColor: Color(0xfff8f5f1),
      bottomNavigationBar: CurvedNavigationBar(
        index: _selectedIndex,
        onTap: _onItemTapped,
        items: <Widget>[
          ImageIcon(
            AssetImage(''),
            size: 30,
          ),
          ImageIcon(
            AssetImage(''),
            size: 30,
          ),
          ImageIcon(
            AssetImage(''),
            size: 30,
          ),
        ],
      ),
      body: PageView(
        controller: _pageController,
        children: _screens,
        onPageChanged: _onPagedChanged,
      ),
    );
  }
}

标签: flutterflutter-bottomnavigation

解决方案


好的,我找到了解决方案,因为

int _selectedIndex = 1;

只设置默认导航栏位置而不是页面。

所以我使用 PageController 中的 initialPage 添加 iniState 以将 Home() 设置为我的默认页面

@override
  void initState() {
    super.initState();
    _pageController = PageController(initialPage: 1);
  }

推荐阅读