added an optional yAxis display

CHANGELOG.md

@@ -1,3 +1,7 @@
+## [0.0.2] - 14 Sept 2018.
+
+* Added optional yAxis line
+
 ## [0.0.1] - 13 Sept 2018.
 
 * Initial Release

README.md

@@ -1,14 +1,16 @@
 # oscilloscope widget package for Flutter
 
-Oscilloscope is a graphical display  similar to the trace on an oscilloscope that will display values as it scrolls across the screen. The widget uses a List <double> as the source of the data to display and will scale the information to fit the display. Take a look at the example to see how it can be used.
+Oscilloscope is a graphical display  similar to the trace on an oscilloscope that will display values as it scrolls across the screen. The widget uses a *List <double>* as the source of the data to display and will scale the information to fit the display. Take a look at the example to see how it can be used.
 
-Each time a value is added to the dataset another point is plotted on the trace, this trace will extends from left to right across the screen until it reaches the end. At this pint the trace will then scroll to show new values.
+Each time a value is added to the dataset another point is plotted on the trace, this trace will extends from left to right across the screen until it reaches the end. At this point the trace will then scroll to show new values.
 
-The display can be customised using the follwoing values:
+The display can be customised using the following values:
 
  - *backgroundColor*  - the default is Colors.black
  - *traceColor* - the default color is Colors.white
  - *padding* - the default is 10.0
+ - *showYAxis* - show or hide  a line representing the 0 yAxis (default is false)
+ - *yAxisColor* - if the yAxis is set for display it will show in this color (default is Colors.white) 
 
  The other settings are
 

example/lib/main.dart

@@ -25,25 +25,25 @@ class Shell extends StatefulWidget {
 }
 
 class _ShellState extends State<Shell> {
-  List<double> traceX = List();
-  List<double> traceY = List();
+  List<double> traceSine = List();
+  List<double> traceCosine = List();
   double radians = 0.0;
   Timer _timer;
 
-  /// method to generate tTst  Wave Pattern Sets
-  /// this gives us a value between +1  & -1 for sign & cosine
+  /// method to generate a Test  Wave Pattern Sets
+  /// this gives us a value between +1  & -1 for sine & cosine
   _generateTrace(Timer t) {
     // generate our  values
     var sv = sin((radians * pi));
     var cv = cos((radians * pi));
 
     // Add to the growing dataset
     setState(() {
-      traceX.add(sv);
-      traceY.add(cv);
+      traceSine.add(sv);
+      traceCosine.add(cv);
     });
 
-    // adjust to recyle the radian value ( 0 = 2Pi RADS)
+    // adjust to recyle the radian value ( as 0 = 2Pi RADS)
     radians += 0.05;
     if (radians >= 2.0) {
       radians = 0.0;
@@ -65,24 +65,27 @@ class _ShellState extends State<Shell> {
 
   @override
   Widget build(BuildContext context) {
-    // Create A Scope Display
+    // Create A Scope Display for Sine
     Oscilloscope scopeOne = Oscilloscope(
+      showYAxis: true,
+      yAxisColor: Colors.orange,
       padding: 20.0,
       backgroundColor: Colors.black,
       traceColor: Colors.green,
       yAxisMax: 1.0,
       yAxisMin: -1.0,
-      dataSet: traceX,
+      dataSet: traceSine,
     );
 
-    // Create A Scope Display
+    // Create A Scope Display for Cosine
     Oscilloscope scopeTwo = Oscilloscope(
+      showYAxis: true,
       padding: 20.0,
       backgroundColor: Colors.black,
       traceColor: Colors.yellow,
       yAxisMax: 1.0,
       yAxisMin: -1.0,
-      dataSet: traceY,
+      dataSet: traceCosine,
     );
 
     // Generate the Scaffold

example/pubspec.lock

@@ -199,7 +199,7 @@ packages:
       path: ".."
       relative: true
     source: path
-    version: "0.0.1"
+    version: "0.0.2"
   package_config:
     dependency: transitive
     description:

lib/oscilloscope.dart

@@ -10,6 +10,9 @@ import 'package:flutter/material.dart';
 ///
 /// All other arguments are optional as they have preset values
 ///
+/// [showYAxis] this will display a line along the yAxisat 0 if the value is set to true (default is false)
+/// [yAxisColor] determines the color of the displayed yAxis (default value is Colors.white)
+///
 /// [yAxisMin] and [yAxisMax] although optional should be set to reflect the data that is supplied in [dataSet]. These values
 /// should be set to the min and max values in the supplied [dataSet].
 ///
@@ -28,13 +31,17 @@ class Oscilloscope extends StatefulWidget {
   final double padding;
   final Color backgroundColor;
   final Color traceColor;
+  final Color yAxisColor;
+  final bool showYAxis;
 
   Oscilloscope(
       {this.traceColor = Colors.white,
       this.backgroundColor = Colors.black,
+      this.yAxisColor = Colors.white,
       this.padding = 10.0,
       this.yAxisMax = 1.0,
       this.yAxisMin = 0.0,
+      this.showYAxis = false,
       @required this.dataSet});
 
   @override
@@ -61,6 +68,8 @@ class _OscilloscopeState extends State<Oscilloscope> {
       child: ClipRect(
         child: CustomPaint(
           painter: _TracePainter(
+              showYAxis: widget.showYAxis,
+              yAxisColor: widget.yAxisColor,
               dataSet: widget.dataSet,
               traceColor: widget.traceColor,
               yRange: yRange),
@@ -75,22 +84,30 @@ class _TracePainter extends CustomPainter {
   final List dataSet;
   final double xScale;
   final Color traceColor;
+  final Color yAxisColor;
+  final bool showYAxis;
   final double yRange;
 
   _TracePainter(
-      {this.yRange,
+      {this.showYAxis,
+      this.yAxisColor,
+      this.yRange,
       this.dataSet,
       this.xScale = 1.0,
       this.traceColor = Colors.white});
 
   @override
   void paint(Canvas canvas, Size size) {
-    final paint = Paint()
+    final tracePaint = Paint()
       ..strokeJoin = StrokeJoin.round
       ..strokeWidth = 2.0
       ..color = traceColor
       ..style = PaintingStyle.stroke;
 
+    final axisPaint = Paint()
+      ..strokeWidth = 1.0
+      ..color = yAxisColor;
+
     double yScale = (size.height / yRange);
 
     // only start plot if dataset has data
@@ -115,7 +132,17 @@ class _TracePainter extends CustomPainter {
       }
 
       // display the trace
-      canvas.drawPath(trace, paint);
+      canvas.drawPath(trace, tracePaint);
+
+      // if yAxis required draw it here
+      if (showYAxis) {
+        print("show y axis");
+        Offset yStart =
+            Offset(0.0, size.height - (0.0 + (yRange / 2)) * yScale);
+        Offset yEnd =
+            Offset(size.width, size.height - (0.0 + (yRange / 2)) * yScale);
+        canvas.drawLine(yStart, yEnd, axisPaint);
+      }
     }
   }
 

pubspec.yaml

@@ -1,6 +1,6 @@
 name: oscilloscope
 description: A graphical widget that can be used to display a dataset similar to an oscilloscope display
-version: 0.0.1
+version: 0.0.2
 author: Steve Rogers <[email protected]>
 homepage: https://github.com/magnatronus/oscilloscope