Circlify

Circlify is a lightweight and powerful Flutter package for creating customizable circular charts with smooth animations. Perfect for visualizing data in dashboards or adding dynamic radial elements to your app.

📊 Demo

🌟 Features

• Highly customizable circular charts
• Smooth animations
• Supports interactive and dynamic updates
• Customizable CirclifyItem subclasses
• Easy to integrate into any Flutter project

📦 Installation

Add circlify to your pubspec.yaml:

dependencies:
  circlify: ^1.1.0

🚀 Usage

Here’s a quick example to get started:

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

class App extends StatelessWidget {
  const App({super.key});

  @override
  Widget build(BuildContext context) {
    return Scaffold(
      body: Center(
        child: SizedBox(
          width: 200,
          height: 200,
          child: Circlify(
            items: [
              CirclifyItem(color: Colors.red, value: 100),
              CirclifyItem(color: Colors.green, value: 100),
              CirclifyItem(color: Colors.blue, value: 100),
            ],
          ),
        ),
      ),
    );
  }
}

🛠 Custom CirclifyItem

You can also create your own CirclifyItem subclass and use it in the Circlify widget:

class CustomCircleChartItem extends CirclifyItem {
  final String name;

  CustomCircleChartItem({
    required super.color,
    required super.value,
    required super.id,
    required this.name,
  });
}

class CustomChartApp extends StatelessWidget {
  const CustomChartApp({super.key});

  @override
  Widget build(BuildContext context) {
    return Scaffold(
      body: Center(
        child: SizedBox(
          width: 200,
          height: 200,
          child: Circlify(
            items: [
              CustomCircleChartItem(
                color: Colors.purple,
                value: 150,
                id: 'item1',
                name: 'Custom Item 1',
              ),
              CustomCircleChartItem(
                color: Colors.orange,
                value: 100,
                id: 'item2',
                name: 'Custom Item 2',
              ),
            ],
          ),
        ),
      ),
    );
  }
}

⚙️ Circlify Parameters

Parameter	Type	Description	Default
items	List<CirclifyItem>	List of data points for the chart	Required
borderRadius	BorderRadius	Border radius for chart segments	BorderRadius.all(Radius.circular(10))
segmentSpacing	double	Spacing between segments (must be ≥ 0 and < circle free space)	5.0
segmentWidth	double	Width of chart segments (must be > 0 and < borderRadius)	10.0
segmentDefaultColor	Color	Default color for empty chart segments	Colors.grey
animationDuration	Duration	Duration of the animation	Duration(milliseconds: 150)
animationCurve	Curve	Animation curve	Curves.easeIn

📝 CirclifyItem Parameters

Parameter	Type	Description	Default
id	String	Unique ID for the item (auto-generated if not provided)	Auto-generated
color	Color	Color of the item	Required
value	double	Value of the item (must be > 0)	Required

💬 Feedback and Contributions

If you encounter any issues or have suggestions, feel free to open an issue on GitHub. Contributions are welcome!

📝 License

This project is licensed under the BSD 3-Clause License - see the LICENSE file for details.

---

Made with ❤️ by zeffbtw.