Skip to main content

mellowares_pie_chart 0.1.0 copy "mellowares_pie_chart: ^0.1.0" to clipboard
mellowares_pie_chart: ^0.1.0 copied to clipboard

A donut-style pie chart with rounded, gapped segments and a fully custom corner radius — segments can be rounded by any amount, not just half the ring's thickness.

mellowares_pie_chart #

A donut-style pie chart for Flutter with rounded, gapped segments — and a fully custom corner radius, not just "half the ring's thickness" like StrokeCap.round gives you.

Screenshot

Features #

  • Any number of segments, each an independent value + color
  • A tunable corner radius, automatically clamped per-segment so thin slices never self-cross
  • A configurable gap between segments
  • A reveal animation on first build
  • Tap handling, with an optional builder for the ring's hollow center

Usage #

MellowaresPieChart(
  cornerRadius: 8,
  segments: const [
    PieChartSegment(value: 40, color: Colors.deepPurple, data: 'A'),
    PieChartSegment(value: 25, color: Colors.blue, data: 'B'),
    PieChartSegment(value: 20, color: Colors.teal, data: 'C'),
    PieChartSegment(value: 10, color: Colors.orange, data: 'D'),
    PieChartSegment(value: 5, color: Colors.pink, data: 'E'),
  ],
  centerBuilder: (context, touched, index) {
    if (touched == null) return const Text('Tap a segment');
    return Text('${touched.data}: ${touched.value.toStringAsFixed(0)}');
  },
)

value doesn't need to sum to 100 (or to anything in particular) — segments are always normalized against each other, so raw counts, percentages, or fractions all work.

See example/ for a runnable app.

Why not StrokeCap.round? #

Flutter's built-in round stroke cap always rounds by exactly half the stroke width — you can't dial it down. MellowaresPieChart builds each segment as its own Path, with a fillet radius you control directly via cornerRadius, independent of thickness.

1
likes
160
points
173
downloads

Documentation

API reference

Publisher

verified publishermellowares.ir

Weekly Downloads

A donut-style pie chart with rounded, gapped segments and a fully custom corner radius — segments can be rounded by any amount, not just half the ring's thickness.

Repository (GitHub)
View/report issues

License

MIT (license)

Dependencies

flutter

More

Packages that depend on mellowares_pie_chart