Feature: Provide props to disable reorder

[marcosgcd]

I want to disable the Reorder of Groups. And also disable the Reorder inside of the Group but still allow the user to drag and drop between Groups

[dsyrstad]

@marcosgcd I just found that you can disable the ability to drag groups with AppFlowyGroupData.draggable. You have to set this property separately - you can't pass it to the constructor.

[Danimatar0]

AppFlowyGroupData.draggable

Hello, i have tried to initialize the AppFlowyBoardController like this:

// Getx Controller for state management
class TaskBoardController extends GetxController {
late AppFlowyBoardController boardController;
late AppFlowyBoardScrollController boardScrollController;
late ScrollController scrollController;

@OverRide
void onInit() {
boardScrollController = AppFlowyBoardScrollController();
scrollController = ScrollController();
boardController = AppFlowyBoardController(
onMoveGroup: (fromGroupId, fromIndex, toGroupId, toIndex) =>
onMoveGroup(fromGroupId, fromIndex, toGroupId, toIndex),
onMoveGroupItem: (groupId, fromIndex, toIndex) =>
onMoveGroupItem(groupId, fromIndex, toIndex),
onMoveGroupItemToGroup: (fromGroupId, fromIndex, toGroupId, toIndex) =>
onMoveGroupItemToGroup(fromGroupId, fromIndex, toGroupId, toIndex),
);
boardController.enableGroupDragging(false);
boardController.addGroups(getBoardGroups());
super.onInit();
}

@OverRide
void onClose() {
boardController.dispose();
super.onClose();
}

void onMoveGroupItemToGroup(
String fromGroupId, int fromIndex, String toGroupId, int toIndex) {
debugPrint('Move $fromGroupId:$fromIndex to $toGroupId:$toIndex');
}

void onMoveGroup(
String fromGroupId, int fromIndex, String toGroupId, int toIndex) {
debugPrint('Move prevented: Columns cannot be moved.');
return;
}

void onMoveGroupItem(String groupId, int fromIndex, int toIndex) {
debugPrint('Move $groupId:$fromIndex to $groupId:$toIndex');
}

List getBoardGroups() {
return [
AppFlowyGroupData(
id: "1", name: "To Do", items: [TextItem("a")]),
AppFlowyGroupData(
id: "2",
name: "In Progress",
items: [TextItem("b")]),
AppFlowyGroupData(
id: "3",
name: "Pending Testing",
items: [TextItem("c")]),
AppFlowyGroupData(
id: "4", name: "Done", items: [TextItem("d")]),
AppFlowyGroupData(
id: "5", name: "Blocked", items: [TextItem("e")]),
AppFlowyGroupData(
id: "6", name: "Backlog", items: [TextItem("f")]),
];
}
}

// Stateless Widget using above controller
return AppFlowyBoard(
  controller: boardController.boardController,
  boardScrollController: boardController.boardScrollController,
  scrollController: boardController.scrollController,
  config: AppFlowyBoardConfig(
    groupBackgroundColor: Colors.grey.shade100,
  ),
  headerBuilder: (context, column) {
    return Container(
      width: 240, // Fixed width for the header
      height: 60, // Fixed height for the header
      alignment: Alignment.topLeft,
      padding: const EdgeInsets.all(20.0),
      decoration: BoxDecoration(
        color: Colors.grey.shade100,
        borderRadius: BorderRadius.circular(8),
      ),
      child: Text(
        column.headerData.groupName,
        style: TextStyle(
          color: secondaryTextColor,
          fontSize: 16,
          fontWeight: FontWeight.bold,
        ),
      ),
    );
  },
  cardBuilder: (context, group, groupItem) {
    TextItem taskItem = groupItem as TextItem;
    return TextButton(
      key: ObjectKey(taskItem),
      onPressed: () {
        print('text pressed');
      },
      child: Text(
        taskItem.s,
      ),
    );
  },
  groupConstraints: const BoxConstraints.tightFor(width: 280),
  background: Container(
    color: Colors.white,
  ),
)

But in the UI, the group is still draggable.