From ba4723433bca473f1a775393158bb1efbcc67b2d Mon Sep 17 00:00:00 2001 From: TAJAOUART Mounir Date: Thu, 9 Feb 2023 22:19:43 +0100 Subject: [PATCH] customize axis properties and graph color --- lib/src/live_chart.dart | 83 +++++++++++++++++++++++------------------ 1 file changed, 47 insertions(+), 36 deletions(-) diff --git a/lib/src/live_chart.dart b/lib/src/live_chart.dart index d8b7c94..4e746d0 100644 --- a/lib/src/live_chart.dart +++ b/lib/src/live_chart.dart @@ -12,12 +12,18 @@ class RealTimeGraph extends StatefulWidget { this.updateDelay = const Duration(milliseconds: 50), this.speed = 1, this.graphStroke = 0.5, + this.graphColor = Colors.red, + this.axisColor = Colors.green, + this.axisWidth = 1.0, required this.stream, this.pointsSpacing = 3.0, this.displayMode = ChartDisplay.line, }) : super(key: key); final Stream stream; + final Color graphColor; + final double axisWidth; + final Color axisColor; final Duration updateDelay; final int speed; final double graphStroke; @@ -63,59 +69,60 @@ class RealTimeGraphState extends State @override Widget build(BuildContext context) { - return ClipRRect( - child: RepaintBoundary( - child: LayoutBuilder( - builder: (context, constraints) { - if (!constraints.maxWidth.isFinite || - !constraints.maxHeight.isFinite) { - return const SizedBox.shrink(); - } + return LayoutBuilder( + builder: (context, constraints) { + if (!constraints.maxWidth.isFinite || !constraints.maxHeight.isFinite) { + return const SizedBox.shrink(); + } - return SizedBox( - key: Key('${constraints.maxWidth}${constraints.maxHeight}'), - height: constraints.maxHeight, - width: constraints.maxWidth, - child: Row( + return SizedBox( + key: Key('${constraints.maxWidth}${constraints.maxHeight}'), + height: constraints.maxHeight, + width: constraints.maxWidth, + child: Row( + mainAxisSize: MainAxisSize.max, + children: [ + Container( + color: widget.axisColor, + width: widget.axisWidth, + height: constraints.maxHeight, + ), + Column( mainAxisSize: MainAxisSize.max, children: [ - Container( - color: Colors.grey, - width: 1, - height: constraints.maxHeight, - ), - Column( - mainAxisSize: MainAxisSize.max, - children: [ - CustomPaint( + ClipRRect( + child: RepaintBoundary( + child: CustomPaint( size: Size( - constraints.maxWidth - 1, - constraints.maxHeight - 1, + constraints.maxWidth - widget.axisWidth, + constraints.maxHeight - widget.axisWidth, ), painter: widget.displayMode == ChartDisplay.points ? _PointGraphPainter( data: _data, pointsSpacing: widget.pointsSpacing, graphStroke: widget.graphStroke, + color: widget.graphColor, ) : _LineGraphPainter( data: _data, graphStroke: widget.graphStroke, + color: widget.graphColor, ), ), - Container( - color: Colors.grey, - height: 1, - width: constraints.maxWidth - 1, - ) - ], + ), ), + Container( + color: widget.axisColor, + height: widget.axisWidth, + width: constraints.maxWidth - widget.axisWidth, + ) ], ), - ); - }, - ), - ), + ], + ), + ); + }, ); } @@ -138,18 +145,20 @@ class _PointGraphPainter extends CustomPainter { required this.data, required this.pointsSpacing, required this.graphStroke, + required this.color, }); final List> data; final double pointsSpacing; final double graphStroke; + final Color color; @override void paint(Canvas canvas, Size size) { final paint = Paint() ..style = PaintingStyle.fill ..strokeWidth = graphStroke - ..color = Colors.white; + ..color = color; // Find the maximum y value in the data double maxY = 0; @@ -206,17 +215,19 @@ class _LineGraphPainter extends CustomPainter { _LineGraphPainter({ required this.data, required this.graphStroke, + required this.color, }); final List> data; final double graphStroke; + final Color color; @override void paint(Canvas canvas, Size size) { final paint = Paint() ..style = PaintingStyle.stroke ..strokeWidth = graphStroke - ..color = Colors.white; + ..color = color; Path path = Path(); // Find the maximum y value in the data double maxY = 0;