Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

feat: support leading and trailing widgets in board content #14

Merged
merged 1 commit into from
Nov 3, 2023
Merged

feat: support leading and trailing widgets in board content #14

Show file tree
Hide file tree
Changes from all commits
Commits
Show all changes
1 commit
Select commit
File filter

Filter by extension

Filter by extension
Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
142 changes: 77 additions & 65 deletions lib/src/widgets/board.dart
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -94,7 +94,16 @@ class AppFlowyBoard extends StatelessWidget {
///
final AppFlowyBoardScrollController? boardScrollController;

/// A widget that is shown before the first group in the Board
///
final Widget? leading;

/// A widget that is shown after the last group in the Board
///
final Widget? trailing;

const AppFlowyBoard({
super.key,
required this.controller,
required this.cardBuilder,
this.background,
Expand All @@ -104,8 +113,9 @@ class AppFlowyBoard extends StatelessWidget {
this.boardScrollController,
this.groupConstraints = const BoxConstraints(maxWidth: 200),
this.config = const AppFlowyBoardConfig(),
Key? key,
}) : super(key: key);
this.leading,
this.trailing,
});

@override
Widget build(BuildContext context) {
Expand Down Expand Up @@ -137,6 +147,8 @@ class AppFlowyBoard extends StatelessWidget {
headerBuilder: headerBuilder,
phantomController: phantomController,
onReorder: controller.moveGroup,
leading: leading,
trailing: trailing,
);
},
),
Expand All @@ -145,20 +157,22 @@ class AppFlowyBoard extends StatelessWidget {
}

class _AppFlowyBoardContent extends StatefulWidget {
final ScrollController? scrollController;
final AppFlowyBoardConfig config;
final OnReorder onReorder;
final OverlapDragTargetDelegate delegate;
final AppFlowyBoardController dataController;
final Widget? background;
final AppFlowyBoardConfig config;
final ReorderFlexConfig reorderFlexConfig;
final BoxConstraints groupConstraints;
final AppFlowyBoardScrollController? scrollManager;
final ScrollController? scrollController;
final AppFlowyBoardState boardState;
final BoxConstraints groupConstraints;
final AppFlowyBoardCardBuilder cardBuilder;
final BoardPhantomController phantomController;
final Widget? leading;
final Widget? trailing;
final Widget? background;
final ReorderFlexConfig reorderFlexConfig;
final AppFlowyBoardHeaderBuilder? headerBuilder;
final AppFlowyBoardFooterBuilder? footerBuilder;
final OverlapDragTargetDelegate delegate;
final BoardPhantomController phantomController;

const _AppFlowyBoardContent({
required this.config,
Expand All @@ -167,19 +181,19 @@ class _AppFlowyBoardContent extends StatefulWidget {
required this.dataController,
required this.scrollManager,
required this.boardState,
this.scrollController,
this.background,
required this.groupConstraints,
required this.cardBuilder,
required this.phantomController,
this.leading,
this.trailing,
this.scrollController,
this.background,
this.footerBuilder,
this.headerBuilder,
required this.phantomController,
Key? key,
}) : reorderFlexConfig = const ReorderFlexConfig(
}) : reorderFlexConfig = const ReorderFlexConfig(
direction: Axis.horizontal,
dragDirection: Axis.horizontal,
),
super(key: key);
);

@override
State<_AppFlowyBoardContent> createState() => _AppFlowyBoardContentState();
Expand All @@ -192,24 +206,9 @@ class _AppFlowyBoardContentState extends State<_AppFlowyBoardContent> {

@override
void initState() {
super.initState();
_overlayEntry = BoardOverlayEntry(
builder: (BuildContext context) {
final interceptor = OverlappingDragTargetInterceptor(
reorderFlexId: widget.dataController.identifier,
acceptedReorderFlexId: widget.dataController.groupIds,
delegate: widget.delegate,
columnsState: widget.boardState,
);

final reorderFlex = ReorderFlex(
config: widget.reorderFlexConfig,
scrollController: widget.scrollController,
onReorder: widget.onReorder,
dataSource: widget.dataController,
interceptor: interceptor,
children: _buildColumns(),
);

return Stack(
alignment: AlignmentDirectional.topStart,
children: [
Expand All @@ -222,13 +221,26 @@ class _AppFlowyBoardContentState extends State<_AppFlowyBoardContent> {
),
child: widget.background,
),
reorderFlex,
ReorderFlex(
config: widget.reorderFlexConfig,
scrollController: widget.scrollController,
onReorder: widget.onReorder,
dataSource: widget.dataController,
interceptor: OverlappingDragTargetInterceptor(
reorderFlexId: widget.dataController.identifier,
acceptedReorderFlexId: widget.dataController.groupIds,
delegate: widget.delegate,
columnsState: widget.boardState,
),
leading: widget.leading,
trailing: widget.trailing,
children: _buildColumns(),
),
],
);
},
opaque: false,
);
super.initState();
}

@override
Expand All @@ -240,8 +252,9 @@ class _AppFlowyBoardContentState extends State<_AppFlowyBoardContent> {
}

List<Widget> _buildColumns() {
final List<Widget> children =
widget.dataController.groupDatas.asMap().entries.map(
final List<Widget> children = [];

widget.dataController.groupDatas.asMap().entries.map(
(item) {
final columnData = item.value;
final columnIndex = item.key;
Expand All @@ -255,35 +268,34 @@ class _AppFlowyBoardContentState extends State<_AppFlowyBoardContent> {
widget.boardState.reorderFlexActionMap[columnData.id] =
reorderFlexAction;

return ChangeNotifierProvider.value(
key: ValueKey(columnData.id),
value: widget.dataController.getGroupController(columnData.id),
child: Consumer<AppFlowyGroupController>(
builder: (context, value, child) {
final boardColumn = AppFlowyBoardGroup(
// key: PageStorageKey<String>(columnData.id),
margin: _marginFromIndex(columnIndex),
itemMargin: widget.config.groupItemPadding,
headerBuilder: _buildHeader,
footerBuilder: widget.footerBuilder,
cardBuilder: widget.cardBuilder,
dataSource: dataSource,
scrollController: ScrollController(),
phantomController: widget.phantomController,
onReorder: widget.dataController.moveGroupItem,
cornerRadius: widget.config.cornerRadius,
backgroundColor: widget.config.groupBackgroundColor,
dragStateStorage: widget.boardState,
dragTargetKeys: widget.boardState,
reorderFlexAction: reorderFlexAction,
stretchGroupHeight: widget.config.stretchGroupHeight,
);

return ConstrainedBox(
constraints: widget.groupConstraints,
child: boardColumn,
);
},
children.add(
ChangeNotifierProvider.value(
key: ValueKey(columnData.id),
value: widget.dataController.getGroupController(columnData.id),
child: Consumer<AppFlowyGroupController>(
builder: (context, value, child) {
return ConstrainedBox(
constraints: widget.groupConstraints,
child: AppFlowyBoardGroup(
margin: _marginFromIndex(columnIndex),
itemMargin: widget.config.groupItemPadding,
headerBuilder: _buildHeader,
footerBuilder: widget.footerBuilder,
cardBuilder: widget.cardBuilder,
dataSource: dataSource,
scrollController: ScrollController(),
phantomController: widget.phantomController,
onReorder: widget.dataController.moveGroupItem,
cornerRadius: widget.config.cornerRadius,
backgroundColor: widget.config.groupBackgroundColor,
dragStateStorage: widget.boardState,
dragTargetKeys: widget.boardState,
reorderFlexAction: reorderFlexAction,
stretchGroupHeight: widget.config.stretchGroupHeight,
),
);
},
),
),
);
},
Expand Down
32 changes: 19 additions & 13 deletions lib/src/widgets/reorder_flex/reorder_flex.dart
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -116,8 +116,12 @@ class ReorderFlex extends StatefulWidget {

final ReorderFlexAction? reorderFlexAction;

final Widget? leading;

final Widget? trailing;

ReorderFlex({
Key? key,
super.key,
this.scrollController,
required this.dataSource,
required this.children,
Expand All @@ -129,9 +133,10 @@ class ReorderFlex extends StatefulWidget {
this.onDragEnded,
this.interceptor,
this.reorderFlexAction,
}) : assert(children.every((Widget w) => w.key != null),
'All child must have a key.'),
super(key: key);
this.leading,
this.trailing,
}) : assert(children.every((Widget w) => w.key != null),
'All child must have a key.');

@override
State<ReorderFlex> createState() => ReorderFlexState();
Expand Down Expand Up @@ -230,13 +235,6 @@ class ReorderFlexState extends State<ReorderFlex>
);

children.add(_wrap(child, i, indexKey, item.draggable));

// if (widget.config.useMovePlaceholder) {
// children.add(DragTargeMovePlaceholder(
// dragTargetIndex: i,
// delegate: _notifier,
// ));
// }
}

final child = _wrapContainer(children);
Expand Down Expand Up @@ -616,14 +614,22 @@ class ReorderFlexState extends State<ReorderFlex>
return Row(
crossAxisAlignment: CrossAxisAlignment.start,
mainAxisAlignment: widget.mainAxisAlignment,
children: children,
children: [
if (widget.leading != null) widget.leading!,
...children,
if (widget.trailing != null) widget.trailing!
],
);
case Axis.vertical:
default:
return Column(
crossAxisAlignment: CrossAxisAlignment.start,
mainAxisAlignment: widget.mainAxisAlignment,
children: children,
children: [
if (widget.leading != null) widget.leading!,
...children,
if (widget.trailing != null) widget.trailing!
],
);
}
}
Expand Down