init

.gitignore

@@ -0,0 +1,29 @@
+# Miscellaneous
+*.class
+*.log
+*.pyc
+*.swp
+.DS_Store
+.atom/
+.buildlog/
+.history
+.svn/
+migrate_working_dir/
+
+# IntelliJ related
+*.iml
+*.ipr
+*.iws
+.idea/
+
+# The .vscode folder contains launch configuration and tasks you configure in
+# VS Code which you may wish to be included in version control, so this line
+# is commented out by default.
+#.vscode/
+
+# Flutter/Dart/Pub related
+# Libraries should not include pubspec.lock, per https://dart.dev/guides/libraries/private-files#pubspeclock.
+/pubspec.lock
+**/doc/api/
+.dart_tool/
+build/

.metadata

@@ -0,0 +1,10 @@
+# This file tracks properties of this Flutter project.
+# Used by Flutter tool to assess capabilities and perform upgrades etc.
+#
+# This file should be version controlled and should not be manually edited.
+
+version:
+  revision: "54e66469a933b60ddf175f858f82eaeb97e48c8d"
+  channel: "stable"
+
+project_type: package

CHANGELOG.md

@@ -0,0 +1,3 @@
+## 0.0.1
+
+* Initial release

LICENSE

@@ -0,0 +1,21 @@
+MIT License
+
+Copyright (c) 2018 Danny Tuppeny
+
+Permission is hereby granted, free of charge, to any person obtaining a copy
+of this software and associated documentation files (the "Software"), to deal
+in the Software without restriction, including without limitation the rights
+to use, copy, modify, merge, publish, distribute, sublicense, and/or sell
+copies of the Software, and to permit persons to whom the Software is
+furnished to do so, subject to the following conditions:
+
+The above copyright notice and this permission notice shall be included in all
+copies or substantial portions of the Software.
+
+THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
+IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
+FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
+AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
+LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
+OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE
+SOFTWARE.

README.md

@@ -0,0 +1,35 @@
+<!--
+This README describes the package. If you publish this package to pub.dev,
+this README's contents appear on the landing page for your package.
+
+For information about how to write a good package README, see the guide for
+[writing package pages](https://dart.dev/guides/libraries/writing-package-pages).
+
+For general information about developing packages, see the Dart guide for
+[creating packages](https://dart.dev/guides/libraries/create-library-packages)
+and the Flutter guide for
+[developing packages and plugins](https://flutter.dev/developing-packages).
+-->
+
+A package to display multipe values on a vertical chart using progess indicators and animation.
+
+## Features
+
+TODO: List what your package can do. Maybe include images, gifs, or videos.
+
+## Usage
+
+Example
+
+```dart
+ProgressBarChart(
+        height: 30,
+        values: {
+          Colors.blue: 0.15,
+          Colors.green: 0.4,
+          Colors.red: 0.2,
+          Colors.yellow: 0.1,
+        },
+        borderRadius: 40,
+)
+```

analysis_options.yaml

@@ -0,0 +1,4 @@
+include: package:flutter_lints/flutter.yaml
+
+# Additional information about this file can be found at
+# https://dart.dev/guides/language/analysis-options

lib/progress_bar_chart.dart

@@ -0,0 +1,182 @@
+library progress_bar_chart;
+
+import 'package:flutter/material.dart';
+import 'package:flutter_animate/flutter_animate.dart';
+
+/// A widget that displays a progress bar chart.
+///
+/// The [ProgressBarChart] widget is used to display a chart with progress bars.
+class ProgressBarChart extends StatefulWidget {
+  const ProgressBarChart({
+    super.key,
+    required this.height,
+    required this.values,
+    this.borderRadius,
+  });
+
+  /// The height of the progress bar chart.
+  final double height;
+
+  /// A map that maps colors to their corresponding progress values.
+  ///
+  /// The progress values should be between 0 and 1.
+  /// The colors should be unique.
+  ///
+  /// Example:
+  ///
+  /// ```dart
+  /// {
+  ///   Colors.red: 0.2,
+  ///   Colors.green: 0.5,
+  ///   Colors.blue: 0.3,
+  /// }
+  /// ```
+  final Map<Color, double> values;
+
+  /// The border radius of the progress bars (optional).
+  final double? borderRadius;
+
+  @override
+  State<ProgressBarChart> createState() => _ProgressBarChartState();
+}
+
+class _ProgressBarChartState extends State<ProgressBarChart>
+    with TickerProviderStateMixin {
+  Map<Color, AnimationController> controllers = {};
+  Map<Color, Animation<double>> animations = {};
+  Map<Color, double> sortedValues = {};
+
+  /// Initializes the state of the progress bar chart.
+  @override
+  void initState() {
+    super.initState();
+    double total = 0.0;
+
+    // Sort the values in descending order
+    sortedValues = Map.fromEntries(widget.values.entries.toList()
+      ..sort((a, b) => b.value.compareTo(a.value)));
+
+    // Calculate the cumulative total for each value
+    sortedValues = sortedValues.map((key, value) {
+      total += value;
+      return MapEntry(key, total);
+    });
+
+    // Reverse the order of the sorted values
+    sortedValues = Map.fromEntries(sortedValues.entries.toList().reversed);
+
+    const maxDuration = Duration(seconds: 1);
+
+    // Create animation controllers and animations for each value
+    for (var entry in sortedValues.entries) {
+      final duration = Duration(
+          milliseconds: (maxDuration.inMilliseconds * entry.value).round());
+      controllers[entry.key] = AnimationController(
+        duration: duration,
+        vsync: this,
+      );
+      animations[entry.key] = Tween<double>(begin: 0, end: entry.value).animate(
+        CurvedAnimation(
+          parent: controllers[entry.key]!.view,
+          curve: Curves.easeOut,
+        ),
+      );
+      controllers[entry.key]?.forward();
+    }
+  }
+
+  @override
+  void dispose() {
+    for (var controller in controllers.values) {
+      controller.dispose();
+    }
+    super.dispose();
+  }
+
+  String formatText(double value) {
+    double result = value * 100;
+    return result % 1 == 0
+        ? result.toInt().toString()
+        : result.toStringAsFixed(1);
+  }
+
+  @override
+  Widget build(BuildContext context) {
+    return LayoutBuilder(
+      builder: (context, constraints) {
+        final width = constraints.maxWidth;
+        return Center(
+          child: SizedBox(
+            width: width,
+            height: widget.height,
+            child: Stack(
+              children: sortedValues.entries
+                  .map(
+                    (entry) => AnimatedBuilder(
+                      animation: animations[entry.key]!,
+                      builder: (context, child) {
+                        return Stack(
+                          children: [
+                            LinearProgressIndicator(
+                              minHeight: widget.height,
+                              value: animations[entry.key]?.value,
+                              backgroundColor: Colors.transparent,
+                              color: entry.key,
+                              semanticsValue: entry.value.toString(),
+                              borderRadius: widget.borderRadius != null
+                                  ? BorderRadius.circular(widget.borderRadius!)
+                                  : BorderRadius.zero,
+                            ),
+                            Builder(
+                              builder: (context) {
+                                final textWidth =
+                                    width * widget.values[entry.key]!;
+                                if (textWidth < 40) return Container();
+                                return FutureBuilder(
+                                  future: Future.delayed(
+                                      const Duration(microseconds: 500)),
+                                  builder: (context, snapshot) {
+                                    if (snapshot.connectionState ==
+                                        ConnectionState.waiting) {
+                                      return Container();
+                                    } else {
+                                      return Container(
+                                        width: width * entry.value,
+                                        height: widget.height,
+                                        alignment: Alignment.centerRight,
+                                        child: SizedBox(
+                                          width: textWidth,
+                                          child: Text(
+                                            '${formatText(widget.values[entry.key]!)} ${textWidth > 60 ? '%' : ''}',
+                                            textAlign: TextAlign.center,
+                                            style: TextStyle(
+                                              color:
+                                                  entry.key.computeLuminance() >
+                                                          0.5
+                                                      ? Colors.black
+                                                      : Colors.white,
+                                              fontSize: widget.height * 0.5,
+                                              fontWeight: FontWeight.w700,
+                                              decoration: TextDecoration.none,
+                                            ),
+                                          ),
+                                        ),
+                                      ).animate().fadeIn();
+                                    }
+                                  },
+                                );
+                              },
+                            )
+                          ],
+                        );
+                      },
+                    ),
+                  )
+                  .toList(),
+            ),
+          ),
+        );
+      },
+    );
+  }
+}

pubspec.yaml

@@ -0,0 +1,20 @@
+name: progress_bar_chart
+description: 'A new Flutter package project.'
+version: 0.0.1
+homepage:
+
+environment:
+  sdk: '>=3.3.4 <4.0.0'
+  flutter: '>=1.17.0'
+
+dependencies:
+  flutter:
+    sdk: flutter
+  flutter_animate: ^4.5.0
+
+dev_dependencies:
+  flutter_test:
+    sdk: flutter
+  flutter_lints: ^3.0.0
+
+flutter:

test/progess_bar_chart_test.dart

@@ -0,0 +1,31 @@
+import 'package:flutter/material.dart';
+
+import 'package:progress_bar_chart/progress_bar_chart.dart';
+
+void main() {
+  runApp(const MyApp());
+}
+
+class MyApp extends StatelessWidget {
+  const MyApp({super.key});
+
+  @override
+  Widget build(BuildContext context) {
+    const height = 30.0;
+    final Map<Color, double> colors = {
+      Colors.blue: 0.15,
+      Colors.green: 0.4,
+      Colors.red: 0.2,
+      Colors.yellow: 0.1,
+    };
+
+    return MaterialApp(
+      title: 'ProgressBarChart Example',
+      home: ProgressBarChart(
+        height: height,
+        values: colors,
+        borderRadius: 40,
+      ),
+    );
+  }
+}