繁体   English   中英

自由移动 Flutter Widget

[英]Freely moveable Flutter Widget

我需要一个特殊的小部件。

嘿,我需要专业人士的名字。

有没有可以自由移动的小部件。 就像您如何继续使用地图一样?

所以基本上可以在各个方向滚动。

你可以查看InteractiveViewer Her is a basic demo:

import 'package:flutter/material.dart';

void main() => runApp(const MyApp());

class MyApp extends StatelessWidget {
  const MyApp({super.key});

  static const String _title = 'Flutter Code Sample';

  @override
  Widget build(BuildContext context) {
    return const MaterialApp(
      title: _title,
      home: HomePage(),
    );
  }
}

class HomePage extends StatefulWidget {
  const HomePage({super.key});

  @override
  State<HomePage> createState() => _HomePageState();
}

class _HomePageState extends State<HomePage> {
  late Offset _offset;

  @override
  void initState() {
    _offset = const Offset(0, 0);
    super.initState();
  }

  @override
  Widget build(BuildContext context) {
    return Scaffold(
      appBar: AppBar(title: Text(_offset.toString())),
      body: SizedBox.expand(
        child: InteractiveViewer(
          onInteractionUpdate: (details) => setState(() {
            _offset = details.focalPoint;
          }),
          boundaryMargin: const EdgeInsets.all(1000.0),
          minScale: 0.1,
          maxScale: 3,
          child: Center(
            child: TextButton(
              child: const Text('Drag me'),
              onPressed: () {
              },
            ),
          ),
        ),
      ),
    );
  }
}

您可以使用可拖动的小部件来像这样简单地包装您的小部件

Draggable(
              data: 'Flutter',
              child: FlutterLogo(
                size: 100.0,
              ),
              feedback: FlutterLogo(
                size: 100.0,
              ),
              childWhenDragging: Container(),
            )

暂无
暂无

声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.

 
粤ICP备18138465号  © 2020-2024 STACKOOM.COM