Skip to content

Commit

Permalink
fix: Harmonization between modal sheets (#5875)
Browse files Browse the repository at this point in the history 
* Harmonization between modal sheets

* Add a missing const
  • Loading branch information
@g123k
g123k authored Nov 21, 2024
1 parent 4f92db3 commit a32fde1
Show file tree
Hide file tree
Showing 4 changed files with 91 additions and 59 deletions.
110 changes: 63 additions & 47 deletions packages/smooth_app/lib/generic_lib/bottom_sheets/smooth_bottom_sheet.dart
View file
Original file line number Diff line number Diff line change
Expand Up @@ -6,7 +6,9 @@ import 'package:smooth_app/generic_lib/bottom_sheets/smooth_draggable_bottom_she
import 'package:smooth_app/generic_lib/design_constants.dart';
import 'package:smooth_app/helpers/haptic_feedback_helper.dart';
import 'package:smooth_app/resources/app_icons.dart' as icons;
import 'package:smooth_app/themes/smooth_theme.dart';
import 'package:smooth_app/themes/smooth_theme_colors.dart';
import 'package:smooth_app/themes/theme_provider.dart';

Future<T?> showSmoothModalSheet<T>({
required BuildContext context,
Expand Down Expand Up @@ -98,7 +100,7 @@ class SmoothModalSheet extends StatelessWidget {
@override
Widget build(BuildContext context) {
Widget bodyChild = Padding(
padding: bodyPadding ?? const EdgeInsets.all(MEDIUM_SPACE),
padding: bodyPadding ?? const EdgeInsetsDirectional.all(MEDIUM_SPACE),
child: body,
);

Expand Down Expand Up @@ -147,15 +149,23 @@ class SmoothModalSheetHeader extends StatelessWidget implements SizeWidget {
@override
Widget build(BuildContext context) {
final Color primaryColor =
Theme.of(context).extension<SmoothColorsThemeExtension>()!.primaryDark;
context.extension<SmoothColorsThemeExtension>().primaryDark;
final Color tintColor = foregroundColor ?? Colors.white;

return IconTheme(
data: IconThemeData(color: tintColor),
child: Container(
height: suffix is SmoothModalSheetHeaderButton ? double.infinity : null,
color: backgroundColor ?? primaryColor,
constraints: const BoxConstraints(minHeight: MIN_HEIGHT),
decoration: BoxDecoration(
color: backgroundColor ?? primaryColor,
boxShadow: <BoxShadow>[
BoxShadow(
color: Colors.black.withOpacity(0.2),
blurRadius: 5.0,
),
],
),
padding: EdgeInsetsDirectional.only(
start: (prefix?.requiresPadding == true ? 0 : VERY_LARGE_SPACE),
top: VERY_SMALL_SPACE,
Expand Down Expand Up @@ -225,9 +235,11 @@ class SmoothModalSheetHeaderButton extends StatelessWidget
this.tooltip,
});

static const EdgeInsetsGeometry _padding = EdgeInsetsDirectional.symmetric(
horizontal: 15.0,
vertical: 10.0,
static const EdgeInsetsGeometry _padding = EdgeInsetsDirectional.only(
start: LARGE_SPACE - 1,
end: LARGE_SPACE,
top: BALANCED_SPACE,
bottom: BALANCED_SPACE,
);

final String label;
Expand All @@ -238,6 +250,10 @@ class SmoothModalSheetHeaderButton extends StatelessWidget

@override
Widget build(BuildContext context) {
final SmoothColorsThemeExtension extension =
context.extension<SmoothColorsThemeExtension>();
final bool lightTheme = context.lightTheme();

return Semantics(
value: tooltip,
button: true,
Expand All @@ -251,39 +267,34 @@ class SmoothModalSheetHeaderButton extends StatelessWidget
shape: const RoundedRectangleBorder(
borderRadius: ROUNDED_BORDER_RADIUS,
),
foregroundColor: Colors.white,
backgroundColor: Theme.of(context).primaryColor,
iconColor: Colors.white,
foregroundColor: lightTheme ? Colors.black : Colors.white,
backgroundColor:
lightTheme ? extension.primaryMedium : extension.primaryBlack,
iconColor: lightTheme ? Colors.black : Colors.white,
),
child: IconTheme(
data: const IconThemeData(
color: Colors.white,
size: 20.0,
),
child: Row(
children: <Widget>[
if (prefix != null) ...<Widget>[
prefix!,
const SizedBox(
width: SMALL_SPACE,
),
],
Text(
label,
style: const TextStyle(
color: Colors.white,
fontSize: 17.0,
),
maxLines: 1,
child: Row(
children: <Widget>[
if (prefix != null) ...<Widget>[
prefix!,
const SizedBox(
width: SMALL_SPACE,
),
if (suffix != null) ...<Widget>[
const SizedBox(
width: SMALL_SPACE,
),
suffix!,
],
],
),
Text(
label,
style: const TextStyle(
fontSize: 16.5,
fontWeight: FontWeight.bold,
),
maxLines: 1,
),
if (suffix != null) ...<Widget>[
const SizedBox(
width: SMALL_SPACE,
),
suffix!,
],
],
),
),
),
Expand Down Expand Up @@ -326,15 +337,15 @@ class SmoothModalSheetHeaderCloseButton extends StatelessWidget
width: 1.5,
),
),
margin: const EdgeInsets.all(VERY_SMALL_SPACE),
padding: const EdgeInsets.all(SMALL_SPACE),
margin: const EdgeInsetsDirectional.all(VERY_SMALL_SPACE),
padding: const EdgeInsetsDirectional.all(SMALL_SPACE),
child: const icons.Close(
size: 13.0,
),
);
} else {
icon = const Padding(
padding: EdgeInsets.all(MEDIUM_SPACE),
padding: EdgeInsetsDirectional.all(MEDIUM_SPACE),
child: icons.Close(
size: 15.0,
),
Expand Down Expand Up @@ -379,14 +390,19 @@ class SmoothModalSheetHeaderPrefixIndicator extends StatelessWidget
@override
Widget build(BuildContext context) {
final SmoothColorsThemeExtension extension =
Theme.of(context).extension<SmoothColorsThemeExtension>()!;

return Container(
width: 10.0,
height: 10.0,
decoration: BoxDecoration(
color: extension.secondaryNormal,
shape: BoxShape.circle,
context.extension<SmoothColorsThemeExtension>();

return Padding(
padding: const EdgeInsetsDirectional.only(end: VERY_SMALL_SPACE),
child: SizedBox(
width: 10.0,
height: 10.0,
child: DecoratedBox(
decoration: BoxDecoration(
color: extension.secondaryNormal,
shape: BoxShape.circle,
),
),
),
);
}
Expand Down
14 changes: 11 additions & 3 deletions packages/smooth_app/lib/pages/all_product_list_modal.dart
View file
Original file line number Diff line number Diff line change
Expand Up @@ -8,6 +8,9 @@ import 'package:smooth_app/generic_lib/design_constants.dart';
import 'package:smooth_app/pages/preferences/user_preferences_list_tile.dart';
import 'package:smooth_app/pages/product/common/product_list_popup_items.dart';
import 'package:smooth_app/pages/product/common/product_query_page_helper.dart';
import 'package:smooth_app/themes/smooth_theme.dart';
import 'package:smooth_app/themes/smooth_theme_colors.dart';
import 'package:smooth_app/themes/theme_provider.dart';

/// Page that lists all product lists.
class AllProductListModal extends StatelessWidget {
Expand Down Expand Up @@ -84,10 +87,14 @@ class _ModalProductListItem extends StatelessWidget {

@override
Widget build(BuildContext context) {
final LocalDatabase localDatabase = context.watch<LocalDatabase>();
final SmoothColorsThemeExtension extension =
context.extension<SmoothColorsThemeExtension>();
final bool lightTheme = context.lightTheme();

final AppLocalizations appLocalizations = AppLocalizations.of(context);

final LocalDatabase localDatabase = context.watch<LocalDatabase>();

final int productsLength = productList.barcodes.length;
final bool enableRename = productList.listType == ProductListType.USER;
final bool hasProducts = productsLength > 0;
Expand Down Expand Up @@ -121,7 +128,7 @@ class _ModalProductListItem extends StatelessWidget {
child: ListTile(
leading: Icon(item.getIconData()),
title: Text(item.getTitle(appLocalizations)),
contentPadding: EdgeInsets.zero,
contentPadding: EdgeInsetsDirectional.zero,
onTap: () async {
Navigator.of(context).pop();
await item.doSomething(
Expand All @@ -140,7 +147,8 @@ class _ModalProductListItem extends StatelessWidget {
)
: null,
selected: selected,
selectedColor: Theme.of(context).primaryColor.withOpacity(0.2),
selectedColor:
lightTheme ? extension.primaryMedium : extension.primarySemiDark,
contentPadding: const EdgeInsetsDirectional.only(
start: VERY_LARGE_SPACE,
end: LARGE_SPACE,
Expand Down
25 changes: 16 additions & 9 deletions packages/smooth_app/lib/pages/preferences/user_preferences_widgets.dart
View file
Original file line number Diff line number Diff line change
Expand Up @@ -337,13 +337,16 @@ class UserPreferencesMultipleChoicesItem<T> extends StatelessWidget {

// If there is not enough space, we use the scrolling sheet
final T? res;
final SmoothModalSheetHeader header =
SmoothModalSheetHeader(title: title);
final SmoothModalSheetHeader header = SmoothModalSheetHeader(
title: title,
prefix: const SmoothModalSheetHeaderPrefixIndicator(),
);

if ((itemHeight * labels.length + header.computeHeight(context)) >
(queryData.size.height * 0.9) - queryData.viewPadding.top) {
res = await showSmoothDraggableModalSheet<T>(
context: context,
header: SmoothModalSheetHeader(title: title),
header: header,
bodyBuilder: (BuildContext context) {
return SliverList(
delegate: SliverChildBuilderDelegate(
Expand All @@ -370,6 +373,7 @@ class UserPreferencesMultipleChoicesItem<T> extends StatelessWidget {
} else {
final SmoothModalSheet smoothModalSheet = SmoothModalSheet(
title: title,
prefixIndicator: true,
bodyPadding: EdgeInsets.zero,
body: SizedBox(
height: itemHeight * labels.length,
Expand Down Expand Up @@ -446,19 +450,21 @@ class _ChoiceItem<T> extends StatelessWidget {
final ThemeData theme = Theme.of(context);
final SmoothColorsThemeExtension extension =
theme.extension<SmoothColorsThemeExtension>()!;
final Color? selectedColor = selected
? context.lightTheme()
? extension.primaryMedium
: extension.primaryDark
: null;
final bool lightTheme = context.lightTheme();

final Color backgroundColor = selected
? (lightTheme ? extension.primaryMedium : extension.primarySemiDark)
: context.lightTheme()
? Colors.transparent
: extension.primaryUltraBlack;

return Semantics(
value: label,
selected: selected,
button: true,
excludeSemantics: true,
child: Ink(
color: selectedColor ?? Colors.transparent,
color: backgroundColor,
child: Column(
children: <Widget>[
ListTile(
Expand All @@ -467,6 +473,7 @@ class _ChoiceItem<T> extends StatelessWidget {
title: Text(
label,
style: theme.textTheme.headlineMedium?.copyWith(
color: !lightTheme ? Colors.white : null,
fontWeight: selected ? FontWeight.bold : FontWeight.normal,
),
),
Expand Down
1 change: 1 addition & 0 deletions packages/smooth_app/lib/pages/product/common/product_list_page.dart
View file
Original file line number Diff line number Diff line change
Expand Up @@ -511,6 +511,7 @@ class _ProductListPageState extends State<ProductListPage>
context: context,
header: SmoothModalSheetHeader(
title: appLocalizations.product_list_select,
prefix: const SmoothModalSheetHeaderPrefixIndicator(),
suffix: SmoothModalSheetHeaderButton(
label: appLocalizations.product_list_create,
prefix: const Icon(Icons.add_circle_outline_sharp),
Expand Down

0 comments on commit a32fde1

Please sign in to comment.