From 0ac55b639bc46d11ff935c7f5059b48ed3f8554b Mon Sep 17 00:00:00 2001
From: Victor Choueiri <victor@ctrlanddev.com>
Date: Fri, 3 Nov 2017 03:57:39 +0200
Subject: [PATCH] Add examples

---
 example/animated_pie_chart_example.dart    |  86 ++++++++++++++++
 example/animated_radial_chart_example.dart | 109 +++++++++++++++++++++
 2 files changed, 195 insertions(+)
 create mode 100644 example/animated_pie_chart_example.dart
 create mode 100644 example/animated_radial_chart_example.dart

diff --git a/example/animated_pie_chart_example.dart b/example/animated_pie_chart_example.dart
new file mode 100644
index 0000000..8d09159
--- /dev/null
+++ b/example/animated_pie_chart_example.dart
@@ -0,0 +1,86 @@
+import 'package:flutter/material.dart';
+import 'package:flutter_circular_chart/flutter_circular_chart.dart';
+
+void main() {
+  runApp(new MaterialApp(
+    home: new AnimatedPieChartExample(),
+  ));
+}
+
+final List<List<CircularStackEntry>> _quarterlyProfitPieData = [
+  <CircularStackEntry>[
+    new CircularStackEntry(
+      <CircularSegmentEntry>[
+        new CircularSegmentEntry(500.0, Colors.red[200], rankKey: 'Q1'),
+        new CircularSegmentEntry(1000.0, Colors.green[200], rankKey: 'Q2'),
+        new CircularSegmentEntry(2000.0, Colors.blue[200], rankKey: 'Q3'),
+        new CircularSegmentEntry(1000.0, Colors.yellow[200], rankKey: 'Q4'),
+      ],
+      rankKey: 'Quarterly Profits',
+    ),
+  ],
+  <CircularStackEntry>[
+    new CircularStackEntry(
+      <CircularSegmentEntry>[
+        new CircularSegmentEntry(1500.0, Colors.red[200], rankKey: 'Q1'),
+        new CircularSegmentEntry(750.0, Colors.green[200], rankKey: 'Q2'),
+        new CircularSegmentEntry(2000.0, Colors.blue[200], rankKey: 'Q3'),
+        new CircularSegmentEntry(1000.0, Colors.yellow[200], rankKey: 'Q4'),
+      ],
+      rankKey: 'Quarterly Profits',
+    ),
+  ],
+  <CircularStackEntry>[
+    new CircularStackEntry(
+      <CircularSegmentEntry>[
+        new CircularSegmentEntry(1800.0, Colors.red[200], rankKey: 'Q1'),
+        new CircularSegmentEntry(2900.0, Colors.green[200], rankKey: 'Q2'),
+        new CircularSegmentEntry(4000.0, Colors.blue[200], rankKey: 'Q3'),
+        new CircularSegmentEntry(7000.0, Colors.yellow[200], rankKey: 'Q4'),
+      ],
+      rankKey: 'Quarterly Profits',
+    ),
+  ],
+];
+
+class AnimatedPieChartExample extends StatefulWidget {
+  @override
+  _AnimatedPieChartExampleState createState() =>
+      new _AnimatedPieChartExampleState();
+}
+
+class _AnimatedPieChartExampleState extends State<AnimatedPieChartExample> {
+  final GlobalKey<AnimatedCircularChartState> _chartKey =
+      new GlobalKey<AnimatedCircularChartState>();
+  final _chartSize = const Size(300.0, 300.0);
+  int sampleIndex = 0;
+
+  void _cycleSamples() {
+    setState(() {
+      sampleIndex++;
+      List<CircularStackEntry> data = _quarterlyProfitPieData[sampleIndex % 3];
+      _chartKey.currentState.updateData(data);
+    });
+  }
+
+  @override
+  Widget build(BuildContext context) {
+    return new Scaffold(
+      appBar: new AppBar(
+        title: const Text('Quarterly Profit'),
+      ),
+      body: new Center(
+        child: new AnimatedCircularChart(
+          key: _chartKey,
+          size: _chartSize,
+          initialChartData: _quarterlyProfitPieData[0],
+          chartType: CircularChartType.Pie,
+        ),
+      ),
+      floatingActionButton: new FloatingActionButton(
+        child: new Icon(Icons.refresh),
+        onPressed: _cycleSamples,
+      ),
+    );
+  }
+}
diff --git a/example/animated_radial_chart_example.dart b/example/animated_radial_chart_example.dart
new file mode 100644
index 0000000..5fe995e
--- /dev/null
+++ b/example/animated_radial_chart_example.dart
@@ -0,0 +1,109 @@
+import 'package:flutter/material.dart';
+import 'package:flutter_circular_chart/flutter_circular_chart.dart';
+
+void main() {
+  runApp(new MaterialApp(
+    home: new AnimatedRadialChartExample(),
+  ));
+}
+
+class AnimatedRadialChartExample extends StatefulWidget {
+  @override
+  _AnimatedRadialChartExampleState createState() =>
+      new _AnimatedRadialChartExampleState();
+}
+
+class _AnimatedRadialChartExampleState
+    extends State<AnimatedRadialChartExample> {
+  final GlobalKey<AnimatedCircularChartState> _chartKey =
+      new GlobalKey<AnimatedCircularChartState>();
+  final _chartSize = const Size(200.0, 200.0);
+
+  double value = 50.0;
+
+  void _increment() {
+    setState(() {
+      value += 10;
+      List<CircularStackEntry> data = _generateChartData(value);
+      _chartKey.currentState.updateData(data);
+    });
+  }
+
+  void _decrement() {
+    setState(() {
+      value -= 10;
+      List<CircularStackEntry> data = _generateChartData(value);
+      _chartKey.currentState.updateData(data);
+    });
+  }
+
+  List<CircularStackEntry> _generateChartData(double value) {
+    Color dialColor = Colors.blue[200];
+    if (value < 0) {
+      dialColor = Colors.red[200];
+    } else if (value < 50) {
+      dialColor = Colors.yellow[200];
+    }
+
+    List<CircularStackEntry> data = <CircularStackEntry>[
+      new CircularStackEntry(
+        <CircularSegmentEntry>[
+          new CircularSegmentEntry(
+            value,
+            dialColor,
+            rankKey: 'percentage',
+          )
+        ],
+        rankKey: 'percentage',
+      ),
+    ];
+
+    if (value > 100) {
+      data.add(new CircularStackEntry(
+        <CircularSegmentEntry>[
+          new CircularSegmentEntry(
+            value - 100,
+            Colors.green[200],
+            rankKey: 'percentage',
+          ),
+        ],
+        rankKey: 'percentage2',
+      ));
+    }
+
+    return data;
+  }
+
+  @override
+  Widget build(BuildContext context) {
+    return new Scaffold(
+      appBar: new AppBar(
+        title: const Text('Percentage Dial'),
+      ),
+      body: new Column(
+        children: <Widget>[
+          new Container(
+            child: new AnimatedCircularChart(
+              key: _chartKey,
+              size: _chartSize,
+              initialChartData: _generateChartData(value),
+              chartType: CircularChartType.Radial,
+              percentageValues: true,
+            ),
+          ),
+          new Text(
+            '%$value',
+            style: Theme.of(context).textTheme.title,
+          ),
+          new Row(
+            mainAxisAlignment: MainAxisAlignment.spaceAround,
+            children: <Widget>[
+              new RaisedButton(onPressed: _increment, child: const Text('+10')),
+              new RaisedButton(onPressed: _decrement, child: const Text('-10')),
+            ],
+          ),
+        ],
+      ),
+    );
+  }
+}