flutter - Flutter ReOrder Stack 小部件

Question

如何在拖动小部件时重新排序堆栈小部件（可拖动小部件）。我想开发一个类似拉米游戏的应用程序，其中小部件将根据用户要求进行洗牌，就像下面的拉米游戏一样是参考图片

参考图像

所以下面是我显示卡片但无法重新排序堆栈小部件的代码。

_showGroupCards() {
  // return _showRDwidget();
  if (cards.length == 0) {
    cards = [];
    cards.add(_createBoardList(3));
    cards.add(_createBoardList(5));
    cards.add(_createBoardList(3));
    cards.add(_createBoardList(3));
  }
  // cards.add(_createBoardList(5));
  return Center(
      child: ListView.builder(
          itemCount: cards.length,
          shrinkWrap: true,
          scrollDirection:
              Axis.horizontal, // physics: NeverScrollableScrollPhysics(),
          itemBuilder: (BuildContext context, int index) {
            CardInfo cmenu = cards[index];
            if (cmenu.value != null && cmenu.value!.isEmpty) {
              return Container();
            }

            int gcardCount = cmenu.value.length;
            double sideCard = _getRatio(gcardCount);
            // double sideCard = deckCard!.width.apply(80);
            print("$gcardCount == $sideCard");
            return Container(
              // color: randomColor(),
              width: (sideCard * gcardCount), 
              child: FlatCardFan( 
                children: <Widget>[
                  for (final item in cmenu.value) 
                    getDragWidget(item) //Draggable widget with Text
                ],
                // onReorder: reorderData,
              ),
            );
          }));
}

class FlatCardFan extends StatelessWidget { 
final List<Widget> children;

/// Creates a flat card fan.
FlatCardFan({required this.children});

@override
Widget build(Object context) => Stack(
   fit: StackFit.loose,
   alignment: Alignment.centerLeft,
   
      children: List.generate(
          children.length,
          (index) => Align(
                alignment: Alignment(
                    -1.0 + (index / (children.length - 1)) * 2.0, 0),
                child: children[index],
              )),
    );
}

class CardInfo {
var key;
var value; 
CardInfo({
  this.key,
  required this.value,
});
}

getDragWidget(CardInfo card) { 
  final Widget child = Container( 
      width: 200,
      height:50,
      child:   Container(
                  width: cardWidth,
                  height: cardHeight,
                  child: Text('${card.value}' ),

                )); 
  return Draggable<CardInfo>(
    maxSimultaneousDrags: 1,
    data: card,
    child: child,
    feedback: child,
    rootOverlay: true,
    childWhenDragging: Opacity(
      opacity: 0.1,
      child: child,
    ),
    onDragStarted: () {
      print("onDragStarted");
      setState(() {
        selectedCards=[];
      });
    },
    onDragCompleted: () {
      print("onDragCompleted");
    },
    onDraggableCanceled: (Velocity velocity, Offset offset) { 
    },
  );
}

任何人都可以帮助我找到拖放以重新排序堆栈小部件的解决方案。

标签： flutterdart