Flutter-实现-View-的移动拖拽

在Flutter中，可以使用GestureDetector和Positioned小部件来实现一个可移动的视图。以下是一个简单的示例代码：

import 'package:flutter/material.dart';
 
void main() => runApp(MyApp());
 
class MyApp extends StatelessWidget {
  @override
  Widget build(BuildContext context) {
    return MaterialApp(
      home: Scaffold(
        body: Center(
          child: DraggableWidget(),
        ),
      ),
    );
  }
}
 
class DraggableWidget extends StatefulWidget {
  @override
  _DraggableWidgetState createState() => _DraggableWidgetState();
}
 
class _DraggableWidgetState extends State<DraggableWidget> {
  Offset offset = Offset(0, 0);
 
  void updatePosition(Offset globalPosition) {
    setState(() {
      offset = globalPosition;
    });
  }
 
  @override
  Widget build(BuildContext context) {
    return Stack(
      children: <Widget>[
        Positioned(
          left: offset.dx,
          top: offset.dy,
          child: GestureDetector(
            onPanUpdate: (DragUpdateDetails details) {
              updatePosition(details.globalPosition);
            },
            child: Container(
              width: 100,
              height: 100,
              decoration: BoxDecoration(
                color: Colors.blue,
                borderRadius: BorderRadius.circular(10),
              ),
            ),
          ),
        ),
      ],
    );
  }
}

在这个示例中，DraggableWidget是一个StatefulWidget，它包含一个Stack，其中包含一个Positioned小部件。Positioned小部件内部是一个GestureDetector，它能够检测到平移动作（onPanUpdate），并通过updatePosition方法更新一个Offset对象，该对象存储了视图的新位置。每次用户移动视图时，都会调用setState来重新构建视图并更新位置。