Disable pageview upward scroll

Issue

I added a pageview (with a snap) to the body of a scaffold. I’d like users to scroll pages down only, not up. Can you please help? Thanks

Solution

you can easily do it with custom scroll physics as shown below,

add CustomScrollPhysics() as physics of your PageView(),

PageView(
      scrollDirection: Axis.vertical,
      physics: CustomScrollPhysics(),  <--- here!!
      controller: controller,
      children: <Widget>[
       //childrens
      ],
    );

create CustomScrollPhysycs() that only scroll down,

 class CustomScrollPhysics extends ScrollPhysics {
              CustomScrollPhysics({ScrollPhysics parent}) : super(parent: parent);

              bool isGoingDown = false;

              @override
              CustomScrollPhysics applyTo(ScrollPhysics ancestor) {
                return CustomScrollPhysics(parent: buildParent(ancestor));
              }

              @override
              double applyPhysicsToUserOffset(ScrollMetrics position, double offset) {
                isGoingDown = offset.sign < 0;
                return offset;
              }

              @override
              double applyBoundaryConditions(ScrollMetrics position, double value) {
                //print("applyBoundaryConditions");
                assert(() {
                  if (value == position.pixels) {
                    throw FlutterError(
                        '$runtimeType.applyBoundaryConditions() was called redundantly.\n'
                        'The proposed new position, $value, is exactly equal to the current position of the '
                        'given ${position.runtimeType}, ${position.pixels}.\n'
                        'The applyBoundaryConditions method should only be called when the value is '
                        'going to actually change the pixels, otherwise it is redundant.\n'
                        'The physics object in question was:\n'
                        '  $this\n'
                        'The position object in question was:\n'
                        '  $position\n');
                  }
                  return true;
                }());
                if (value < position.pixels && position.pixels <= position.minScrollExtent)
                  return value - position.pixels;
                if (position.maxScrollExtent <= position.pixels && position.pixels < value)
                  // overscroll
                  return value - position.pixels;
                if (value < position.minScrollExtent &&
                    position.minScrollExtent < position.pixels) // hit top edge

                  return value - position.minScrollExtent;

                if (position.pixels < position.maxScrollExtent &&
                    position.maxScrollExtent < value) // hit bottom edge
                  return value - position.maxScrollExtent;

                if (!isGoingDown) {
                  return value - position.pixels;
                }
                return 0.0;
              }
            }

Answered By – Ruchit

Answer Checked By – Pedro (FlutterFixes Volunteer)

Leave a Reply

Your email address will not be published. Required fields are marked *