chore: allow groups to take minimal vertical space if possible (#1736)

Author: richardshiue

frontend/app_flowy/packages/appflowy_board/example/lib/multi_board_list_example.dart

@@ -61,6 +61,7 @@ class _MultiBoardListExampleState extends State<MultiBoardListExample> {
   Widget build(BuildContext context) {
     final config = AppFlowyBoardConfig(
       groupBackgroundColor: HexColor.fromHex('#F7F8FC'),
+      stretchGroupHeight: false,
     );
     return AppFlowyBoard(
         controller: controller,

frontend/app_flowy/packages/appflowy_board/lib/src/widgets/board.dart

@@ -27,6 +27,7 @@ class AppFlowyBoardConfig {
   final EdgeInsets headerPadding;
   final EdgeInsets cardPadding;
   final Color groupBackgroundColor;
+  final bool stretchGroupHeight;
 
   const AppFlowyBoardConfig({
     this.cornerRadius = 6.0,
@@ -36,6 +37,7 @@ class AppFlowyBoardConfig {
     this.headerPadding = const EdgeInsets.symmetric(horizontal: 16),
     this.cardPadding = const EdgeInsets.symmetric(horizontal: 3, vertical: 4),
     this.groupBackgroundColor = Colors.transparent,
+    this.stretchGroupHeight = true,
   });
 }
 
@@ -274,6 +276,7 @@ class _AppFlowyBoardContentState extends State<_AppFlowyBoardContent> {
                 dragStateStorage: widget.boardState,
                 dragTargetKeys: widget.boardState,
                 reorderFlexAction: reorderFlexAction,
+                stretchGroupHeight: widget.config.stretchGroupHeight,
               );
 
               return ConstrainedBox(

frontend/app_flowy/packages/appflowy_board/lib/src/widgets/board_group/group.dart

@@ -88,6 +88,8 @@ class AppFlowyBoardGroup extends StatefulWidget {
 
   final Color backgroundColor;
 
+  final bool stretchGroupHeight;
+
   final DraggingStateStorage? dragStateStorage;
 
   final ReorderDragTargeKeys? dragTargetKeys;
@@ -112,6 +114,7 @@ class AppFlowyBoardGroup extends StatefulWidget {
     this.itemMargin = EdgeInsets.zero,
     this.cornerRadius = 0.0,
     this.backgroundColor = Colors.transparent,
+    this.stretchGroupHeight = true,
   })  : config = const ReorderFlexConfig(),
         super(key: key);
 
@@ -172,7 +175,8 @@ class _AppFlowyBoardGroupState extends State<AppFlowyBoardGroup> {
           children: children,
         );
 
-        reorderFlex = Expanded(
+        reorderFlex = Flexible(
+          fit: widget.stretchGroupHeight ? FlexFit.tight : FlexFit.loose,
           child: Padding(padding: widget.itemMargin, child: reorderFlex),
         );
 
@@ -183,7 +187,9 @@ class _AppFlowyBoardGroupState extends State<AppFlowyBoardGroup> {
             color: widget.backgroundColor,
             borderRadius: BorderRadius.circular(widget.cornerRadius),
           ),
-          child: Column(
+          child: Flex(
+            direction: Axis.vertical,
+            mainAxisSize: MainAxisSize.min,
             children: [
               if (header != null) header,
               reorderFlex,