lib/presentation/views/main_menu/statistics_view/statistic_detail_view.dart

@@ -65,6 +65,8 @@ class _StatisticDetailViewState extends State<StatisticDetailView> {
               barColor: widget.barColor,
               selectedGroups: widget.statistic.selectedGroups,
               selectedGames: widget.statistic.selectedGames,
+              displayCount: displayCount,
+              showAllValues: true,
             ),
             const SizedBox(height: 12),
 

lib/presentation/widgets/tiles/statistics_tile.dart

@@ -26,9 +26,10 @@ class StatisticsTile extends StatelessWidget {
     required this.width,
     required this.values,
     required this.barColor,
-    this.displayCount,
+    required this.displayCount,
     this.selectedGroups,
     this.selectedGames,
+    this.showAllValues = false,
   });
 
   /// The icon displayed next to the title.
@@ -46,11 +47,13 @@ class StatisticsTile extends StatelessWidget {
   /// The color of the bars representing the values.
   final Color barColor;
 
-  final int? displayCount;
-
+  // statistic data
+  final int displayCount;
   final List<Group>? selectedGroups;
   final List<Game>? selectedGames;
 
+  final bool showAllValues;
+
   @override
   Widget build(BuildContext context) {
     final loc = AppLocalizations.of(context);
@@ -76,9 +79,9 @@ class StatisticsTile extends StatelessWidget {
               final maxBarWidth = constraints.maxWidth * 0.8;
 
               // If displayCount wasnt provided, take all values
-              final valuesShown = displayCount == null
+              final valuesShown = showAllValues
                   ? values.length
-                  : min(values.length, displayCount!);
+                  : min(values.length, displayCount);
               final displayValues = values.take(valuesShown).toList();
               final maxVal = displayValues.isNotEmpty
                   ? displayValues.fold<num>(
@@ -103,6 +106,17 @@ class StatisticsTile extends StatelessWidget {
                       maxBarWidth,
                     );
 
+                    final barClr = index >= displayCount
+                        ? barColor.withAlpha(150)
+                        : barColor;
+
+                    var textClr = barColor.computeLuminance() > 0.5
+                        ? const Color(0xFF101010)
+                        : CustomTheme.textColor;
+                    textClr = textClr.withAlpha(
+                      index >= displayCount ? 220 : 255,
+                    );
+
                     return Padding(
                       padding: const EdgeInsets.symmetric(vertical: 2.0),
                       child: Row(
@@ -119,7 +133,7 @@ class StatisticsTile extends StatelessWidget {
                                   width: barWidth,
                                   decoration: BoxDecoration(
                                     borderRadius: BorderRadius.circular(4),
-                                    color: barColor,
+                                    color: barClr,
                                   ),
                                 ),
 
@@ -138,13 +152,7 @@ class StatisticsTile extends StatelessWidget {
                                           style: TextStyle(
                                             fontSize: 16,
                                             fontWeight: FontWeight.bold,
-                                            color:
-                                                barColor ==
-                                                    getColorFromAppColor(
-                                                      AppColor.yellow,
-                                                    )
-                                                ? const Color(0xFF101010)
-                                                : CustomTheme.textColor,
+                                            color: textClr,
                                           ),
                                         ),
                                         TextSpan(

test/db_tests/statistics/statistic_test.dart

@@ -8,9 +8,7 @@ import 'package:tallee/core/enums.dart';
 import 'package:tallee/data/db/database.dart';
 import 'package:tallee/data/models/game.dart';
 import 'package:tallee/data/models/group.dart';
-import 'package:tallee/data/models/match.dart';
 import 'package:tallee/data/models/player.dart';
-import 'package:tallee/data/models/score_entry.dart';
 import 'package:tallee/data/models/statistic.dart';
 
 void main() {
@@ -23,10 +21,10 @@ void main() {
   late Group testGroup1;
   late Group testGroup2;
   late Game testGame;
-  late Match testMatch1;
+  /*late Match testMatch1;
   late Match testMatch2;
   late Match testMatchOnlyPlayers;
-  late Match testMatchOnlyGroup;
+  late Match testMatchOnlyGroup;*/
   final fixedDate = DateTime(2025, 19, 11, 00, 11, 23);
   final fakeClock = Clock(() => fixedDate);
 
@@ -62,7 +60,7 @@ void main() {
         color: AppColor.blue,
         icon: '',
       );
-      testMatch1 = Match(
+      /*testMatch1 = Match(
         name: 'First Test Match',
         game: testGame,
         group: testGroup1,
@@ -85,7 +83,7 @@ void main() {
         game: testGame,
         group: testGroup2,
         players: testGroup2.members,
-      );
+      );*/
     });
     await database.playerDao.addPlayersAsList(
       players: [