How to disable scroll in certain area?

Question

Is it possible to disable scroll in certain areas of a scrollable widget?

Lets say I want to disable scroll within a square area in the middle of the ListView/CustomScrollView, is that possible?

I am thinking it might require me to pass true or false in some touch hitTest or some similar concept but I am not sure where to start. Any ideas?

Answer 1

You can use the Stack widget to overlay an AbsorbPointer widget on top of your scrollable:

 return Scaffold(
      body: Stack(
        children: [
          CustomScrollView(
            slivers: [
              SliverList(
                delegate: SliverChildBuilderDelegate(
                  (BuildContext context, int index) {
                    return Text('...');
                  },
                  childCount: 200,
                ),
              ),
              // Rest of the list
            ],
          ),
          Positioned.fill(
            child: Center(
              child: AbsorbPointer(
                absorbing: true,
                child: Container(
                  width: 100,
                  height: 100,
                  color: Colors.blue,
                ),
              ),
            ),
          ),
        ],
      ),
    );

Answer 2

You can apply a clip to your list. I've done this on the top of the list, but a custom region may be more difficult.