Fehlerkorrekturen, #578

lib/content_views/approach_area_page.dart

@@ -11,6 +11,7 @@ import 'package:stadtbote/tools/constants.dart';
 import 'package:stadtbote/tools/message_service.dart';
 import 'package:stadtbote/tools/messages/publish_payload_message.dart';
 import 'package:stadtbote/tools/messages/ranking_updated.dart';
+import 'package:badges/badges.dart' as badges;
 
 import '../tools/util.dart';
 
@@ -138,29 +139,48 @@ class _ApproachAreaPageState extends State<ApproachAreaPage> {
           var vehicle = rank.vehicles[j];
 
           var imageFilename = vehicle.self == true ? "assets/mein_${mapVehicleTypeToImageName(vehicle.type)}" : "assets/${mapVehicleTypeToImageName(vehicle.type)}";
-          entries.add(Container(
-            padding: const EdgeInsets.all(4),
-            margin: const EdgeInsets.all(2),
-            decoration: BoxDecoration(
-              borderRadius: BorderRadius.circular(10),
-              color: Colors.white,
-              border: Border.all(
-                color: Colors.grey,
-                width: 0.5,
-              ),
-            ),
-            width: 80,
-            height: 60,
-            child: Column(
-              children: [
-                Image.asset(imageFilename, width: 30, height: 30),
-                const SizedBox(width: 10),
-                Text(
-                    mapVehicleTypeToText(vehicle.type)
+          entries.add(
+              badges.Badge(
+                showBadge: vehicle.cnt != null && vehicle.cnt! > 0,
+                position: badges.BadgePosition.topEnd(top: -12, end: 0),
+                badgeContent: Text(
+                  vehicle.cnt.toString(),
+                  style: const TextStyle(
+                    color: Colors.white,
+                    fontSize: 12,
+                  ),
                 ),
-              ],
-            ),
-          ));
+                badgeStyle: badges.BadgeStyle(
+                  badgeColor: Colors.red,
+                  padding: const EdgeInsets.all(8),
+                  borderRadius: BorderRadius.circular(4),
+                  borderSide: const BorderSide(color: Colors.white, width: 0),
+                  elevation: 0,
+                ),
+                child: Container(
+                  padding: const EdgeInsets.all(4),
+                  margin: const EdgeInsets.all(2),
+                  decoration: BoxDecoration(
+                    borderRadius: BorderRadius.circular(10),
+                    color: Colors.white,
+                    border: Border.all(
+                      color: Colors.grey,
+                      width: 0.5,
+                    ),
+                  ),
+                  width: 80,
+                  height: 60,
+                  child: Column(
+                    children: [
+                      Image.asset(imageFilename, width: 30, height: 30),
+                      const SizedBox(width: 10),
+                      Text(
+                          mapVehicleTypeToText(vehicle.type)
+                      ),
+                    ],
+                  ),
+                )),
+              );
         }
 
         columns.add(Align(