Skip to content

Commit

Permalink
When there's not enough space, make the tagline scrollable (openfoodf…
Browse files Browse the repository at this point in the history 
…acts#6093)
  • Loading branch information
@g123k
g123k authored Dec 31, 2024
1 parent 55fbe49 commit d24ca6c
Show file tree
Hide file tree
Showing 3 changed files with 299 additions and 183 deletions.
5 changes: 5 additions & 0 deletions packages/smooth_app/lib/helpers/extension_on_text_helper.dart
View file
Original file line number Diff line number Diff line change
Expand Up @@ -44,3 +44,8 @@ extension StringExtensions on String {
return count;
}
}

extension TextScalerExtension on BuildContext {
/// Returns the text font multiplier
double textScaler() => MediaQuery.textScalerOf(this).scale(1.0);
}
159 changes: 111 additions & 48 deletions packages/smooth_app/lib/pages/scan/carousel/main_card/scan_main_card.dart
View file
Original file line number Diff line number Diff line change
@@ -1,10 +1,13 @@
import 'dart:math' as math;

import 'package:flutter/material.dart';
import 'package:flutter_gen/gen_l10n/app_localizations.dart';
import 'package:flutter_svg/flutter_svg.dart';
import 'package:provider/provider.dart';
import 'package:smooth_app/data_models/news_feed/newsfeed_provider.dart';
import 'package:smooth_app/generic_lib/design_constants.dart';
import 'package:smooth_app/generic_lib/widgets/smooth_card.dart';
import 'package:smooth_app/helpers/extension_on_text_helper.dart';
import 'package:smooth_app/helpers/provider_helper.dart';
import 'package:smooth_app/pages/navigator/app_navigator.dart';
import 'package:smooth_app/pages/scan/carousel/main_card/scan_tagline.dart';
Expand All @@ -19,23 +22,45 @@ class ScanMainCard extends StatelessWidget {

@override
Widget build(BuildContext context) {
return Column(
children: <Widget>[
Expanded(
child: ConsumerFilter<AppNewsProvider>(
buildWhen:
(AppNewsProvider? previousValue, AppNewsProvider currentValue) {
return previousValue?.hasContent != currentValue.hasContent;
},
builder: (BuildContext context, AppNewsProvider newsFeed, _) {
if (!newsFeed.hasContent) {
return const _SearchCard(
expandedMode: true,
);
} else {
return Semantics(
explicitChildNodes: true,
child: const Column(
return ConsumerFilter<AppNewsProvider>(
buildWhen:
(AppNewsProvider? previousValue, AppNewsProvider currentValue) {
return previousValue?.hasContent != currentValue.hasContent;
},
builder: (BuildContext context, AppNewsProvider newsFeed, _) {
if (!newsFeed.hasContent) {
return const _SearchCard(
expandedMode: true,
);
} else {
return Semantics(
explicitChildNodes: true,
child: LayoutBuilder(
builder: (_, BoxConstraints constraints) {
final bool dense = constraints.maxHeight * 0.4 <=
_maxHeight(context.textScaler());

if (dense) {
return ListView(
padding: EdgeInsets.zero,
children: <Widget>[
ConstrainedBox(
constraints: BoxConstraints(
minHeight: math.max(
_SearchCard.computeMinSize(context),
constraints.maxHeight * 0.5,
),
),
child: const _SearchCard(
expandedMode: false,
),
),
const SizedBox(height: SMALL_SPACE),
const ScanTagLine(dense: true),
],
);
} else {
return const Column(
children: <Widget>[
Expanded(
flex: 6,
Expand All @@ -46,18 +71,28 @@ class ScanMainCard extends StatelessWidget {
SizedBox(height: SMALL_SPACE),
Expanded(
flex: 4,
child: ScanTagLine(),
child: ScanTagLine(dense: false),
),
],
),
);
}
},
),
),
],
);
}
},
),
);
}
},
);
}

double _maxHeight(double textScaler) {
if (textScaler < 1.1) {
return 160.0;
} else if (textScaler < 1.3) {
return 173.0;
} else {
return 186.0;
}
}
}

class _SearchCard extends StatelessWidget {
Expand All @@ -75,34 +110,43 @@ class _SearchCard extends StatelessWidget {

final Widget widget = SmoothCard(
color: lightTheme ? Colors.grey.withValues(alpha: 0.1) : Colors.black,
padding: const EdgeInsets.symmetric(
vertical: MEDIUM_SPACE,
horizontal: LARGE_SPACE,
),
padding: EdgeInsets.zero,
margin: const EdgeInsets.symmetric(
horizontal: 0.0,
vertical: VERY_SMALL_SPACE,
),
ignoreDefaultSemantics: true,
child: Column(
mainAxisAlignment: MainAxisAlignment.spaceEvenly,
children: <Widget>[
SvgPicture.asset(
lightTheme
? 'assets/app/logo_text_black.svg'
: 'assets/app/logo_text_white.svg',
semanticsLabel: localizations.homepage_main_card_logo_description,
),
TextWithBoldParts(
text: localizations.homepage_main_card_subheading,
textAlign: TextAlign.center,
textStyle: const TextStyle(height: 1.3),
),
const Padding(
padding: EdgeInsets.symmetric(horizontal: SMALL_SPACE),
child: _SearchBar(),
),
],
child: Padding(
padding: const EdgeInsets.symmetric(
vertical: MEDIUM_SPACE,
horizontal: LARGE_SPACE,
),
child: Column(
mainAxisAlignment: MainAxisAlignment.spaceEvenly,
children: <Widget>[
LayoutBuilder(builder: (_, BoxConstraints constraints) {
return SvgPicture.asset(
lightTheme
? 'assets/app/logo_text_black.svg'
: 'assets/app/logo_text_white.svg',
width: math.min(311.0, constraints.maxWidth * 0.85),
semanticsLabel:
localizations.homepage_main_card_logo_description,
);
}),
const SizedBox(height: VERY_SMALL_SPACE),
TextWithBoldParts(
text: localizations.homepage_main_card_subheading,
textAlign: TextAlign.center,
textStyle: const TextStyle(height: 1.3, fontSize: 15.0),
),
const SizedBox(height: MEDIUM_SPACE),
const Padding(
padding: EdgeInsets.symmetric(horizontal: SMALL_SPACE),
child: _SearchBar(),
),
],
),
),
);

Expand All @@ -117,6 +161,24 @@ class _SearchCard extends StatelessWidget {
return widget;
}
}

static double computeMinSize(BuildContext context, {bool expanded = false}) {
if (expanded) {
return MediaQuery.sizeOf(context).height * 0.4;
} else {
return (MEDIUM_SPACE * 3) +
(VERY_SMALL_SPACE * 3) +
// Logo
54.0 +
// Text
((2 * DefaultTextStyle.of(context).style.fontSize!) * 1.3) *
context.textScaler() +
// Search bar
SearchFieldUIHelper.SEARCH_BAR_HEIGHT +
// Extra space
VERY_LARGE_SPACE;
}
}
}

class _SearchBar extends StatelessWidget {
Expand Down Expand Up @@ -158,6 +220,7 @@ class _SearchBar extends StatelessWidget {
child: Text(
localizations.homepage_main_card_search_field_hint,
maxLines: 1,
textScaler: TextScaler.noScaling,
overflow: TextOverflow.ellipsis,
style: SearchFieldUIHelper.textStyle(context),
),
Expand Down
Loading

0 comments on commit d24ca6c

Please sign in to comment.