美文网首页
flutter ScrollPhysics

flutter ScrollPhysics

作者: Victory_886 | 来源:发表于2019-08-14 11:08 被阅读0次

flutter 之 ScrollPhysics的使用。

  double _currentPage = 0.0;
  final PageController _pageController = PageController();

  Widget _scrollPhysics() {
      return Container(
        height: 300,
        width: MediaQuery.of(context).size.width,
        child: LayoutBuilder(
          builder: (context, constraints) => NotificationListener(
            onNotification: (ScrollNotification note) {
              setState(() {
                _currentPage = _pageController.page;
              });
            },
            child: PageView.custom(
              physics: PageScrollPhysics(parent: BouncingScrollPhysics()),
              controller: _pageController,
              childrenDelegate: SliverChildBuilderDelegate(
                (context, index) => _SimplePage(
                  "$index",
                  parallaxOffset:
                      constraints.maxWidth / 2.0 * (index - _currentPage),
                ),
                childCount: 9,
              ),
            ),
          ),
        ),
      );
    }

return Scaffold(
      body: Container(
        child: _scrollPhysics(),
      ),
);

  • _SimplePage

class _SimplePage extends StatelessWidget {
  final String data;
  final double parallaxOffset;

  const _SimplePage(this.data, {Key key, this.parallaxOffset = 0})
      : super(key: key);

  @override
  Widget build(BuildContext context) {
    return Container(
      child: Center(
        child: Column(
          mainAxisSize: MainAxisSize.min,
          children: <Widget>[
            Text(
              data,
              style: TextStyle(fontSize: 60, color: Colors.red),
            ),
            SizedBox(
              height: 40.0,
            ),
            Transform(
              transform: Matrix4.translationValues(parallaxOffset, 0, 0),
              child: Text("左右滑动"),
            )
          ],
        ),
      ),
    );
  }
}



运行结果如下:

效果图片

相关文章

网友评论

      本文标题:flutter ScrollPhysics

      本文链接:https://www.haomeiwen.com/subject/oqtgjctx.html