我已经搜索了很多,没有找到一个坚实的答案,所以如果这是一个骗局,我诚实地尝试。我有一个应用程序,我正在重写,并摆脱了基于HTML的混合平台(特别是Trigger.io);在Flutter和Dart中快速重写。该应用程序的一部分包括一个非常简单的屏幕,用户可以点击人体图像,并通过图像Map,获取身体部位(右前臂,左膝,头部等)的标识符和标题。在Flutter中,我根本找不到类似的行为和功能。我是不是错过了一些简单的东西,因为我完全想多了?多谢了。
8ljdwjyq1#
您可以将Image Package 在GestureDetector中,并指定onTapDown(或onTapUp)回调来检查点击的坐标并相应地执行操作。(To将全局坐标转换为局部坐标,请参见:flutter : Get Local position of Gesture Detector)这里有一个粗略的尝试:
Image
GestureDetector
onTapDown
onTapUp
class ImageMap extends StatelessWidget { const ImageMap({ Key key, @required this.image, @required this.onTap, @required this.regions, }) : super(key: key); final Widget image; final List<Path> regions; /// Callback that will be invoked with the index of the tapped region. final void Function(int) onTap; void _onTap(BuildContext context, Offset globalPosition) { RenderObject renderBox = context.findRenderObject(); if (renderBox is RenderBox) { final localPosition = renderBox.globalToLocal(globalPosition); for (var (index, path) in regions.indexed) { if (path.contains(localPosition)) { onTap(index); return; } } } } @override Widget build(BuildContext context) { return GestureDetector( onTapDown: (details) => _onTap(context, details.globalPosition), child: image, ); } }
1条答案
按热度按时间8ljdwjyq1#
您可以将
Image
Package 在GestureDetector
中,并指定onTapDown
(或onTapUp
)回调来检查点击的坐标并相应地执行操作。(To将全局坐标转换为局部坐标,请参见:flutter : Get Local position of Gesture Detector)
这里有一个粗略的尝试: