Question

如果我有PageView，如何禁用默认滚动行为（滑动）并通过点击按钮使下一个项目滚动到视图中？

Answer 1

要禁用滑动，您可以设置：

PageView(physics:new NeverScrollableScrollPhysics())

Answer 2

停止滚动的最佳方法是更改页面视图的物理参数

如果PageView在开始或结束时使用，则要停止滚动超出边缘

physics: ClampingScrollPhysics()

要完全停止滚动，请使用

physics: NeverScrollableScrollPhysics()

Answer 3

所以我试图解决如下问题，如果有人有更好的解决方案，请与我们分享。

按一下按钮转到PageView中的下一项：

向PageController添加PageView，并在用户按下按钮时将方法animateTo或jumpTo添加到所需的项目。我已经使得当前视图的整个宽度都是偏移量，因此成功转换到下一个项目。

onPressed: () {
        c.animateTo(MediaQuery
            .of(context)
            .size
            .width, duration: new Duration(seconds: 1),
            curve: Curves.easeIn);
      }

停用默认的滑动行为：

我所做的只是将我的PageView包裹在IgnorePointer内以忽略任何用户交互，我真的不喜欢这个解决方案，在这个例子中它可能正常工作，但是，在其他情况下我可能希望用户与当前显示页面中的单个小部件进行交互。

这是我的示例代码：

class FirstPage extends StatefulWidget {
  @override
  _FirstPageState createState() => new _FirstPageState();
}

class _FirstPageState extends State<FirstPage> {
  ScrollController c;

  @override
  void initState() {
    super.initState();
    c = new PageController();
  }

  @override
  Widget build(BuildContext context) {
    return new Scaffold(
      floatingActionButton: new Row(
        mainAxisAlignment: MainAxisAlignment.end,
        crossAxisAlignment: CrossAxisAlignment.end,

        children: <Widget>[
          new FloatingActionButton(
              child: new Icon(Icons.navigate_before), onPressed: () {
            //c.animateTo(MediaQuery.of(context).size.width, duration: new Duration(seconds: 1), curve: Curves.easeIn);
            c.jumpTo(0.0);
          }),
          new Container(width: 15.0,),
          new FloatingActionButton(
              child: new Icon(Icons.navigate_next), onPressed: () {
            c.animateTo(MediaQuery
                .of(context)
                .size
                .width, duration: new Duration(seconds: 1),
                curve: Curves.easeIn);
          }),
        ],),
      appBar: new AppBar(title: new Text("First Page")),
      body: new IgnorePointer(child: new PageView(
        controller: c,
        children: <Widget>[
          new Column (
              children: <Widget>[new Container (child: new Text("First Item"))
              ]),
          new Container (child: new Text("Second Item")),
        ],
      ),),
    );
  }
}

欢迎对此解决方案提出任何建议或修改。

Answer 4

可能对某些人有帮助的附加说明。

如果在其中一个对手势停止反应的页面中有Dyanmic GoogleMap，则使用PageView（physics：new NeverScrollableScrollPhysics（））非常有用。似乎PageView具有优先权并覆盖了地图。

添加NeverScrollablePhysics（）可使地图再次对手势做出反应。

谢谢

Answer 5

要禁用手势滑动，请将以下属性添加到您的 PageView：

PageView(physics:new NeverScrollableScrollPhysics())

要导航到 PageView 中的下一页/小部件，请将以下代码添加到按钮的 onPressed 属性：

_pageController.nextPage(
     duration: Duration(milliseconds: 1000),
     curve: Curves.easeIn
);

PageView：禁用默认滚动并将其替换为Tap事件

5 个答案: