Flutter速来系列23-4，沉浸式导航栏下的PageView，来也无形，去也无踪！

2024-01-15 16:48:10

在Flutter应用开发中，我们经常需要实现滑动切换页面的功能，比如引导页、图片轮播等。Flutter提供了一个非常实用的组件来满足我们的需求，那就是PageView。

在Flutter中，我们使用PageView组件来实现滑动切换页面的功能。PageView组件是一个可以水平或垂直滚动的组件，它可以包含多个子组件。当用户在PageView组件上滑动时，PageView组件会滚动其子组件，从而实现滑动切换页面的效果。

在Flutter中，可以使用PageView组件来实现引导页、图片轮播等功能。我们只需要在PageView组件中添加需要显示的页面即可。例如，我们可以使用PageView组件来实现一个简单的引导页，引导用户了解我们的应用程序。

class MyHomePage extends StatefulWidget {
  @override
  _MyHomePageState createState() => _MyHomePageState();
}

class _MyHomePageState extends State<MyHomePage> {
  PageController _pageController = PageController();
  int _currentIndex = 0;

  @override
  Widget build(BuildContext context) {
    return Scaffold(
      body: PageView(
        controller: _pageController,
        onPageChanged: (index) {
          setState(() {
            _currentIndex = index;
          });
        },
        children: [
          _buildPage("Page 1", Colors.red),
          _buildPage("Page 2", Colors.green),
          _buildPage("Page 3", Colors.blue),
        ],
      ),
    );
  }

  Widget _buildPage(String text, Color color) {
    return Container(
      color: color,
      child: Center(
        child: Text(text),
      ),
    );
  }
}