Skip to content

Commit

Permalink
Add isCompact field to CommandBar (bdlukaa#235)
Browse files Browse the repository at this point in the history
  • Loading branch information
dev-hann committed Mar 23, 2022
2 parents 436a8d7 + 5fc30c3 commit 290efc8
Show file tree
Hide file tree
Showing 2 changed files with 22 additions and 3 deletions.
3 changes: 2 additions & 1 deletion example/lib/screens/commandbars.dart
Original file line number Diff line number Diff line change
Expand Up @@ -149,12 +149,13 @@ class _CommandBarsState extends State<CommandBars> {
),
const SizedBox(height: 20.0),
InfoLabel(
label: 'Carded command bar with many items (clipped)',
label: 'Carded compact command bar with many items (clipped)',
child: ConstrainedBox(
constraints: const BoxConstraints(maxWidth: 230),
child: CommandBarCard(
child: CommandBar(
overflowBehavior: CommandBarOverflowBehavior.clip,
isCompact: true,
primaryItems: [
...simpleCommandBarItems,
const CommandBarSeparator(),
Expand Down
22 changes: 20 additions & 2 deletions lib/src/controls/surfaces/commandbar.dart
Original file line number Diff line number Diff line change
Expand Up @@ -93,11 +93,25 @@ class CommandBar extends StatefulWidget {

/// If the width of this widget is less then the indicated amount,
/// items in the primary area will be rendered using
/// [CommandBarItemDisplayMode.inPrimaryCompact]. If this is null
/// [CommandBarItemDisplayMode.inPrimaryCompact]. If this is `null`
/// or the width of this widget is wider, then the items will be rendered
/// using [CommandBarItemDisplayMode.inPrimary].
final double? compactBreakpointWidth;

/// If [compactBreakpointWidth] is `null`, then specifies whether or not
/// primary items should be displayed in compact mode
/// ([CommandBarItemDisplayMode.inPrimaryCompact]) or normal mode
/// [CommandBarItemDisplayMode.inPrimary].
///
/// This can be useful if the CommandBar is used in a setting where
/// [compactBreakpointWidth] cannot be used (i.e. because using
/// [LayoutBuilder] cannot be used in a context where the intrinsic
/// height is also calculated), and you want to specify whether or not
/// the primary items should be compact or not.
///
/// If [compactBreakpointWidth] is not `null` this field is ignored.
final bool? isCompact;

/// The alignment of the items within the command bar across the main axis
final MainAxisAlignment mainAxisAlignment;

Expand All @@ -122,6 +136,7 @@ class CommandBar extends StatefulWidget {
this.overflowItemBuilder,
this.overflowBehavior = CommandBarOverflowBehavior.dynamicOverflow,
this.compactBreakpointWidth,
this.isCompact,
this.mainAxisAlignment = MainAxisAlignment.start,
this.crossAxisAlignment = CrossAxisAlignment.center,
this.overflowItemAlignment = MainAxisAlignment.end,
Expand Down Expand Up @@ -309,7 +324,10 @@ class _CommandBarState extends State<CommandBar> {
@override
Widget build(BuildContext context) {
if (widget.compactBreakpointWidth == null) {
return _buildForPrimaryMode(context, CommandBarItemDisplayMode.inPrimary);
final displayMode = (widget.isCompact ?? false)
? CommandBarItemDisplayMode.inPrimaryCompact
: CommandBarItemDisplayMode.inPrimary;
return _buildForPrimaryMode(context, displayMode);
} else {
return LayoutBuilder(
builder: (context, constraints) {
Expand Down

0 comments on commit 290efc8

Please sign in to comment.