diff --git a/lib/logic/app_logic.dart b/lib/logic/app_logic.dart index 30a1d24d..ef01b329 100644 --- a/lib/logic/app_logic.dart +++ b/lib/logic/app_logic.dart @@ -142,7 +142,9 @@ class AppLogic { urls.add('${ImagePaths.common}/tab-artifacts${i == 0 ? '-active' : ''}.png'); urls.add('${ImagePaths.common}/tab-timeline${i == 0 ? '-active' : ''}.png'); } - urls.forEach((url) => precacheUrl(url, context)); + for (var url in urls) { + precacheUrl(url, context); + } } void precacheWonderImages(BuildContext context) { @@ -195,16 +197,18 @@ class AppLogic { ]; // Universals. - folderNames.forEach((name) { + for (var name in folderNames) { urls.add('${ImagePaths.root}/$name/flattened.jpg'); urls.add('${ImagePaths.root}/$name/wonder-button.png'); urls.add('${ImagePaths.root}/$name/photo-1.jpg'); urls.add('${ImagePaths.root}/$name/photo-2.jpg'); urls.add('${ImagePaths.root}/$name/photo-3.jpg'); urls.add('${ImagePaths.root}/$name/photo-4.jpg'); - }); + } - urls.forEach((url) => precacheUrl(url, context)); + for (var url in urls) { + precacheUrl(url, context); + } } } diff --git a/lib/logic/common/color_utils.dart b/lib/logic/common/color_utils.dart index 68e194aa..73bb42ea 100644 --- a/lib/logic/common/color_utils.dart +++ b/lib/logic/common/color_utils.dart @@ -11,9 +11,9 @@ class ColorUtils { static Color blend(Color dst, Color src, double opacity) { return Color.fromARGB( 255, - (dst.red.toDouble() * (1.0 - opacity) + src.red.toDouble() * opacity).toInt(), - (dst.green.toDouble() * (1.0 - opacity) + src.green.toDouble() * opacity).toInt(), - (dst.blue.toDouble() * (1.0 - opacity) + src.blue.toDouble() * opacity).toInt(), + ((dst.r * (1.0 - opacity) + src.r * opacity) * 255).toInt(), + ((dst.g * (1.0 - opacity) + src.g * opacity) * 255).toInt(), + ((dst.b * (1.0 - opacity) + src.b * opacity) * 255).toInt(), ); } } diff --git a/lib/styles/styles.dart b/lib/styles/styles.dart index 9c1ada8c..572e6ccd 100644 --- a/lib/styles/styles.dart +++ b/lib/styles/styles.dart @@ -177,12 +177,12 @@ class _Insets { @immutable class _Shadows { final textSoft = [ - Shadow(color: Colors.black.withOpacity(.25), offset: Offset(0, 2), blurRadius: 4), + Shadow(color: Colors.black.withValues(alpha: .25), offset: Offset(0, 2), blurRadius: 4), ]; final text = [ - Shadow(color: Colors.black.withOpacity(.6), offset: Offset(0, 2), blurRadius: 2), + Shadow(color: Colors.black.withValues(alpha: .6), offset: Offset(0, 2), blurRadius: 2), ]; final textStrong = [ - Shadow(color: Colors.black.withOpacity(.6), offset: Offset(0, 4), blurRadius: 6), + Shadow(color: Colors.black.withValues(alpha: .6), offset: Offset(0, 4), blurRadius: 6), ]; } diff --git a/lib/ui/common/app_backdrop.dart b/lib/ui/common/app_backdrop.dart index 3a89b4f3..3c83789e 100644 --- a/lib/ui/common/app_backdrop.dart +++ b/lib/ui/common/app_backdrop.dart @@ -21,7 +21,7 @@ class AppBackdrop extends StatelessWidget { child: child ?? SizedBox.expand(), ); } - final fill = Container(color: $styles.colors.black.withOpacity(.8 * strength)); + final fill = Container(color: $styles.colors.black.withValues(alpha: .8 * strength)); return child == null ? fill : Stack( diff --git a/lib/ui/common/controls/app_image.dart b/lib/ui/common/controls/app_image.dart index 2ec18f5b..6ffcbc17 100644 --- a/lib/ui/common/controls/app_image.dart +++ b/lib/ui/common/controls/app_image.dart @@ -74,7 +74,7 @@ class _AppImageState extends State { if (size < 16) return SizedBox(); return Icon( Icons.image_not_supported_outlined, - color: $styles.colors.white.withOpacity(0.1), + color: $styles.colors.white.withValues(alpha: 0.1), size: min(size, $styles.insets.lg), ); }), diff --git a/lib/ui/common/controls/checkbox.dart b/lib/ui/common/controls/checkbox.dart index 1cf8d1dc..13b6fc11 100644 --- a/lib/ui/common/controls/checkbox.dart +++ b/lib/ui/common/controls/checkbox.dart @@ -22,8 +22,8 @@ class SimpleCheckbox extends StatelessWidget { shape: RoundedRectangleBorder(borderRadius: BorderRadius.all(Radius.circular($styles.corners.sm))), value: active, visualDensity: VisualDensity(horizontal: 0.5, vertical: 0.5), - checkColor: $styles.colors.black.withOpacity(0.75), - activeColor: $styles.colors.white.withOpacity(0.75), + checkColor: $styles.colors.black.withValues(alpha: 0.75), + activeColor: $styles.colors.white.withValues(alpha: 0.75), onChanged: (bool? active) { AppHaptics.mediumImpact(); onToggled.call(active); diff --git a/lib/ui/common/controls/scroll_decorator.dart b/lib/ui/common/controls/scroll_decorator.dart index fd80aeeb..e0fd5542 100644 --- a/lib/ui/common/controls/scroll_decorator.dart +++ b/lib/ui/common/controls/scroll_decorator.dart @@ -70,7 +70,7 @@ class ScrollDecorator extends StatefulWidget { height: 24, decoration: BoxDecoration( gradient: LinearGradient( - colors: [color.withOpacity(ratio * color.opacity), Colors.transparent], + colors: [color.withValues(alpha: ratio * color.a), Colors.transparent], stops: [0, ratio], begin: Alignment.topCenter, end: Alignment.bottomCenter, diff --git a/lib/ui/common/fade_color_transition.dart b/lib/ui/common/fade_color_transition.dart index b1ab6ee3..e1ebac5d 100644 --- a/lib/ui/common/fade_color_transition.dart +++ b/lib/ui/common/fade_color_transition.dart @@ -10,6 +10,6 @@ class FadeColorTransition extends StatelessWidget { @override Widget build(BuildContext context) => AnimatedBuilder( animation: animation, - builder: (_, __) => Container(color: color.withOpacity(animation.value)), + builder: (_, __) => Container(color: color.withValues(alpha: animation.value)), ); } diff --git a/lib/ui/common/list_gradient.dart b/lib/ui/common/list_gradient.dart index 35bef772..745f40b0 100644 --- a/lib/ui/common/list_gradient.dart +++ b/lib/ui/common/list_gradient.dart @@ -12,6 +12,7 @@ class ListOverscollGradient extends StatelessWidget { @override Widget build(BuildContext context) { final c = color ?? $styles.colors.black; - return VtGradient([c.withOpacity(bottomUp ? 0 : 1), c.withOpacity(bottomUp ? 1 : 0)], const [0, 1], height: size); + return VtGradient([c.withValues(alpha: bottomUp ? 0 : 1), c.withValues(alpha: bottomUp ? 1 : 0)], const [0, 1], + height: size); } } diff --git a/lib/ui/common/static_text_scale.dart b/lib/ui/common/static_text_scale.dart index 965f6ce2..61eca577 100644 --- a/lib/ui/common/static_text_scale.dart +++ b/lib/ui/common/static_text_scale.dart @@ -8,7 +8,9 @@ class StaticTextScale extends StatelessWidget { @override Widget build(BuildContext context) { return MediaQuery( - data: MediaQuery.of(context).copyWith(textScaleFactor: scale), + data: MediaQuery.of(context).copyWith( + textScaler: TextScaler.linear(scale), + ), child: child, ); } diff --git a/lib/ui/screens/artifact/artifact_carousel/artifact_carousel_screen.dart b/lib/ui/screens/artifact/artifact_carousel/artifact_carousel_screen.dart index 8313bc4b..cc22ff1f 100644 --- a/lib/ui/screens/artifact/artifact_carousel/artifact_carousel_screen.dart +++ b/lib/ui/screens/artifact/artifact_carousel/artifact_carousel_screen.dart @@ -153,7 +153,7 @@ class _ArtifactScreenState extends State { offset: Offset(0, size / 2), child: Container( decoration: BoxDecoration( - color: $styles.colors.offWhite.withOpacity(0.8), + color: $styles.colors.offWhite.withValues(alpha: 0.8), borderRadius: BorderRadius.vertical(top: Radius.circular(size)), ), ), diff --git a/lib/ui/screens/artifact/artifact_carousel/widgets/_blurred_image_bg.dart b/lib/ui/screens/artifact/artifact_carousel/widgets/_blurred_image_bg.dart index 499b561f..5f90ddf5 100644 --- a/lib/ui/screens/artifact/artifact_carousel/widgets/_blurred_image_bg.dart +++ b/lib/ui/screens/artifact/artifact_carousel/widgets/_blurred_image_bg.dart @@ -19,7 +19,7 @@ class _BlurredImageBg extends StatelessWidget { alignment: Alignment(0, 0.8), child: Container( foregroundDecoration: BoxDecoration( - color: $styles.colors.black.withOpacity(fgOpacity), + color: $styles.colors.black.withValues(alpha: fgOpacity), ), child: settingsLogic.useBlurs ? ImageFiltered( diff --git a/lib/ui/screens/artifact/artifact_details/widgets/_artifact_image_btn.dart b/lib/ui/screens/artifact/artifact_details/widgets/_artifact_image_btn.dart index 7bbaf004..0c4a7346 100644 --- a/lib/ui/screens/artifact/artifact_details/widgets/_artifact_image_btn.dart +++ b/lib/ui/screens/artifact/artifact_details/widgets/_artifact_image_btn.dart @@ -12,7 +12,7 @@ class _ArtifactImageBtn extends StatelessWidget { child: Transform.translate( offset: Offset(0, $styles.insets.xl - 1), child: VtGradient( - [$styles.colors.greyStrong, $styles.colors.greyStrong.withOpacity(0)], + [$styles.colors.greyStrong, $styles.colors.greyStrong.withValues(alpha: 0)], const [0, 1], height: $styles.insets.xl, ), diff --git a/lib/ui/screens/artifact/artifact_search/artifact_search_screen.dart b/lib/ui/screens/artifact/artifact_search/artifact_search_screen.dart index 185f4a8c..ab35b3ef 100644 --- a/lib/ui/screens/artifact/artifact_search/artifact_search_screen.dart +++ b/lib/ui/screens/artifact/artifact_search/artifact_search_screen.dart @@ -187,7 +187,7 @@ class _ArtifactSearchScreenState extends State with GetItS crossAxisAlignment: CrossAxisAlignment.center, children: [ Spacer(), - Icon(icon, size: $styles.insets.xl, color: color.withOpacity(0.5)), + Icon(icon, size: $styles.insets.xl, color: color.withValues(alpha: 0.5)), Gap($styles.insets.xs), Text(text, style: $styles.text.body.copyWith(color: color)), Spacer( diff --git a/lib/ui/screens/artifact/artifact_search/time_range_selector/expanding_time_range_selector.dart b/lib/ui/screens/artifact/artifact_search/time_range_selector/expanding_time_range_selector.dart index 02868a2e..a846c5ed 100644 --- a/lib/ui/screens/artifact/artifact_search/time_range_selector/expanding_time_range_selector.dart +++ b/lib/ui/screens/artifact/artifact_search/time_range_selector/expanding_time_range_selector.dart @@ -60,11 +60,11 @@ class _ExpandingTimeRangeSelectorState extends State padding: EdgeInsets.symmetric(horizontal: pad, vertical: $styles.insets.xs), background: Container( decoration: BoxDecoration( - color: $styles.colors.black.withOpacity(0.85), + color: $styles.colors.black.withValues(alpha: 0.85), borderRadius: BorderRadius.circular($styles.corners.md), boxShadow: [ BoxShadow( - color: $styles.colors.black.withOpacity(0.66), + color: $styles.colors.black.withValues(alpha: 0.66), offset: Offset(0, 4), blurRadius: 4, ) @@ -248,7 +248,7 @@ class _OpenedTimeRange extends StatelessWidget { selectedWonders: [wonder.type], timelineBuilder: (_, __, sel) => Container( decoration: BoxDecoration( - color: $styles.colors.offWhite.withOpacity(sel ? 0.75 : 0.25), + color: $styles.colors.offWhite.withValues(alpha: sel ? 0.75 : 0.25), borderRadius: BorderRadius.circular(999), ), ), diff --git a/lib/ui/screens/artifact/artifact_search/time_range_selector/range_selector.dart b/lib/ui/screens/artifact/artifact_search/time_range_selector/range_selector.dart index f6503044..f8c79526 100644 --- a/lib/ui/screens/artifact/artifact_search/time_range_selector/range_selector.dart +++ b/lib/ui/screens/artifact/artifact_search/time_range_selector/range_selector.dart @@ -88,9 +88,9 @@ class _RangeSelectorState extends State { dragWidth: dragWidth, child: Container( decoration: BoxDecoration( - color: $styles.colors.offWhite.withOpacity(0), + color: $styles.colors.offWhite.withValues(alpha: 0), border: Border.symmetric( - horizontal: BorderSide(color: $styles.colors.white.withOpacity(0.75), width: 2), + horizontal: BorderSide(color: $styles.colors.white.withValues(alpha: 0.75), width: 2), ), ), ), @@ -113,7 +113,7 @@ class _RangeSelectorState extends State { alignment: Alignment.center, width: RangeSelector.handleWidth, decoration: BoxDecoration( - color: $styles.colors.white.withOpacity(0.75), + color: $styles.colors.white.withValues(alpha: 0.75), borderRadius: BorderRadius.only( topRight: Radius.circular($styles.corners.md), bottomRight: Radius.circular($styles.corners.md), diff --git a/lib/ui/screens/artifact/artifact_search/time_range_selector/time_range_painter.dart b/lib/ui/screens/artifact/artifact_search/time_range_selector/time_range_painter.dart index b3227c2f..c2a745fa 100644 --- a/lib/ui/screens/artifact/artifact_search/time_range_selector/time_range_painter.dart +++ b/lib/ui/screens/artifact/artifact_search/time_range_selector/time_range_painter.dart @@ -18,7 +18,7 @@ class TimeRangePainter extends CustomPainter { int l = results.length; if (l == 0) return; - Paint fill = Paint()..color = controller.color.withOpacity(0.25); + Paint fill = Paint()..color = controller.color.withValues(alpha: 0.25); var positions = Float32List(12 * l); double height = size.height, width = size.width; diff --git a/lib/ui/screens/artifact/artifact_search/widgets/_result_tile.dart b/lib/ui/screens/artifact/artifact_search/widgets/_result_tile.dart index 1660dc24..8cb8714e 100644 --- a/lib/ui/screens/artifact/artifact_search/widgets/_result_tile.dart +++ b/lib/ui/screens/artifact/artifact_search/widgets/_result_tile.dart @@ -14,7 +14,7 @@ class _ResultTile extends StatelessWidget { fit: BoxFit.cover, scale: 0.5, distractor: true, - color: $styles.colors.greyMedium.withOpacity(0.2), + color: $styles.colors.greyMedium.withValues(alpha: 0.2), ); return AspectRatio( diff --git a/lib/ui/screens/artifact/artifact_search/widgets/_results_grid.dart b/lib/ui/screens/artifact/artifact_search/widgets/_results_grid.dart index 6160d4ef..74b72eb7 100644 --- a/lib/ui/screens/artifact/artifact_search/widgets/_results_grid.dart +++ b/lib/ui/screens/artifact/artifact_search/widgets/_results_grid.dart @@ -63,7 +63,7 @@ class _ResultsGridState extends State<_ResultsGrid> { onPressed: () => settingsLogic.hasDismissedSearchMessage.value = true, semanticLabel: $strings.resultsSemanticDismiss, child: Container( - color: $styles.colors.offWhite.withOpacity(0.1), + color: $styles.colors.offWhite.withValues(alpha: 0.1), padding: EdgeInsets.all($styles.insets.sm), child: Row( children: [ diff --git a/lib/ui/screens/artifact/artifact_search/widgets/_search_input.dart b/lib/ui/screens/artifact/artifact_search/widgets/_search_input.dart index 238ec7ef..a6d65048 100644 --- a/lib/ui/screens/artifact/artifact_search/widgets/_search_input.dart +++ b/lib/ui/screens/artifact/artifact_search/widgets/_search_input.dart @@ -2,6 +2,7 @@ part of '../artifact_search_screen.dart'; /// Autopopulating textfield used for searching for Artifacts by name. const double _inputWidth = 400; + class _SearchInput extends StatelessWidget { const _SearchInput({super.key, required this.onSubmit, required this.wonder}); final void Function(String) onSubmit; @@ -54,7 +55,7 @@ class _SearchInput extends StatelessWidget { decoration: BoxDecoration( boxShadow: [ BoxShadow( - color: $styles.colors.black.withOpacity(0.25), + color: $styles.colors.black.withValues(alpha: 0.25), blurRadius: 4, offset: Offset(0, 4), ), @@ -63,7 +64,7 @@ class _SearchInput extends StatelessWidget { child: Container( padding: EdgeInsets.all($styles.insets.xs), decoration: BoxDecoration( - color: $styles.colors.offWhite.withOpacity(0.92), + color: $styles.colors.offWhite.withValues(alpha: 0.92), borderRadius: BorderRadius.circular($styles.insets.xs), ), child: ConstrainedBox( @@ -85,7 +86,8 @@ class _SearchInput extends StatelessWidget { return Container( padding: EdgeInsets.all($styles.insets.xs).copyWith(top: 0), margin: EdgeInsets.only(bottom: $styles.insets.xxs), - decoration: BoxDecoration(border: Border(bottom: BorderSide(color: $styles.colors.greyStrong.withOpacity(0.1)))), + decoration: + BoxDecoration(border: Border(bottom: BorderSide(color: $styles.colors.greyStrong.withValues(alpha: 0.1)))), child: CenterLeft( child: DefaultTextStyle( style: $styles.text.title2.copyWith(color: $styles.colors.black), diff --git a/lib/ui/screens/collectible_found/collectible_found_screen.dart b/lib/ui/screens/collectible_found/collectible_found_screen.dart index 7974853c..7f4f7e91 100644 --- a/lib/ui/screens/collectible_found/collectible_found_screen.dart +++ b/lib/ui/screens/collectible_found/collectible_found_screen.dart @@ -60,7 +60,7 @@ class CollectibleFoundScreen extends StatelessWidget { /// Background AppBackdrop( strength: .5, - child: Container(color: $styles.colors.greyStrong.withOpacity(.96)), + child: Container(color: $styles.colors.greyStrong.withValues(alpha: .96)), ).animate().fadeIn(), /// Particles @@ -109,12 +109,12 @@ class CollectibleFoundScreen extends StatelessWidget { final Color dark = $styles.colors.black; // final state is a solid fill, so optimize that case: - if (ratioOut == 1) return Container(color: dark.withOpacity(opacity)); + if (ratioOut == 1) return Container(color: dark.withValues(alpha: opacity)); return Container( decoration: BoxDecoration( gradient: RadialGradient( - colors: [Color.lerp(light, dark, ratioOut)!.withOpacity(opacity), dark.withOpacity(opacity)], + colors: [Color.lerp(light, dark, ratioOut)!.withValues(alpha: opacity), dark.withValues(alpha: opacity)], stops: [0.2, min(1, 0.25 + ratioIn * 0.5 + ratioOut * 0.5)], ), ), @@ -133,11 +133,11 @@ class CollectibleFoundScreen extends StatelessWidget { margin: EdgeInsets.symmetric(horizontal: $styles.insets.xl), decoration: BoxDecoration(color: $styles.colors.offWhite, boxShadow: [ BoxShadow( - color: $styles.colors.accent1.withOpacity(ratio * 0.75), + color: $styles.colors.accent1.withValues(alpha: ratio * 0.75), blurRadius: $styles.insets.xl * 2, ), BoxShadow( - color: $styles.colors.black.withOpacity(ratio * 0.75), + color: $styles.colors.black.withValues(alpha: ratio * 0.75), offset: Offset(0, $styles.insets.xxs), blurRadius: $styles.insets.sm, ), @@ -168,7 +168,7 @@ class CollectibleFoundScreen extends StatelessWidget { maxLines: 2, overflow: TextOverflow.ellipsis, textAlign: TextAlign.center, - style: style.copyWith(color: color.withOpacity(m)), + style: style.copyWith(color: color.withValues(alpha: m)), ), ), ); diff --git a/lib/ui/screens/collectible_found/widgets/_celebration_particles.dart b/lib/ui/screens/collectible_found/widgets/_celebration_particles.dart index 7830b7fc..7725e152 100644 --- a/lib/ui/screens/collectible_found/widgets/_celebration_particles.dart +++ b/lib/ui/screens/collectible_found/widgets/_celebration_particles.dart @@ -41,7 +41,7 @@ class _CelebrationParticles extends StatelessWidget { y: sin(angle) * d * rnd(0.8, 1), vx: cos(angle) * v * rnd(0.5, 1.5), vy: sin(angle) * v * rnd(0.5, 1.5), - color: color.withOpacity(rnd(0.5, 1)), + color: color.withValues(alpha: rnd(0.5, 1)), )); } diff --git a/lib/ui/screens/collection/widgets/_collectible_image.dart b/lib/ui/screens/collection/widgets/_collectible_image.dart index a7012c99..15369236 100644 --- a/lib/ui/screens/collection/widgets/_collectible_image.dart +++ b/lib/ui/screens/collection/widgets/_collectible_image.dart @@ -49,8 +49,9 @@ class _CollectibleImage extends StatelessWidget { decoration: BoxDecoration( color: $styles.colors.black, border: isNew ? Border.all(color: $styles.colors.accent1, width: 3) : null, - boxShadow: - !isNew ? null : [BoxShadow(color: $styles.colors.accent1.withOpacity(0.6), blurRadius: $styles.insets.sm)], + boxShadow: !isNew + ? null + : [BoxShadow(color: $styles.colors.accent1.withValues(alpha: 0.6), blurRadius: $styles.insets.sm)], ), child: AppImage( image: NetworkImage(collectible.imageUrlSmall), diff --git a/lib/ui/screens/collection/widgets/_collection_footer.dart b/lib/ui/screens/collection/widgets/_collection_footer.dart index a784a236..cb9e6066 100644 --- a/lib/ui/screens/collection/widgets/_collection_footer.dart +++ b/lib/ui/screens/collection/widgets/_collection_footer.dart @@ -14,7 +14,7 @@ class _CollectionFooter extends StatelessWidget { // Transform.translate( // offset: Offset(0, -$styles.insets.xl), // child: VtGradient( - // [$styles.colors.greyStrong.withOpacity(0), $styles.colors.greyStrong], + // [$styles.colors.greyStrong.withValues(alpha:0), $styles.colors.greyStrong], // const [0, 1], // height: $styles.insets.xl, // ), @@ -61,7 +61,7 @@ class _CollectionFooter extends StatelessWidget { child: Container( height: $styles.insets.xs, decoration: BoxDecoration( - color: $styles.colors.white.withOpacity(0.25), + color: $styles.colors.white.withValues(alpha: 0.25), borderRadius: BorderRadius.circular(1000), ), child: Container( diff --git a/lib/ui/screens/editorial/widgets/_app_bar.dart b/lib/ui/screens/editorial/widgets/_app_bar.dart index a98f57d6..2980ae08 100644 --- a/lib/ui/screens/editorial/widgets/_app_bar.dart +++ b/lib/ui/screens/editorial/widgets/_app_bar.dart @@ -67,7 +67,9 @@ class _AppBar extends StatelessWidget { ); }, ), - ).maybeAnimate(delay: $styles.times.pageTransition + 500.delayMs).fadeIn(duration: $styles.times.slow), + ) + .maybeAnimate(delay: $styles.times.pageTransition + 500.delayMs) + .fadeIn(duration: $styles.times.slow), ), ), ), @@ -76,7 +78,7 @@ class _AppBar extends StatelessWidget { if (showOverlay) ...[ AnimatedContainer( duration: $styles.times.med, - color: wonderType.bgColor.withOpacity(showOverlay ? .8 : 0), + color: wonderType.bgColor.withValues(alpha: showOverlay ? .8 : 0), ), ], ], diff --git a/lib/ui/screens/editorial/widgets/_collapsing_pull_quote_image.dart b/lib/ui/screens/editorial/widgets/_collapsing_pull_quote_image.dart index 65103ba4..8c526e0b 100644 --- a/lib/ui/screens/editorial/widgets/_collapsing_pull_quote_image.dart +++ b/lib/ui/screens/editorial/widgets/_collapsing_pull_quote_image.dart @@ -129,8 +129,8 @@ class _CollapsingPullQuoteImage extends StatelessWidget { ), GradientContainer( [ - Color(0xFFBEABA1).withOpacity(1), - Color(0xFFA6958C).withOpacity(1), + Color(0xFFBEABA1).withValues(alpha: 1), + Color(0xFFA6958C).withValues(alpha: 1), ], const [0.0, 1.0], blendMode: BlendMode.colorBurn, diff --git a/lib/ui/screens/editorial/widgets/_scrolling_content.dart b/lib/ui/screens/editorial/widgets/_scrolling_content.dart index 4f6438ea..5a96b14f 100644 --- a/lib/ui/screens/editorial/widgets/_scrolling_content.dart +++ b/lib/ui/screens/editorial/widgets/_scrolling_content.dart @@ -24,14 +24,14 @@ class _ScrollingContent extends StatelessWidget { final TextStyle dropStyle = $styles.text.dropCase; final TextStyle bodyStyle = $styles.text.body; final String dropChar = value.substring(0, 1); - final textScale = MediaQuery.of(context).textScaleFactor; - final double dropCapWidth = StringUtils.measure(dropChar, dropStyle).width * textScale; + final scaleFactor = MediaQuery.textScalerOf(context).scale(1.0); + final double dropCapWidth = StringUtils.measure(dropChar, dropStyle).width * scaleFactor; return Focus( - child: Semantics( - label: value, - child: ExcludeSemantics( + child: Semantics( + label: value, + child: ExcludeSemantics( child: skipCaps - ? Text(_fixNewlines(value), style: bodyStyle ) + ? Text(_fixNewlines(value), style: bodyStyle) : DropCapText( _fixNewlines(value).substring(1), dropCap: DropCap( @@ -55,10 +55,8 @@ class _ScrollingContent extends StatelessWidget { color: $styles.colors.accent3, height: 1, ), - ) - ), - ) - ); + )), + )); } Widget buildHiddenCollectible({required int slot}) { @@ -187,7 +185,7 @@ class _YouTubeThumbnail extends StatelessWidget { child: Container( padding: EdgeInsets.all($styles.insets.xs), decoration: BoxDecoration( - color: $styles.colors.black.withOpacity(0.66), + color: $styles.colors.black.withValues(alpha: 0.66), borderRadius: BorderRadius.circular(999), ), child: Icon( diff --git a/lib/ui/screens/home/wonders_home_screen.dart b/lib/ui/screens/home/wonders_home_screen.dart index a489eb65..b99940c7 100644 --- a/lib/ui/screens/home/wonders_home_screen.dart +++ b/lib/ui/screens/home/wonders_home_screen.dart @@ -233,8 +233,8 @@ class _HomeScreenState extends State with SingleTickerProviderStateM begin: Alignment.topCenter, end: Alignment.bottomCenter, colors: [ - fgColor.withOpacity(0), - fgColor.withOpacity(.5 + fgColor.opacity * .25 + (isPointerDown ? .05 : 0) + swipeAmt * .20), + fgColor.withValues(alpha: 0), + fgColor.withValues(alpha: .5 + fgColor.a * .25 + (isPointerDown ? .05 : 0) + swipeAmt * .20), ], stops: const [0, 1], ), @@ -249,7 +249,7 @@ class _HomeScreenState extends State with SingleTickerProviderStateM return Stack(children: [ /// Foreground gradient-1, gets darker when swiping up BottomCenter( - child: buildSwipeableBgGradient(gradientColor.withOpacity(.65)), + child: buildSwipeableBgGradient(gradientColor.withValues(alpha: .65)), ), /// Foreground decorators @@ -344,7 +344,7 @@ class _HomeScreenState extends State with SingleTickerProviderStateM ); }, child: VtGradient( - [$styles.colors.white.withOpacity(0), $styles.colors.white.withOpacity(1)], + [$styles.colors.white.withValues(alpha: 0), $styles.colors.white.withValues(alpha: 1)], const [.3, 1], borderRadius: BorderRadius.circular(99), ), diff --git a/lib/ui/screens/home_menu/about_dialog_content.dart b/lib/ui/screens/home_menu/about_dialog_content.dart index a8961f24..a5d6a052 100644 --- a/lib/ui/screens/home_menu/about_dialog_content.dart +++ b/lib/ui/screens/home_menu/about_dialog_content.dart @@ -47,7 +47,7 @@ class AboutDialogContent extends StatelessWidget { } double fontSize = $styles.text.body.fontSize!; - fontSize *= MediaQuery.textScaleFactorOf(context); + fontSize = MediaQuery.textScalerOf(context).scale(fontSize); return SingleChildScrollView( child: Column(children: [ Gap($styles.insets.sm), diff --git a/lib/ui/screens/home_menu/home_menu.dart b/lib/ui/screens/home_menu/home_menu.dart index 2bb3d55c..369c8783 100644 --- a/lib/ui/screens/home_menu/home_menu.dart +++ b/lib/ui/screens/home_menu/home_menu.dart @@ -25,7 +25,7 @@ class _HomeMenuState extends State { void _handleAboutPressed(BuildContext context) async { PackageInfo packageInfo = await PackageInfo.fromPlatform(); - if (!mounted) return; + if (!context.mounted) return; showAboutDialog( context: context, applicationName: $strings.appName, @@ -54,7 +54,7 @@ class _HomeMenuState extends State { /// Backdrop / Underlay AppBackdrop( strength: .5, - child: Container(color: $styles.colors.greyStrong.withOpacity(.5)), + child: Container(color: $styles.colors.greyStrong.withValues(alpha: 0.5)), ), PopNavigatorUnderlay(), @@ -167,7 +167,7 @@ class _HomeMenuState extends State { ? null : [ BoxShadow( - color: Colors.black.withOpacity(.3), + color: Colors.black.withValues(alpha: .3), blurRadius: 3, spreadRadius: 3, offset: Offset(0, 2), diff --git a/lib/ui/screens/intro/intro_screen.dart b/lib/ui/screens/intro/intro_screen.dart index 43798a57..5aa21961 100644 --- a/lib/ui/screens/intro/intro_screen.dart +++ b/lib/ui/screens/intro/intro_screen.dart @@ -218,7 +218,7 @@ class _IntroScreenState extends State { child: Transform.scale( scaleX: left ? -1 : 1, child: HzGradient([ - $styles.colors.black.withOpacity(0), + $styles.colors.black.withValues(alpha: 0), $styles.colors.black, ], const [ 0, diff --git a/lib/ui/screens/photo_gallery/widgets/_animated_cutout_overlay.dart b/lib/ui/screens/photo_gallery/widgets/_animated_cutout_overlay.dart index 2b0e70ef..46e930ea 100644 --- a/lib/ui/screens/photo_gallery/widgets/_animated_cutout_overlay.dart +++ b/lib/ui/screens/photo_gallery/widgets/_animated_cutout_overlay.dart @@ -31,7 +31,7 @@ class _AnimatedCutoutOverlay extends StatelessWidget { effects: [CustomEffect(builder: _buildAnimatedCutout, curve: Curves.easeOut, duration: duration)], key: animationKey, onComplete: (c) => c.reverse(), - child: IgnorePointer(child: Container(color: Colors.black.withOpacity(opacity))), + child: IgnorePointer(child: Container(color: Colors.black.withValues(alpha: opacity))), ), ], ); diff --git a/lib/ui/screens/timeline/widgets/_event_markers.dart b/lib/ui/screens/timeline/widgets/_event_markers.dart index 5f0c2a0b..0397941e 100644 --- a/lib/ui/screens/timeline/widgets/_event_markers.dart +++ b/lib/ui/screens/timeline/widgets/_event_markers.dart @@ -92,7 +92,7 @@ class _EventMarkersState extends State<_EventMarkers> { } List _buildReferenceMarkers() { - final marker = Container(color: Colors.red.withOpacity(.4), width: 10, height: 10); + final marker = Container(color: Colors.red.withValues(alpha: .4), width: 10, height: 10); return [ Align( alignment: Alignment.topCenter, @@ -148,7 +148,9 @@ class _EventMarker extends StatelessWidget { color: $styles.colors.accent1, boxShadow: [ BoxShadow( - color: $styles.colors.accent1.withOpacity(isSelected ? .5 : 0), spreadRadius: 3, blurRadius: 3), + color: $styles.colors.accent1.withValues(alpha: isSelected ? .5 : 0), + spreadRadius: 3, + blurRadius: 3), ], ), ), diff --git a/lib/ui/screens/wonder_events/widgets/_events_list.dart b/lib/ui/screens/wonder_events/widgets/_events_list.dart index b37a1bf9..fd809096 100644 --- a/lib/ui/screens/wonder_events/widgets/_events_list.dart +++ b/lib/ui/screens/wonder_events/widgets/_events_list.dart @@ -122,7 +122,7 @@ class _EventsListState extends State<_EventsList> { strength: backdropAmt, child: IgnorePointer( child: Container( - color: $styles.colors.black.withOpacity(backdropAmt * .6), + color: $styles.colors.black.withValues(alpha: backdropAmt * .6), ), )), ], diff --git a/lib/ui/screens/wonder_events/widgets/_wonder_image_with_timeline.dart b/lib/ui/screens/wonder_events/widgets/_wonder_image_with_timeline.dart index 08712638..392c5715 100644 --- a/lib/ui/screens/wonder_events/widgets/_wonder_image_with_timeline.dart +++ b/lib/ui/screens/wonder_events/widgets/_wonder_image_with_timeline.dart @@ -8,7 +8,10 @@ class _WonderImageWithTimeline extends StatelessWidget { Color _fixLuminance(Color color, [double luminance = 0.2]) { double d = luminance - color.computeLuminance(); if (d <= 0) return color; - int r = color.red, g = color.green, b = color.blue; + + int r = (color.r * 255).toInt(); + int g = (color.g * 255).toInt(); + int b = (color.b * 255).toInt(); return Color.fromARGB(255, (r + (255 - r) * d).toInt(), (g + (255 - g) * d).toInt(), (b + (255 - b) * d).toInt()); } diff --git a/lib/ui/wonder_illustrations/common/illustration_piece.dart b/lib/ui/wonder_illustrations/common/illustration_piece.dart index d1833ae2..5b38cb99 100644 --- a/lib/ui/wonder_illustrations/common/illustration_piece.dart +++ b/lib/ui/wonder_illustrations/common/illustration_piece.dart @@ -82,64 +82,61 @@ class _IllustrationPieceState extends State { return Align( alignment: widget.alignment, child: LayoutBuilder( - key: ValueKey(aspectRatio), - builder: (_, constraints) { - final anim = wonderBuilder.anim; - final curvedAnim = Curves.easeOut.transform(anim.value); - final config = wonderBuilder.widget.config; - Widget img = Image.asset( - imgPath, - excludeFromSemantics: true, - opacity: anim, - fit: BoxFit.fitHeight - ); - // Add overflow box so image doesn't get clipped as we translate it around - img = OverflowBox(maxWidth: 2500, child: img); - - final double introZoom = (widget.initialScale - 1) * (1 - curvedAnim); - - /// Determine target height - final double height = max(widget.minHeight ?? 0, constraints.maxHeight * widget.heightFactor); - - /// Combine all the translations, initial + offset + dynamicHzOffset + fractionalOffset - Offset finalTranslation = widget.offset; - // Initial - if (widget.initialOffset != Offset.zero) { - finalTranslation += widget.initialOffset * (1 - curvedAnim); - } - // Dynamic - final dynamicOffsetAmt = ((context.widthPx - 400) / 1100).clamp(0, 1); - finalTranslation += Offset(dynamicOffsetAmt * widget.dynamicHzOffset, 0); - // Fractional - final width = height * (aspectRatio ?? 0); - if (widget.fractionalOffset != null) { - finalTranslation += Offset( - widget.fractionalOffset!.dx * width, - height * widget.fractionalOffset!.dy, - ); - } - Widget? content = Transform.translate( - offset: finalTranslation, - child: Transform.scale( - scale: 1 + (widget.zoomAmt * config.zoom) + introZoom, - child: SizedBox( - height: height, - width: height * aspectRatio!, - child: img, + key: ValueKey(aspectRatio), + builder: (_, constraints) { + final anim = wonderBuilder.anim; + final curvedAnim = Curves.easeOut.transform(anim.value); + final config = wonderBuilder.widget.config; + Widget img = Image.asset(imgPath, excludeFromSemantics: true, opacity: anim, fit: BoxFit.fitHeight); + // Add overflow box so image doesn't get clipped as we translate it around + img = OverflowBox(maxWidth: 2500, child: img); + + final double introZoom = (widget.initialScale - 1) * (1 - curvedAnim); + + /// Determine target height + final double height = max(widget.minHeight ?? 0, constraints.maxHeight * widget.heightFactor); + + /// Combine all the translations, initial + offset + dynamicHzOffset + fractionalOffset + Offset finalTranslation = widget.offset; + // Initial + if (widget.initialOffset != Offset.zero) { + finalTranslation += widget.initialOffset * (1 - curvedAnim); + } + // Dynamic + final dynamicOffsetAmt = ((context.widthPx - 400) / 1100).clamp(0, 1); + finalTranslation += Offset(dynamicOffsetAmt * widget.dynamicHzOffset, 0); + // Fractional + final width = height * (aspectRatio ?? 0); + if (widget.fractionalOffset != null) { + finalTranslation += Offset( + widget.fractionalOffset!.dx * width, + height * widget.fractionalOffset!.dy, + ); + } + Widget? content = Transform.translate( + offset: finalTranslation, + child: Transform.scale( + scale: 1 + (widget.zoomAmt * config.zoom) + introZoom, + child: SizedBox( + height: height, + width: height * aspectRatio!, + child: img, + ), ), - ), - ); - - return Stack( - children: [ - if (widget.bottom != null) Positioned.fill(child: widget.bottom!.call(context)), - ...[ - widget.enableHero && !$styles.disableAnimations ? Hero(tag: '$type-${widget.fileName}', child: content!) : content!, + ); + + return Stack( + children: [ + if (widget.bottom != null) Positioned.fill(child: widget.bottom!.call(context)), + ...[ + widget.enableHero && !$styles.disableAnimations + ? Hero(tag: '$type-${widget.fileName}', child: content) + : content, + ], + if (widget.top != null) Positioned.fill(child: widget.top!.call(context)), ], - if (widget.top != null) Positioned.fill(child: widget.top!.call(context)), - ], - ); - }), + ); + }), ); } } diff --git a/lib/ui/wonder_illustrations/petra_illustration.dart b/lib/ui/wonder_illustrations/petra_illustration.dart index b76d2e61..b200ba80 100644 --- a/lib/ui/wonder_illustrations/petra_illustration.dart +++ b/lib/ui/wonder_illustrations/petra_illustration.dart @@ -77,8 +77,8 @@ class PetraIllustration extends StatelessWidget { const double scaleX = 5; return FractionalTranslation( translation: Offset(-1 - scaleX / 2, 0), - child: - Transform.scale(scaleX: 5, child: Container(color: WonderType.petra.fgColor.withOpacity(anim.value))), + child: Transform.scale( + scaleX: 5, child: Container(color: WonderType.petra.fgColor.withValues(alpha: anim.value))), ); }, ), @@ -95,8 +95,8 @@ class PetraIllustration extends StatelessWidget { const double scaleX = 5; return FractionalTranslation( translation: Offset(1 + scaleX / 2, 0), - child: - Transform.scale(scaleX: 5, child: Container(color: WonderType.petra.fgColor.withOpacity(anim.value))), + child: Transform.scale( + scaleX: 5, child: Container(color: WonderType.petra.fgColor.withValues(alpha: anim.value))), ); }, ),