我正在尝试获取一些基本的图像平移和缩放功能。无状态版本可以显示图像(通过Transform旋转180度),并且Scale事件显示在日志中,仅此而已。
是GestureDetector用于获取平移/收缩/展开事件的正确小部件吗?我应该查看“变换”,“动画”,还是只修改Image窗口小部件内的字段?
GestureDetector
Image
// Wraps an Image widget to provide pan and zoom functionality. class InteractiveImage extends StatelessWidget { InteractiveImage(this._image, {Key key}) : super(key: key); final Image _image; @override Widget build(BuildContext context) { return new Center( child: new GestureDetector( onScaleStart: (ScaleStartDetails details) => print(details), onScaleUpdate: (ScaleUpdateDetails details) => print(details), onScaleEnd: (ScaleEndDetails details) => print(details), child: new Transform( transform: new Matrix4.rotationZ(math.PI), alignment: FractionalOffset.center, child: _image, ), ), ); } }
// Wraps an Image widget to provide pan and zoom functionality. class InteractiveImage extends StatefulWidget { InteractiveImage(this._image, {Key key}) : super(key: key); final Image _image; @override _InteractiveImageState createState() => new _InteractiveImageState(_image); } class _InteractiveImageState extends State<InteractiveImage> { _InteractiveImageState(this._image); final Image _image; @override Widget build(BuildContext context) { setState(() => print("STATE SET\n")); return new GestureDetector( onScaleStart: (ScaleStartDetails details) => print(details), onScaleUpdate: (ScaleUpdateDetails details) => print(details), onScaleEnd: (ScaleEndDetails details) => print(details), child: new Transform( transform: new Matrix4.rotationZ(math.PI), alignment: FractionalOffset.center, child: _image, ), ); } }
使用 https://pub.dartlang.org/packages/zoomable_image
(也许可以帮助我添加物理场和弹性边?)
我不确定您所说的“无效”是什么意思,但您的方向正确。
查看https://github.com/flutter/flutter/blob/master/examples/layers/widgets/gestures.dart,了解可平移,捏合和缩放的小部件的工作示例。