is there any way to stop gesture bubbling in flutter? - flutter

Question

I have TabBarView with 3 children, one of them I have a container which has an onPanUpdate gesture.
When I am trying to move container tab bar onHorizontalDragUpdate calls and tab bar changes tab but not container.
Is there any way to prevent onHorizontalDragUpdate if I taped on a container like stoppropagation in javascript?
TabBarView(
controller: _tabController,
children: [
Container(
color: Colors.red,
),
TabWithDragableContainer(),
Container(
color: Colors.blue,
),
],
)

Answer 1

You could disable the gestures for all the tabs by specifying physics: NeverScrollableScrollPhysics() inside TabBarView.
Minimal Working Example
This example has three tabs:
Basic Tab
Tab with Draggable Widget
Tab with onPan GestureDetector
import 'package:flutter/material.dart';
import 'package:flutter_hooks/flutter_hooks.dart';
void main() {
runApp(
MaterialApp(
debugShowCheckedModeBanner: false,
title: 'Flutter Demo',
home: HomePage(),
),
);
}
class HomePage extends StatelessWidget {
#override
Widget build(BuildContext context) {
return DefaultTabController(
length: 3,
child: Scaffold(
appBar: AppBar(
bottom: TabBar(
tabs: [
Tab(icon: Icon(Icons.directions_car)),
Tab(icon: Icon(Icons.directions_transit)),
Tab(icon: Icon(Icons.directions_bike)),
],
),
),
body: TabBarView(
physics: NeverScrollableScrollPhysics(),
children: [
Icon(Icons.directions_car),
_ContainerWithDraggable(),
_ContainerWithPanGesture(),
],
),
),
);
}
}
class _ContainerWithDraggable extends HookWidget {
#override
Widget build(BuildContext context) {
final _offset = useState(Offset(100, 100));
return Stack(
children: [
Container(color: Colors.amber.shade100),
Positioned(
top: _offset.value.dy,
left: _offset.value.dx,
child: Draggable(
onDragUpdate: (details) => _offset.value += details.delta,
feedback: _Circle(),
child: _Circle(),
),
),
],
);
}
}
class _ContainerWithPanGesture extends HookWidget {
#override
Widget build(BuildContext context) {
final _offset = useState(Offset(100, 100));
final _previousOffset = useState<Offset>(null);
final _referenceOffset = useState<Offset>(null);
return Stack(
children: [
GestureDetector(
onPanStart: (details) {
_previousOffset.value = _offset.value;
_referenceOffset.value = details.localPosition;
},
onPanUpdate: (details) => _offset.value = _previousOffset.value +
details.localPosition -
_referenceOffset.value,
child: Container(color: Colors.amber.shade100),
),
Positioned(
top: _offset.value.dy,
left: _offset.value.dx,
child: _Circle(),
),
],
);
}
}
class _Circle extends StatelessWidget {
const _Circle({
Key key,
}) : super(key: key);
#override
Widget build(BuildContext context) {
return Container(
width: 50,
height: 50,
decoration: BoxDecoration(
shape: BoxShape.circle,
border: Border.all(color: Colors.brown, width: 5.0),
),
);
}
}