Improve token image display with mask and background (#3231)

* Improve token image display with mask and background

* Enhance token image bg and remove wierd halo effect that was showing, also add token bg to disclaimer and picker

* Add token bg to more locations and give another shot at halo

* fix: halo around token images

* add token background to non-transparent images only

* another shot at bg based on transparency

* refactor: enhance token image widget shape handling and add filter quality option to cake image widget

* fix: another shot

lib/src/widgets/cake_image_widget.dart

@@ -16,6 +16,7 @@ class CakeImageWidget extends StatelessWidget {
     this.borderRadius = 24.0,
     this.alignment,
     this.allowDrawingOutsideViewBox,
+    this.filterQuality,
   });
 
   final String? imageUrl;
@@ -29,6 +30,7 @@ class CakeImageWidget extends StatelessWidget {
   final AlignmentGeometry? alignment;
   final bool? allowDrawingOutsideViewBox;
   final double borderRadius;
+  final FilterQuality? filterQuality;
 
   @override
   Widget build(BuildContext context) {
@@ -69,6 +71,7 @@ class CakeImageWidget extends StatelessWidget {
           width: width,
           fit: fit,
           color: color,
+          filterQuality: filterQuality ?? FilterQuality.medium,
           errorBuilder: (_, __, ___) => _buildErrorWidget(context),
         );
       }
@@ -93,6 +96,7 @@ class CakeImageWidget extends StatelessWidget {
               width: width,
               fit: fit ?? BoxFit.cover,
               color: color,
+              filterQuality: filterQuality ?? FilterQuality.medium,
               loadingBuilder: (_, Widget child, ImageChunkEvent? progress) {
                 if (progress == null) return child;
                 return loadingWidget ?? const Center(child: CircularProgressIndicator());

lib/src/widgets/picker.dart

@@ -3,7 +3,7 @@
 import 'dart:math';
 
 import 'package:cake_wallet/entities/seed_type.dart';
-import 'package:cake_wallet/src/widgets/cake_image_widget.dart';
+import 'package:cake_wallet/new-ui/widgets/coins_page/token_image_widget.dart';
 import 'package:cake_wallet/src/widgets/search_bar_widget.dart';
 import 'package:cake_wallet/themes/core/theme_extension.dart';
 import 'package:cake_wallet/utils/responsive_layout_util.dart';
@@ -498,10 +498,9 @@ class _PickerState<Item> extends State<Picker<Item>> {
   Widget? _getItemIcon(Item item) {
     if (item is Currency) {
       if (item.iconPath != null) {
-        return CakeImageWidget(
+        return TokenImageWidget(
           imageUrl: item.iconPath!,
-          height: 20.0,
-          width: 20.0,
+          size: 20.0,
         );
       } else {
         return Container(