Canvas with Scale/Pan in list View. How to disable scroll

user_10764358 0
Viewed 653

Sorry for my English. Ask if you cant understand something.

Hello! In general, I have a listView, in it is one of the elements of the gestureDetector, in which the canvas is located. Canvas draws a pattern.

I need this scheme to increase and "scroll". I have already registered the logic itself and everything works, but! If you start moving in the canvas area up or down, it will not move the canvas, but scroll through the listView. I googled the Internet to the holes, but found nothing. Roughly speaking, I need that when the user moves up / down in the gestureDetector area, all events are sent there, and not sent to the listView (parent component).

I have such a structure

ListView (
...
    child: GestureDetector(
    ...
       child: ...
             child: CustomPaint(...))
)

I tried to set "behavior: HitTestBehavior.translucent" on my gestureDetector, but it's not help.

flutter scroll canvas
2 Answers

You can enable/disable the scroll of your ListView using the physics property :

   bool scrollListEnable = true;

      @override
      Widget build(BuildContext context) {
        return Scaffold(
            body: ListView(
          physics: scrollListEnable
              ? AlwaysScrollableScrollPhysics()
              : NeverScrollableScrollPhysics(),
          children: <Widget>[
            Listener(
              onPointerMove: (details) {
                print("onPointerMove : $details");
                if (scrollListEnable) {
                  setState(() {
                    scrollListEnable = false;
                  });
                }
              },
              onPointerUp: (details) {
                print("onPointerUp : $details");
                setState(() {
                  scrollListEnable = true;
                });
              },
              child: Container(
                height: 200.0,
                width: 200.0,
                color: Colors.red,
              ),
            )
          ],
        ));
      }
user_6662210

I have had success using package zoom_widget

import 'package:zoom_widget/zoom_widget.dart';

Zoom(
    child:Listener(
        child: ListView.builder(
            itemBuilder: (BuildContext context, int index) {
                return CustomPaint(...);
     }
  ))
)
user_190897800
Related