flutter InteractiveViewer与旋转木马滑块非常难以捏缩放

Question

我有一个flutter应用程序，它可以用CarouselSlider和InteractiveViewer显示图像，这样用户就可以捏来放大和缩小。问题是很难做到这一点，通常夹持运动会使CarouselSlider在照片之间滑动。一个解决方案是用neverscrollablescrollphysics((禁用幻灯片，但我不想这么做。

这是代码的一部分：

CarouselSlider(
items: widget.photos.map((i) {
return Container(
margin: EdgeInsets.all(10),
child: InteractiveViewer(
scaleEnabled: true,
minScale: 0.1,
maxScale: 10.0,
child: Image.network(i),
),
);
}).toList(),
options: CarouselOptions(
enableInfiniteScroll: false,
height: MediaQuery.of(context).size.height,
disableCenter: true,
viewportFraction: 1.0,
initialPage: widget.position,
onPageChanged: (index, reason) {
setState(() {
widget.position = index;
});
},
),
),

Answer 1

这是第一个快速修复

您可以复制CarouselSlider类并将其命名为MyCarouselSlider

然后像这个一样编辑getGestrureWrapper方法

Widget getGestureWrapper(Widget child) {
Widget wrapper;
if (widget.options.height != null) {
wrapper = Container(height: widget.options.height, child: child);
} else {
wrapper = AspectRatio(aspectRatio: widget.options.aspectRatio, child: child);
}
return GestureDetector(
child: NotificationListener(
onNotification: (dynamic notification) {
if (widget.options.onScrolled != null && notification is ScrollUpdateNotification) {
widget.options.onScrolled(carouselState.pageController.page);
}
return false;
},
child: wrapper,
),
behavior: HitTestBehavior.opaque,
dragStartBehavior: DragStartBehavior.start,
);
// return RawGestureDetector(
//   behavior: HitTestBehavior.translucent,
//   gestures: {
//     _MultipleGestureRecognizer: GestureRecognizerFactoryWithHandlers<_MultipleGestureRecognizer>(
//         () => _MultipleGestureRecognizer(), (_MultipleGestureRecognizer instance) {
//       instance.onStart = (_) {
//         onPanDown();
//       };
//       instance.onDown = (_) {
//         onPanDown();
//       };
//       instance.onEnd = (_) {
//         onPanUp();
//       };
//       instance.onCancel = () {
//         onPanUp();
//       };
//     }),
//   },
//   child: NotificationListener(
//     onNotification: (dynamic notification) {
//       if (widget.options.onScrolled != null && notification is ScrollUpdateNotification) {
//         widget.options.onScrolled(carouselState.pageController.page);
//       }
//       return false;
//     },
//     child: wrapper,
//   ),
// );
}

并使用新创建的MyCarouselSlider类。重要提示：这不是最终解决方案。

我不确定RawGestureDetector有什么问题。如果我找到更好的解决方案，我会更新这篇文章。