Refactor: Replace deprecated Flutter APIs for compatibility with newer versions

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);
+    }
   }
 }
 

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.toDouble() * (1.0 - opacity) + src.r.toDouble() * opacity).toInt(),
+      (dst.g.toDouble() * (1.0 - opacity) + src.g.toDouble() * opacity).toInt(),
+      (dst.b.toDouble() * (1.0 - opacity) + src.b.toDouble() * opacity).toInt(),
     );
   }
 }

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),
   ];
 }

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(

lib/ui/common/controls/app_image.dart

@@ -74,7 +74,7 @@ class _AppImageState extends State<AppImage> {
           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),
           );
         }),

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);

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,

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)),
       );
 }

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);
   }
 }

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,
     );
   }

lib/ui/screens/artifact/artifact_carousel/artifact_carousel_screen.dart

@@ -153,7 +153,7 @@ class _ArtifactScreenState extends State<ArtifactCarouselScreen> {
         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)),
           ),
         ),

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(

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,
             ),

lib/ui/screens/artifact/artifact_search/artifact_search_screen.dart

@@ -187,7 +187,7 @@ class _ArtifactSearchScreenState extends State<ArtifactSearchScreen> 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(

lib/ui/screens/artifact/artifact_search/time_range_selector/expanding_time_range_selector.dart

@@ -60,11 +60,11 @@ class _ExpandingTimeRangeSelectorState extends State<ExpandingTimeRangeSelector>
               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),
                       ),
                     ),

lib/ui/screens/artifact/artifact_search/time_range_selector/range_selector.dart

@@ -88,9 +88,9 @@ class _RangeSelectorState extends State<RangeSelector> {
               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<RangeSelector> {
           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),

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;

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(

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: [

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),

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)),
         ),
       ),
     );

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)),
               ));
             }
 

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),

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(

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),
                   ),
                 ],
               ],

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,