Skip to content

Commit

Permalink
fix: UI changes for the homepage (#5911)
Browse files Browse the repository at this point in the history
* Some changes for the homepage

* Fix unused variable

* Fix a typo issue with small screens
  • Loading branch information
g123k authored Nov 23, 2024
1 parent f02da85 commit f877ece
Show file tree
Hide file tree
Showing 4 changed files with 156 additions and 155 deletions.
20 changes: 11 additions & 9 deletions packages/scanner/shared/lib/src/scanner_visor.dart
Original file line number Diff line number Diff line change
Expand Up @@ -14,7 +14,7 @@ class SmoothBarcodeScannerVisor extends StatelessWidget {

@override
Widget build(BuildContext context) {
final EdgeInsetsGeometry contentPadding = _computePadding();
final EdgeInsetsGeometry contentPadding = _computePadding(context);

return AnimatedPadding(
padding: contentPadding,
Expand All @@ -38,16 +38,18 @@ class SmoothBarcodeScannerVisor extends StatelessWidget {
);
}

EdgeInsetsGeometry _computePadding() {
EdgeInsetsGeometry _computePadding(BuildContext context) {
final EdgeInsetsDirectional padding = EdgeInsetsDirectional.only(
top: MediaQuery.viewPaddingOf(context).top + CORNER_PADDING / 2,
start: CORNER_PADDING,
end: CORNER_PADDING,
bottom: CORNER_PADDING,
);

if (contentPadding == null) {
return const EdgeInsets.all(CORNER_PADDING);
return padding;
} else {
return const EdgeInsets.only(
top: CORNER_PADDING / 4.0,
left: CORNER_PADDING,
right: CORNER_PADDING,
bottom: CORNER_PADDING,
).add(contentPadding!);
return padding.add(contentPadding!);
}
}
}
Expand Down
18 changes: 16 additions & 2 deletions packages/smooth_app/lib/pages/scan/camera_scan_page.dart
Original file line number Diff line number Diff line change
Expand Up @@ -92,6 +92,8 @@ class _CameraScannerPageState extends State<CameraScannerPage>
);
}

final double statusBarHeight = MediaQuery.viewPaddingOf(context).top;

return ScreenVisibilityDetector(
child: Stack(
children: <Widget>[
Expand All @@ -111,8 +113,20 @@ class _CameraScannerPageState extends State<CameraScannerPage>
: null,
),
),
Align(
alignment: Alignment.topCenter,
Positioned(
top: 0.0,
left: 0.0,
right: 0.0,
child: Container(
height: statusBarHeight,
width: double.infinity,
color: Colors.black12,
),
),
Positioned(
top: statusBarHeight,
left: 0.0,
right: 0.0,
child: ScanHeader(
key: _headerKey,
),
Expand Down
Original file line number Diff line number Diff line change
Expand Up @@ -143,44 +143,46 @@ class _ScanTagLineContentState extends State<_ScanTagLineContent> {
),
),
Expanded(
child: DecoratedBox(
decoration: BoxDecoration(
color: currentNews.style?.contentBackgroundColor ??
(!themeProvider.isDarkMode(context)
? theme.primaryMedium
: theme.primaryDark),
borderRadius: const BorderRadiusDirectional.only(
bottomStart: radius,
bottomEnd: radius,
),
),
child: Padding(
padding: EdgeInsetsDirectional.symmetric(
vertical: dense ? 6.0 : SMALL_SPACE,
horizontal: MEDIUM_SPACE,
child: Material(
type: MaterialType.card,
color: currentNews.style?.contentBackgroundColor ??
(!themeProvider.isDarkMode(context)
? theme.primaryMedium
: theme.primaryDark),
borderRadius: const BorderRadius.vertical(bottom: radius),
child: InkWell(
borderRadius: const BorderRadius.vertical(bottom: radius),
onTap: () => LaunchUrlHelper.launchURLAndFollowDeepLinks(
context,
currentNews.url,
),
child: Column(
children: <Widget>[
Expanded(
child: _TagLineContentBody(
message: currentNews.message,
textColor: currentNews.style?.messageTextColor,
image: currentNews.image,
dense: dense,
child: Padding(
padding: EdgeInsetsDirectional.symmetric(
vertical: dense ? 6.0 : SMALL_SPACE,
horizontal: MEDIUM_SPACE,
),
child: Column(
children: <Widget>[
Expanded(
child: _TagLineContentBody(
message: currentNews.message,
textColor: currentNews.style?.messageTextColor,
image: currentNews.image,
dense: dense,
),
),
),
SizedBox(height: dense ? VERY_SMALL_SPACE : SMALL_SPACE),
Align(
alignment: AlignmentDirectional.bottomEnd,
child: _TagLineContentButton(
link: currentNews.url,
label: currentNews.buttonLabel,
backgroundColor: currentNews.style?.buttonBackground,
foregroundColor: currentNews.style?.buttonTextColor,
dense: dense,
SizedBox(height: dense ? VERY_SMALL_SPACE : SMALL_SPACE),
Align(
alignment: AlignmentDirectional.bottomEnd,
child: _TagLineContentButton(
label: currentNews.buttonLabel,
backgroundColor: currentNews.style?.buttonBackground,
foregroundColor: currentNews.style?.buttonTextColor,
dense: dense,
),
),
),
],
],
),
),
),
),
Expand Down Expand Up @@ -212,8 +214,6 @@ class _TagLineContentTitle extends StatelessWidget {

@override
Widget build(BuildContext context) {
final SmoothColorsThemeExtension theme =
Theme.of(context).extension<SmoothColorsThemeExtension>()!;
final AppLocalizations localizations = AppLocalizations.of(context);

return Semantics(
Expand All @@ -227,7 +227,7 @@ class _TagLineContentTitle extends StatelessWidget {
dimension: 11.0,
child: DecoratedBox(
decoration: BoxDecoration(
color: indicatorColor ?? theme.secondaryLight,
color: indicatorColor ?? Colors.white,
borderRadius: const BorderRadius.all(ROUNDED_RADIUS),
),
),
Expand Down Expand Up @@ -364,14 +364,12 @@ class _TagLineContentBodyState extends State<_TagLineContentBody> {

class _TagLineContentButton extends StatelessWidget {
const _TagLineContentButton({
required this.link,
required this.dense,
this.label,
this.backgroundColor,
this.foregroundColor,
});

final String link;
final String? label;
final Color? backgroundColor;
final Color? foregroundColor;
Expand All @@ -392,40 +390,32 @@ class _TagLineContentButton extends StatelessWidget {
borderRadius: const BorderRadius.all(ROUNDED_RADIUS),
color: backgroundColor ?? theme.primaryBlack,
),
child: Material(
type: MaterialType.transparency,
child: InkWell(
borderRadius: const BorderRadius.all(ROUNDED_RADIUS),
onTap: () => LaunchUrlHelper.launchURLAndFollowDeepLinks(
context,
link,
),
child: Padding(
padding: const EdgeInsetsDirectional.symmetric(
vertical: VERY_SMALL_SPACE,
horizontal: VERY_LARGE_SPACE,
),
child: Row(
mainAxisSize: MainAxisSize.min,
children: <Widget>[
Padding(
padding: const EdgeInsetsDirectional.only(bottom: 0.5),
child: Text(
label ?? localizations.tagline_feed_news_button,
style: const TextStyle(
fontWeight: FontWeight.bold,
color: Colors.white,
),
),
),
const SizedBox(width: MEDIUM_SPACE),
const CircledArrow.right(
size: 18.0,
child: Padding(
padding: const EdgeInsetsDirectional.symmetric(
vertical: VERY_SMALL_SPACE,
horizontal: VERY_LARGE_SPACE,
),
child: Row(
mainAxisSize: MainAxisSize.min,
children: <Widget>[
Padding(
padding: const EdgeInsetsDirectional.only(bottom: 1.0),
child: Text(
label ?? localizations.tagline_feed_news_button,
style: const TextStyle(
fontWeight: FontWeight.bold,
color: Colors.white,
),
],
),
),
),
const SizedBox(width: MEDIUM_SPACE),
CircledArrow.right(
type: CircledArrowType.normal,
size: 18.0,
color: backgroundColor ?? theme.primaryBlack,
circleColor: Colors.white,
),
],
),
),
),
Expand Down
Loading

0 comments on commit f877ece

Please sign in to comment.