在 iOS 设备上拖动后抬起手指时,如何修复 GestureDetector.onScaleUpdate 中的偏移偏移?

问题描述

当我完成拖动 Positioned 小部件时,我注意到当我将手指从 iOS 设备 (iOS 14.6) 的屏幕上移开时,最终位置发生了微小的变化。此行为也存在于 iOS 模拟器中,但在物理设备上非常明显:

iOS device GestureDetector screen recording

——注意红色立方体停止移动后的轻微位置偏移。

演示的源代码

import 'package:Flutter/material.dart';
 
class GestureDemo extends StatefulWidget {
  const GestureDemo({Key? key}) : super(key: key);
 
  @override
  GestureDemoState createState() => GestureDemoState();
}
 
class GestureDemoState extends State<GestureDemo> {
 
  late Offset _startingFocalPoint;
 
  late Offset _prevIoUsOffset;
  Offset _offset = Offset.zero;
 
  late double _prevIoUsZoom;
  double _zoom = 1.0;
 
  final containerSize = Size(100,100);
 
  void _handleScaleStart(ScaleStartDetails details) {
    setState(() {
      _startingFocalPoint = details.focalPoint;
      _prevIoUsOffset = _offset;
      _prevIoUsZoom = _zoom;
    });
  }
 
  void _handleScaleUpdate(ScaleUpdateDetails details) {
    setState(() {
      _zoom = _prevIoUsZoom * details.scale;
 
      // Ensure that item under the focal point stays in the same place despite zooming
      final Offset normalizedOffset = (_startingFocalPoint - _prevIoUsOffset) / _prevIoUsZoom;
      _offset = details.focalPoint - normalizedOffset * _zoom;
    });
  }
 
  @override
  Widget build(BuildContext context) {
    return Stack(
      fit: StackFit.expand,children: <Widget>[
        Positioned(
          top: _offset.dy,left: _offset.dx,child: GestureDetector(
            onScaleStart: _handleScaleStart,onScaleUpdate:_handleScaleUpdate,child: Container(
              color: Colors.red,width: containerSize.width * _zoom,height: containerSize.height * _zoom,),)
        ),],);
  }
}
 
void main() {
  runApp(MaterialApp(
    theme: ThemeData.dark(),home: Scaffold(
      appBar: AppBar(title: const Text('Gestures Demo')),body: const GestureDemo(),));
}

这是 Flutter 官方 widget gestures example 的简化版本。

当我登录 ScaleUpdateDetails 时,我看到最后一个 details一个小偏移

ScaleUpdateDetails(focalPoint: Offset(174.0,260.5),localFocalPoint: Offset(28.5,73.0),scale: 1.0,horizontalScale: 1.0,verticalScale: 1.0,rotation: 0.0,pointerCount: 1)
ScaleUpdateDetails(focalPoint: Offset(174.0,260.0),72.5),pointerCount: 1)
ScaleUpdateDetails(focalPoint: Offset(173.0,258.0),localFocalPoint: Offset(27.5,70.5),pointerCount: 1)

如何消除这种位置偏移?

解决方法

暂无找到可以解决该程序问题的有效方法,小编努力寻找整理中!

如果你已经找到好的解决方法,欢迎将解决方案带上本链接一起发送给小编。

小编邮箱:dio#foxmail.com (将#修改为@)