import 'package:flutter/material.dart';
import 'package:fl_chart/fl_chart.dart';

void main() => runApp(const FlChartBarGradientColorAssertIssue());

class FlChartBarGradientColorAssertIssue extends StatelessWidget {
const FlChartBarGradientColorAssertIssue({Key? key}) : super(key: key);

@override
Widget build(BuildContext context) => const MaterialApp(home: HomePage());
}

class HomePage extends StatefulWidget {
const HomePage({Key? key}) : super(key: key);

@override
State<StatefulWidget> createState() => HomePageState();
}

class HomePageState extends State<HomePage> {
bool doGradientFill = false;

@override
Widget build(BuildContext context) {
  return Scaffold(
    appBar: AppBar(),
    body: Column(
      crossAxisAlignment: CrossAxisAlignment.center,
      children: [
        Row(
          mainAxisSize: MainAxisSize.min,
          children: [
            const Text('Press me twice to assert'),
            Switch(
              value: doGradientFill,
              onChanged: (_) =>
                  setState(() => doGradientFill = !doGradientFill),
            ),
          ],
        ),
        AspectRatio(
          aspectRatio: 1.7,
          child: Card(
            elevation: 0,
            shape: RoundedRectangleBorder(
                borderRadius: BorderRadius.circular(4)),
            color: const Color(0xff2c4260),
            child: BuildBarChart(doGradientFill: doGradientFill),
          ),
        ),
      ],
    ),
  );
}
}

class BuildBarChart extends StatelessWidget {
const BuildBarChart({super.key, this.doGradientFill = false});

final bool doGradientFill;

@override
Widget build(BuildContext context) {
  return BarChart(
    BarChartData(
      barTouchData: barTouchData,
      titlesData: titlesData,
      borderData: borderData,
      barGroups: barGroups,
      gridData: FlGridData(show: false),
      alignment: BarChartAlignment.spaceAround,
      maxY: 20,
    ),
  );
}

BarTouchData get barTouchData => BarTouchData(
      enabled: false,
      touchTooltipData: BarTouchTooltipData(
        tooltipBgColor: Colors.transparent,
        tooltipPadding: const EdgeInsets.all(0),
        tooltipMargin: 8,
        getTooltipItem: (group, groupIndex, rod, rodIndex) {
          return BarTooltipItem(
            rod.toY.round().toString(),
            const TextStyle(color: Colors.white, fontWeight: FontWeight.bold),
          );
        },
      ),
    );

Widget getTitles(double value, TitleMeta meta) {
  const style = TextStyle(
      color: Color(0xff7589a2), fontWeight: FontWeight.bold, fontSize: 14);
  String text;
  switch (value.toInt()) {
    case 0:
      text = 'Mn';
      break;
    case 1:
      text = 'Te';
      break;
    case 2:
      text = 'Wd';
      break;
    default:
      text = '';
      break;
  }
  return SideTitleWidget(
      axisSide: meta.axisSide, space: 4.0, child: Text(text, style: style));
}

FlTitlesData get titlesData => FlTitlesData(
      show: true,
      bottomTitles: AxisTitles(
        sideTitles: SideTitles(
            showTitles: true, reservedSize: 30, getTitlesWidget: getTitles),
      ),
      leftTitles: AxisTitles(sideTitles: SideTitles(showTitles: false)),
      topTitles: AxisTitles(sideTitles: SideTitles(showTitles: false)),
      rightTitles: AxisTitles(sideTitles: SideTitles(showTitles: false)),
    );

FlBorderData get borderData => FlBorderData(show: false);

final _barsGradient = const LinearGradient(
  colors: [Colors.lightBlueAccent, Colors.greenAccent],
  begin: Alignment.bottomCenter,
  end: Alignment.topCenter,
);

List<BarChartGroupData> get barGroups => [
      BarChartGroupData(
        x: 0,
        barRods: [
          BarChartRodData(
            toY: 8,
            /// We are either providing color or gradient but it's asserting
            /// probably due to lerp between the colors and gradients
            color: !doGradientFill ? Colors.greenAccent : null,
            gradient: doGradientFill ? _barsGradient : null,
          )
        ],
        showingTooltipIndicators: [0],
      ),
      BarChartGroupData(
        x: 1,
        barRods: [
          BarChartRodData(
            toY: 10,
            color: !doGradientFill ? Colors.greenAccent : null,
            gradient: doGradientFill ? _barsGradient : null,
          )
        ],
        showingTooltipIndicators: [0],
      ),
      BarChartGroupData(
        x: 2,
        barRods: [
          BarChartRodData(
            toY: 14,
            color: !doGradientFill ? Colors.greenAccent : null,
            gradient: doGradientFill ? _barsGradient : null,
          )
        ],
        showingTooltipIndicators: [0],
      ),
    ];
}