Skip to content

Commit

Permalink
feat: User lists: change the way to switch between lists (#5521)
Browse files Browse the repository at this point in the history
* User lists: change the way the switch between lists

* Improve a11n
  • Loading branch information
g123k authored Aug 5, 2024
1 parent 344518d commit 7b3cfab
Show file tree
Hide file tree
Showing 2 changed files with 127 additions and 51 deletions.
152 changes: 110 additions & 42 deletions packages/smooth_app/lib/pages/product/common/product_list_page.dart
Original file line number Diff line number Diff line change
Expand Up @@ -30,6 +30,8 @@ import 'package:smooth_app/pages/product/common/product_refresher.dart';
import 'package:smooth_app/pages/product_list_user_dialog_helper.dart';
import 'package:smooth_app/pages/scan/carousel/scan_carousel_manager.dart';
import 'package:smooth_app/query/product_query.dart';
import 'package:smooth_app/resources/app_icons.dart' as icons;
import 'package:smooth_app/themes/theme_provider.dart';
import 'package:smooth_app/widgets/smooth_app_bar.dart';
import 'package:smooth_app/widgets/smooth_menu_button.dart';
import 'package:smooth_app/widgets/smooth_scaffold.dart';
Expand Down Expand Up @@ -146,42 +148,6 @@ class _ProductListPageState extends State<ProductListPage>
appBar: SmoothAppBar(
centerTitle: false,
actions: <Widget>[
if (widget.allowToSwitchBetweenLists)
IconButton(
icon: const Icon(CupertinoIcons.square_list),
tooltip: appLocalizations.action_change_list,
onPressed: () async {
final ProductList? selected =
await showSmoothDraggableModalSheet<ProductList>(
context: context,
header: SmoothModalSheetHeader(
title: appLocalizations.product_list_select,
suffix: SmoothModalSheetHeaderButton(
label: appLocalizations.product_list_create,
prefix: const Icon(Icons.add_circle_outline_sharp),
tooltip: appLocalizations.product_list_create_tooltip,
onTap: () async =>
ProductListUserDialogHelper(daoProductList)
.showCreateUserListDialog(context),
),
),
bodyBuilder: (BuildContext context) => AllProductListModal(
currentList: productList,
),
initHeight: _computeModalInitHeight(context),
);

if (selected == null) {
return;
}
if (context.mounted) {
await daoProductList.get(selected);
if (context.mounted) {
setState(() => productList = selected);
}
}
},
),
SmoothPopupMenuButton<ProductListPopupItem>(
onSelected: (final ProductListPopupItem action) async {
final ProductList? differentProductList =
Expand All @@ -202,13 +168,12 @@ class _ProductListPageState extends State<ProductListPage>
],
),
],
title: AutoSizeText(
ProductQueryPageHelper.getProductListLabel(
productList,
appLocalizations,
),
maxLines: 2,
title: _ProductListAppBarTitle(
productList: productList,
onTap: () => _onChangeList(appLocalizations, daoProductList),
enabled: widget.allowToSwitchBetweenLists,
),
titleSpacing: 0.0,
actionMode: _selectionMode,
onLeaveActionMode: () {
setState(() => _selectionMode = false);
Expand Down Expand Up @@ -502,4 +467,107 @@ class _ProductListPageState extends State<ProductListPage>
}
return false;
}

Future<void> _onChangeList(
AppLocalizations appLocalizations,
DaoProductList daoProductList,
) async {
final ProductList? selected =
await showSmoothDraggableModalSheet<ProductList>(
context: context,
header: SmoothModalSheetHeader(
title: appLocalizations.product_list_select,
suffix: SmoothModalSheetHeaderButton(
label: appLocalizations.product_list_create,
prefix: const Icon(Icons.add_circle_outline_sharp),
tooltip: appLocalizations.product_list_create_tooltip,
onTap: () async => ProductListUserDialogHelper(daoProductList)
.showCreateUserListDialog(context),
),
),
bodyBuilder: (BuildContext context) => AllProductListModal(
currentList: productList,
),
initHeight: _computeModalInitHeight(context),
);

if (selected == null) {
return;
}
if (context.mounted) {
await daoProductList.get(selected);
if (context.mounted) {
setState(() => productList = selected);
}
}
}
}

class _ProductListAppBarTitle extends StatelessWidget {
const _ProductListAppBarTitle({
required this.productList,
required this.onTap,
required this.enabled,
});

final ProductList productList;
final VoidCallback onTap;
final bool enabled;

@override
Widget build(BuildContext context) {
final AppLocalizations appLocalizations = AppLocalizations.of(context);
final String title = ProductQueryPageHelper.getProductListLabel(
productList,
appLocalizations,
);

return Semantics(
label: enabled ? appLocalizations.action_change_list : null,
value: title,
button: enabled,
excludeSemantics: true,
child: SizedBox(
height: kToolbarHeight,
child: InkWell(
borderRadius: context.read<ThemeProvider>().isAmoledTheme
? ANGULAR_BORDER_RADIUS
: null,
onTap: enabled ? onTap : null,
child: Padding(
padding: const EdgeInsetsDirectional.symmetric(
horizontal: NavigationToolbar.kMiddleSpacing,
),
child: LayoutBuilder(
builder: (_, BoxConstraints constraints) {
return Row(
crossAxisAlignment: CrossAxisAlignment.center,
children: <Widget>[
ConstrainedBox(
constraints: BoxConstraints(
maxWidth: constraints.maxWidth * 0.9 -
(enabled ? (MEDIUM_SPACE - 15.0) : 0),
),
child: AutoSizeText(
title,
maxLines: 2,
),
),
if (enabled) ...<Widget>[
const SizedBox(width: MEDIUM_SPACE),
icons.AppIconTheme(
semanticLabel: appLocalizations.action_change_list,
size: 15.0,
child: const icons.Chevron.down(),
)
]
],
);
},
),
),
),
),
);
}
}
26 changes: 17 additions & 9 deletions packages/smooth_app/lib/resources/app_icons.dart
Original file line number Diff line number Diff line change
Expand Up @@ -695,13 +695,15 @@ abstract class AppIcon extends StatelessWidget {
this.color,
this.shadow,
this.size,
this.semanticLabel,
super.key,
}) : assert(size == null || size >= 0);

final IconData icon;
final Color? color;
final double? size;
final Shadow? shadow;
final String? semanticLabel;

@override
@mustCallSuper
Expand All @@ -719,14 +721,17 @@ abstract class AppIcon extends StatelessWidget {
Theme.of(context).iconTheme.color,
};

return Icon(icon,
color: color,
size: size ?? iconTheme?.size,
shadows: shadow != null
? <Shadow>[shadow!]
: iconTheme?.shadow != null
? <Shadow>[iconTheme!.shadow!]
: null);
return Icon(
icon,
color: color,
size: size ?? iconTheme?.size,
semanticLabel: iconTheme?.semanticLabel ?? semanticLabel,
shadows: shadow != null
? <Shadow>[shadow!]
: iconTheme?.shadow != null
? <Shadow>[iconTheme!.shadow!]
: null,
);
}
}

Expand All @@ -739,11 +744,13 @@ class AppIconTheme extends InheritedWidget {
this.color,
this.size,
this.shadow,
this.semanticLabel,
});

final Color? color;
final double? size;
final Shadow? shadow;
final String? semanticLabel;

static AppIconTheme of(BuildContext context) {
final AppIconTheme? result = maybeOf(context);
Expand All @@ -758,7 +765,8 @@ class AppIconTheme extends InheritedWidget {
@override
bool updateShouldNotify(AppIconTheme oldWidget) {
return color != oldWidget.color ||
size != oldWidget.size ||
semanticLabel != oldWidget.semanticLabel ||
shadow != oldWidget.shadow ||
shadow != oldWidget.shadow;
}
}

0 comments on commit 7b3cfab

Please sign in to comment.