4 Vert

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

Column(
  crossAxisAlignment: CrossAxisAlignment.start,
  children: [
    buildLegendItem(
      35,
      'Series one title',
      Colors.deepPurple.shade700,
    ),
    const Gap(12),
    buildLegendItem(
      60,
      'Series two title',
      Colors.deepPurple.shade300,
    ),
    const Gap(12),
    buildLegendItem(
      20,
      'Series three title',
      Colors.purple,
    ),
  ],
),

Widget buildLegendItem(num percent, String title, Color color) {
  return Column(
    crossAxisAlignment: CrossAxisAlignment.start,
    children: [
      Row(
        mainAxisSize: MainAxisSize.min,
        textBaseline: TextBaseline.alphabetic,
        crossAxisAlignment: CrossAxisAlignment.baseline,
        children: [
          Text(
            '$percent%',
            style: const TextStyle(
              fontWeight: FontWeight.bold,
              fontSize: 20,
              color: Colors.black87,
            ),
          ),
          const Gap(12),
          Text(
            title,
            style: const TextStyle(
              fontWeight: FontWeight.w600,
              fontSize: 12,
              color: Colors.grey,
            ),
          ),
        ],
      ),
      Container(
        width: 100,
        height: 4,
        color: color,
      ),
    ],
  );
}