import 'package:ernaehrung/android/components/meal_page_text/secondary_big_text_component.dart'; import 'package:ernaehrung/android/components/meal_page_text/secondary_text_component.dart'; import 'package:ernaehrung/android/components/meal_page_text/title_component.dart'; import 'package:ernaehrung/android/config/statistics.dart'; import 'package:fl_chart/fl_chart.dart'; import 'package:flutter/material.dart'; import '../../config/format_helper.dart'; class ProgressPage extends StatelessWidget { final String title; final Color backgroundColor = const Color(0xff47a44b); const ProgressPage({Key? key, required this.title}) : super(key: key); String get getTitle => title; @override String toString({DiagnosticLevel minLevel = DiagnosticLevel.info}) { return getTitle; } @override Widget build(BuildContext context) { return Scaffold( body: SingleChildScrollView( child: Column( children: [ Container( decoration: const BoxDecoration( color: Colors.white, borderRadius: BorderRadius.all(Radius.circular(8))), child: Padding( padding: const EdgeInsets.symmetric(vertical: 8, horizontal: 16), child: Column( children: [ ValueListenableBuilder( valueListenable: StatisticsService .instance.dailyAverageForCurrentWeek, builder: (context, value, child) { return SizedBox( height: 100, width: 400, child: Column( crossAxisAlignment: CrossAxisAlignment.start, children: [ const TitleComponent("Kalorien"), const SizedBox( height: 10, ), const SecondaryTextComponent( "Durchschnittlich"), SecondaryBigTextComponent( "${value.toString()} kcal/Tag"), ], ), ); }, ), ValueListenableBuilder( valueListenable: StatisticsService.instance.barChartData, builder: (context, value, child) { return SizedBox( height: 300, child: Column( crossAxisAlignment: CrossAxisAlignment.start, children: [ SizedBox( height: 15, // Adjust the height of the legend as needed child: Row( mainAxisAlignment: MainAxisAlignment.center, children: [ Container( margin: const EdgeInsets.symmetric( horizontal: 8.0), // Adjust the spacing between legend items child: Row( children: [ Container( width: 12, height: 12, decoration: const BoxDecoration( color: Colors.red, // Use the color of the first bar rod for the legend item shape: BoxShape.circle, ), ), const SizedBox(width: 4.0), // Adjust the spacing between the color indicator and the legend label const Text( 'Frühstück', // Replace with your desired legend label style: TextStyle( fontSize: 12), // Adjust the font size of the legend labels ), ], ), ), Container( margin: const EdgeInsets.symmetric( horizontal: 8.0), // Adjust the spacing between legend items child: Row( children: [ Container( width: 12, height: 12, decoration: const BoxDecoration( color: Colors.green, // Use the color of the first bar rod for the legend item shape: BoxShape.circle, ), ), const SizedBox(width: 4.0), // Adjust the spacing between the color indicator and the legend label const Text( 'Mittagessen', // Replace with your desired legend label style: TextStyle( fontSize: 12), // Adjust the font size of the legend labels ), ], ), ), Container( margin: const EdgeInsets.symmetric( horizontal: 8.0), // Adjust the spacing between legend items child: Row( children: [ Container( width: 12, height: 12, decoration: const BoxDecoration( color: Colors.yellow, // Use the color of the first bar rod for the legend item shape: BoxShape.circle, ), ), const SizedBox(width: 4.0), // Adjust the spacing between the color indicator and the legend label const Text( 'Abendessen', // Replace with your desired legend label style: TextStyle( fontSize: 12), // Adjust the font size of the legend labels ), ], ), ), ], ), ), Container( margin: const EdgeInsets.fromLTRB(0, 24, 0, 0), height: 250, child: BarChart( BarChartData( barTouchData: barTouchData, titlesData: titlesData, borderData: borderData, barGroups: value, gridData: FlGridData(show: false), alignment: BarChartAlignment.spaceAround, ), ), ), ], ), ); }, ), ], ), )), Container( margin: const EdgeInsets.fromLTRB(0, 16, 0, 0), decoration: const BoxDecoration( color: Colors.white, borderRadius: BorderRadius.all(Radius.circular(8))), child: Padding( padding: const EdgeInsets.symmetric(vertical: 8, horizontal: 16), child: ValueListenableBuilder( valueListenable: StatisticsService.instance.weeklyCaloryRanking, builder: (context, value, child) { return Column( children: [ const TitleComponent( "Lebensmittel mit dem höchsten Kaloriengehalt"), const SizedBox( height: 24, ), for (var item in value.toSet()) Row( mainAxisAlignment: MainAxisAlignment.spaceBetween, children: [ SecondaryTextComponent( getWeeklyRankingString(item.name)), SecondaryTextComponent( item.calories.toString()), ], ), ], ); }, ), )) ], ), ), ); } BarTouchData get barTouchData => BarTouchData( enabled: false, touchTooltipData: BarTouchTooltipData( tooltipBgColor: Colors.transparent, tooltipPadding: EdgeInsets.zero, tooltipMargin: 4, getTooltipItem: ( BarChartGroupData group, int groupIndex, BarChartRodData rod, int rodIndex, ) { return BarTooltipItem( rod.toY.round().toString(), const TextStyle( color: Colors.transparent, fontWeight: FontWeight.bold, ), ); }, ), ); Widget getTitles(double value, TitleMeta meta) { const style = TextStyle( color: Colors.orange, fontWeight: FontWeight.bold, fontSize: 14, ); String text; switch (value.toInt()) { case 0: text = 'M'; break; case 1: text = 'T'; break; case 2: text = 'W'; break; case 3: text = 'T'; break; case 4: text = 'F'; break; case 5: text = 'S'; break; case 6: text = 'S'; break; default: text = ''; break; } return SideTitleWidget( axisSide: meta.axisSide, space: 4, child: Text(text, style: style), ); } FlTitlesData get titlesData => FlTitlesData( show: true, bottomTitles: AxisTitles( sideTitles: SideTitles( showTitles: true, reservedSize: 30, getTitlesWidget: getTitles, ), ), topTitles: AxisTitles( sideTitles: SideTitles(showTitles: false), ), rightTitles: AxisTitles( sideTitles: SideTitles( showTitles: false, ), ), leftTitles: AxisTitles( sideTitles: SideTitles( showTitles: true, getTitlesWidget: (value, _) { // Return a custom widget for each axis value return Container( constraints: const BoxConstraints.tightFor(width: double.infinity), child: Padding( padding: const EdgeInsets.only(right: 3.0), // Adjust the margin value as needed child: FittedBox( fit: BoxFit.scaleDown, alignment: Alignment.centerLeft, child: Text( value.toInt().toString(), style: const TextStyle( color: Colors.orange, fontWeight: FontWeight.bold, ), ), ), ), ); }, ), )); FlBorderData get borderData => FlBorderData( show: true, // Set to true to display the chart border border: const Border( bottom: BorderSide(color: Colors.black, width: 1), left: BorderSide(color: Colors.black, width: 1), // Hide the left border ), ); }