Flutter로 드래그할 수 있는 요소 만들기 [Draggable & DragTarget]

_MyHomePageState 클래스에서 부품 편집

class _MyHomePageState extends State<MyHomePage> {
  int _counter = 0;

  //デフォルトで作られているメソッド
　//ドラッグ＆ドロップしたときにカウントアップする（↓を実行する）
  void _incrementCounter() {
    setState(() {
      // ・・・
      _counter++;
    });
  }

  @override
  Widget build(BuildContext context) {
    //画面サイズを取得（ウィジェットの大きさを数値で設定する場合不要）
    final size = MediaQuery.of(context).size;

    return Scaffold(
      appBar: AppBar(
        title: Text(widget.title),
      ),
      body: Center(
        child: Column(
          mainAxisAlignment: MainAxisAlignment.center,
          children: <Widget>[
            //カウントを表示
            Text(
              '$_counter',
              style: Theme.of(context).textTheme.display1,
            ),
            const SizedBox(height: 20.0),
            //ドラッグするもの
            Draggable(/*・・・*/),
            const SizedBox(height: 20.0),
            //ドロップする先
            DragTarget(/*・・・*/),
          ],
        ),
      ),
      // This trailing comma makes auto-formatting nicer for build methods.
    );
  }
}

드래그 가능한 요소 만들기(Draggable()의 내용 추가)

	　Draggable(
              child: Container(
                  decoration: BoxDecoration(
                    shape: BoxShape.circle,
                    color: Theme.of(context).primaryColor,
                  ),
                  child: const Icon(
                    Icons.add,
                    color: Colors.white,
                    size: 40.0,
                  )),
              feedback: Container(
                  decoration: BoxDecoration(
                      shape: BoxShape.circle,
                      color: Colors.white,
                      border: Border.all(
                        color: Theme.of(context).primaryColor,
                      )),
                  child: Icon(
                    Icons.add,
                    color: Theme.of(context).primaryColor,
                    size: 24.0,
                  )),
              onDragCompleted: () {
                _incrementCounter();
              },
            ),

드롭다운 요소 만들기(DragTarget()의 컨텐트 추가)

          DragTarget(builder: (context, candidateData, rejectedData) {
              return Container(
                height: size.height * 0.2,
                width: size.width * 0.5,
                color: Colors.grey.shade300,
              );
            })