import 'package:fl_chart/fl_chart.dart'; import 'package:flutter/material.dart'; import 'package:syncrow_app/features/dashboard/view/widgets/energy_usage_header.dart'; import 'package:syncrow_app/features/shared_widgets/text_widgets/body_small.dart'; import 'package:syncrow_app/utils/resource_manager/color_manager.dart'; class EnergyUsage extends StatelessWidget { const EnergyUsage({ super.key, }); @override Widget build(BuildContext context) { return DecoratedBox( decoration: BoxDecoration( color: Colors.white, borderRadius: BorderRadius.circular(15), ), child: Padding( padding: const EdgeInsets.symmetric(horizontal: 20, vertical: 10), child: Column( mainAxisAlignment: MainAxisAlignment.start, crossAxisAlignment: CrossAxisAlignment.start, children: [ const EnergyUsageHeader(), ConstrainedBox( constraints: const BoxConstraints( maxHeight: 150, minHeight: 150, ), child: LineChart( LineChartData( gridData: FlGridData( show: true, drawHorizontalLine: true, horizontalInterval: 2, drawVerticalLine: false, getDrawingHorizontalLine: (value) { return FlLine( color: Colors.grey.withOpacity(.5), strokeWidth: 1, ); }, ), titlesData: FlTitlesData( show: true, rightTitles: AxisTitles( sideTitles: SideTitles( showTitles: true, interval: 1, getTitlesWidget: leftTitleWidgets, reservedSize: 25, ), ), topTitles: const AxisTitles( sideTitles: SideTitles(showTitles: false), ), bottomTitles: AxisTitles( sideTitles: SideTitles( showTitles: true, reservedSize: 30, interval: 12, getTitlesWidget: (value, meta) { switch (value.toInt()) { case 0: return SideTitleWidget( axisSide: meta.axisSide, child: const BodySmall(text: '1'), ); case 11: return SideTitleWidget( axisSide: meta.axisSide, child: const BodySmall(text: '28'), ); default: return Container(); } }, ), ), leftTitles: const AxisTitles( sideTitles: SideTitles(showTitles: false), ), ), minX: 0, maxX: 11, minY: 0, maxY: 6, lineBarsData: [ LineChartBarData( spots: const [ FlSpot(0, 3), FlSpot(2.6, 2), FlSpot(4.9, 5), FlSpot(6.8, 3.1), FlSpot(8, 4), FlSpot(9.5, 3), FlSpot(11, 4), ], isCurved: true, gradient: LinearGradient( colors: [ ColorsManager.primaryColor, ColorsManager.primaryColor.withOpacity(0.3), ], ), barWidth: 5, isStrokeCapRound: true, dotData: const FlDotData( show: false, ), belowBarData: BarAreaData( show: true, gradient: LinearGradient( colors: [ ColorsManager.primaryColor.withOpacity(0.5), ColorsManager.primaryColor.withOpacity(0.1), ], ), ), ), ], ), ), ) ], ), ), ); } Widget leftTitleWidgets(double value, TitleMeta meta) { String text; switch (value.toInt()) { case 1: text = '1K'; break; case 3: text = '3k'; break; case 5: text = '5k'; break; default: return Container(); } return Center(child: BodySmall(text: text)); } Widget bottomTitleWidgets(double value, TitleMeta meta) { // const style = TextStyle( // fontWeight: FontWeight.bold, // fontSize: 16, // ); // Widget text; // switch (value.toInt()) { // case 2: // text = const Text('MAR', style: style); // break; // case 5: // text = const Text('JUN', style: style); // break; // case 8: // text = const Text('SEP', style: style); // break; // default: // text = const Text('', style: style); // break; // } return SideTitleWidget( axisSide: meta.axisSide, child: const BodySmall(text: 'Feb'), ); } }