如何在 flutter 中拖放文本字段

Question

我在 flutter 中创建了一个文本字段，要求用户在其中输入文本。但我希望该文本字段可拖动并将其放入另一个容器中。我可以拖放其他小部件，但不能拖放文本字段。任何人都可以帮我怎么做吗？

Answer 1

运行这个代码，我想这就是你想要的，你只是把 Material() 放在屋顶上

 import 'package:flutter/material.dart';

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

class MyApp extends StatefulWidget {
  const MyApp({Key? key}) : super(key: key);

  static const String _title = 'Flutter Code Sample';

  @override
  State<MyApp> createState() => _MyAppState();
}

class _MyAppState extends State<MyApp> {
  late final TextEditingController controller;
  bool isTransfered = false;
  @override
  void initState() {
    controller = TextEditingController();
    super.initState();
  }

  void Function(String)? onChanged() {
    return null;
  }

  @override
  Widget build(BuildContext context) {
    TextField textField =
        TextField(decoration: const InputDecoration(hintText: 'enter'), controller: controller, onChanged: onChanged());
    Container container = Container(
      height: 50,
      width: 150,
      color: Colors.grey,
      child: textField,
    );
    return Material(
      child: MaterialApp(
        title: MyApp._title,
        home: Scaffold(
          appBar: AppBar(title: const TextField()),
          body: Row(
            mainAxisAlignment: MainAxisAlignment.spaceEvenly,
            children: <Widget>[
              Material(
                child: Draggable<Container>(
                  // Data is the value this Draggable stores.
                  data: container, // ----> this is our data
                  feedback: container, // ---> this is what we see while we transfer
                  childWhenDragging: Container(
                    // this is what we see while we transfer
                    height: 100.0,
                    width: 100.0,
                    color: Colors.pinkAccent,
                    child: const Center(
                      child: Text('Child When Dragging'),
                    ),
                  ),
                  child: isTransfered == true
                      ? Container(
                          height: 100.0,
                          width: 100.0,
                          color: Colors.pinkAccent,
                          child: const Center(
                            child: Text('Child When Dragging'),
                          ),
                        )
                      : container,
                ),
              ),
              DragTarget<Container>(
                builder: (
                  BuildContext context,
                  List<dynamic> accepted,
                  List<dynamic> rejected,
                ) {
                  return isTransfered == true
                      ? container
                      : Container(
                          height: 100.0,
                          width: 100.0,
                          color: Colors.cyan,
                          child: const Center(
                            child: Text('waitingggggg'),
                          ),
                        );
                },
                onAccept: (Container data) {
                  isTransfered = true;
                  setState(() {});
                },
              ),
            ],
          ),
        ),
      ),
    );
  }
}

如何在 flutter 中拖放文本字段

How to drag and drop a textfield in flutter

dart

flutter