我想制作一个可以拖动,缩放和旋转的容器。我能够实现变焦。下面是我的代码:
//variable declaration double _scale = 1.0; double _previousScale; var yOffset = 400.0; var xOffset = 50.0; var rotation = 0.0; var lastRotation = 0.0;
//构建方法
@override Widget build(BuildContext context) { return Scaffold( body: Center( child: Center( child: GestureDetector( onScaleStart: (scaleDetails) { _previousScale = _scale; print(' scaleStarts = ${scaleDetails.focalPoint}'); }, onScaleUpdate: (scaleUpdates){ //ScaleUpdateDetails rotation += lastRotation - scaleUpdates.rotation; lastRotation = scaleUpdates.rotation; print("lastRotation = $lastRotation"); print(' scaleUpdates = ${scaleUpdates.scale} rotation = ${scaleUpdates.rotation}'); setState(() => _scale = _previousScale * scaleUpdates.scale); }, onScaleEnd: (scaleEndDetails) { _previousScale = null; print(' scaleEnds = ${scaleEndDetails.velocity}'); }, child: Transform( transform: Matrix4.diagonal3( Vector3(_scale, _scale, _scale))..rotateZ(rotation * math.pi/180.0), alignment: FractionalOffset.center, child: Container( height: 200.0, width: 200.0, color: Colors.red, ), ) , ), ), ), ); }
当前,没有旋转,我无法移动容器。
使用matrix_gesture_detector包,这里有基本示例:
MatrixGestureDetector( onMatrixUpdate: (m, tm, sm, rm) { setState(() { matrix = n; }); }, child: Transform( transform: matrix, child: .... ), ),
有关更多示例代码,请参阅example包含6个演示的文件夹
example