Question

我正在使用PageView，我想限制滚动时下一页的可见量。如果您需要了解我的意思，我提供了两个截屏，以说明自己的状态。

这就是我想要的样子：

我试图在滚动到另一个屏幕时更改视口大小，但这只会使所有内容弄乱。

这是我当前的代码：

class OrderList extends StatefulWidget {
  static const String routeName = "/OrderList";

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

class _OrderListState extends State<OrderList> {
  PageController controller = PageController();
  int _previousPage;
  var currentPageValue = 0.0;
  double _viewportScale = 1.0;

  @override
  Widget build(BuildContext context) {
    this.controller = PageController(
      initialPage: 0,
      viewportFraction: _viewportScale,
    );

    return Scaffold(
      backgroundColor: WHITE,
      body: 
      PageView(
        onPageChanged: (num) {
          print("Current page number is " + num.toString());
        },
        //physics: BouncingScrollPhysics(),
        controller: controller,
        scrollDirection: Axis.vertical,
        pageSnapping: false,

        children: <Widget>[
          Container(
            height: MediaQuery.of(context).size.height,
            width: MediaQuery.of(context).size.width,
            color: Colors.transparent,
            child: Stack( ),
          ),
          Container(
            color: Colors.redAccent,
            height: MediaQuery.of(context).size.height,
            width: MediaQuery.of(context).size.width,
          )
        ],
      ),
    );
  }
}

基本上，我只想在两页之间进行平滑过渡，而第一页的一部分仍然在另一页上可见。

任何帮助将不胜感激：D

Answer 1

PageView{
    ...
    pageSnapping: false,
    ...
}

将pageView中的pageSnapping设置为false，以在两个页面之间平滑过渡

Answer 2

您可以将视口比例设置为90％（0.9），并在第一页上将比例添加为110％（1.1）

在Flutter中更改页面时如何限制PageView

2 个答案: