diff --git a/flutter/lib/ui/home/benchmark_running_screen.dart b/flutter/lib/ui/home/benchmark_running_screen.dart index 05b590ca8..3113e918f 100644 --- a/flutter/lib/ui/home/benchmark_running_screen.dart +++ b/flutter/lib/ui/home/benchmark_running_screen.dart @@ -13,7 +13,7 @@ import 'package:mlperfbench/localizations/app_localizations.dart'; import 'package:mlperfbench/state/task_runner.dart'; import 'package:mlperfbench/ui/app_styles.dart'; import 'package:mlperfbench/ui/formatter.dart'; -import 'package:mlperfbench/ui/home/progress_circles.dart'; +import 'package:mlperfbench/ui/home/progress_circle.dart'; import 'package:mlperfbench/ui/icons.dart'; class BenchmarkRunningScreen extends StatefulWidget { @@ -114,9 +114,9 @@ class _BenchmarkRunningScreenState extends State { ), ), ), - InfiniteProgressCircle( + ProgressCircle( + strokeWidth: 6, size: containerWidth + 20, - strokeWidth: 6.0, ), ], ); @@ -201,9 +201,9 @@ class _BenchmarkRunningScreenState extends State { const trailingWidth = 24.0; Widget? doneIcon; if (progress.currentBenchmark?.taskName == benchmarkInfo.taskName) { - doneIcon = const InfiniteProgressCircle( - size: trailingWidth, + doneIcon = const ProgressCircle( strokeWidth: 2, + size: trailingWidth - 4, ); } else if (progress.completedBenchmarks.contains(benchmarkInfo)) { doneIcon = const Icon( @@ -238,7 +238,7 @@ class _BenchmarkRunningScreenState extends State { trailing: SizedBox( width: trailingWidth, height: trailingWidth, - child: doneIcon, + child: Center(child: doneIcon), ), ); } diff --git a/flutter/lib/ui/home/gradient_circular_progress_indicator.dart b/flutter/lib/ui/home/gradient_circular_progress_indicator.dart deleted file mode 100644 index 9fa879ce4..000000000 --- a/flutter/lib/ui/home/gradient_circular_progress_indicator.dart +++ /dev/null @@ -1,106 +0,0 @@ -// Source: https://github.com/mryadavdilip/gradient_circular_progress_indicator/blob/e3621c0744bd1b88b00ae4e6a6068c8197789ef6/lib/gradient_circular_progress_indicator.dart - -import 'dart:math'; - -import 'package:flutter/material.dart'; - -class GradientCircularProgressIndicator extends StatelessWidget { - /// progress value between or equal to 0 and 1 (0 <= progress <= 1) - final double progress; - final Gradient gradient; - - /// default background Colors.transparent - final Color? backgroundColor; - - /// default stroke is (size of child divided by 10) - final double? stroke; - - /// default size is size of child - final double? size; - final Widget? child; - - const GradientCircularProgressIndicator({ - super.key, - required this.progress, - required this.gradient, - this.backgroundColor, - this.stroke, - this.size, - this.child, - }); - - @override - Widget build(BuildContext context) { - return CustomPaint( - size: size != null ? Size(size!, size!) : MediaQuery.of(context).size, - painter: _GradientCircularProgressPainter( - progress: progress, - gradient: gradient, - backgroundColor: backgroundColor ?? Colors.transparent, - stroke: stroke), - child: SizedBox( - height: size, - width: size, - child: child, - ), - ); - } -} - -class _GradientCircularProgressPainter extends CustomPainter { - final double progress; - final Gradient gradient; - final Color backgroundColor; // New parameter for background color - final double? stroke; - - _GradientCircularProgressPainter({ - required this.progress, - required this.gradient, - required this.backgroundColor, - this.stroke, - }); - - @override - void paint(Canvas canvas, Size size) { - final center = Offset(size.width / 2, size.height / 2); - final radius = size.width / 2; - const startAngle = -pi / 2; - const fullSweepAngle = 2 * pi; - final progressSweepAngle = 2 * pi * progress; - - final backgroundPaint = Paint() - ..color = backgroundColor // Set the background color - ..style = PaintingStyle.stroke - ..strokeWidth = stroke ?? size.width / 10; - - final gradientPaint = Paint() - ..shader = - gradient.createShader(Rect.fromCircle(center: center, radius: radius)) - ..strokeCap = StrokeCap.round - ..style = PaintingStyle.stroke - ..strokeWidth = stroke ?? size.width / 10; - - // Draw the background arc - canvas.drawArc( - Rect.fromCircle(center: center, radius: radius), - startAngle + progressSweepAngle, - fullSweepAngle - progressSweepAngle, - false, - backgroundPaint, - ); - - // Draw the gradient arc - canvas.drawArc( - Rect.fromCircle(center: center, radius: radius), - startAngle, - progressSweepAngle, - false, - gradientPaint, - ); - } - - @override - bool shouldRepaint(covariant CustomPainter oldDelegate) { - return true; - } -} diff --git a/flutter/lib/ui/home/progress_circle.dart b/flutter/lib/ui/home/progress_circle.dart new file mode 100644 index 000000000..1762bada0 --- /dev/null +++ b/flutter/lib/ui/home/progress_circle.dart @@ -0,0 +1,62 @@ +import 'package:flutter/material.dart'; + +class ProgressCircle extends StatelessWidget { + final double strokeWidth; + final double size; + + const ProgressCircle({ + super.key, + required this.size, + required this.strokeWidth, + }); + + @override + Widget build(BuildContext context) { + return _BorderedCircle( + strokeWidth: strokeWidth, + radius: size / 2, + color: Colors.white.withOpacity(0.88), + ); + } +} + +class _BorderedCircle extends StatelessWidget { + final double strokeWidth; + final double radius; + final Color color; + + const _BorderedCircle({ + required this.strokeWidth, + required this.radius, + required this.color, + }); + + @override + Widget build(BuildContext context) { + return CustomPaint( + painter: DrawCircle(strokeWidth, radius, color), + ); + } +} + +class DrawCircle extends CustomPainter { + final double strokeWidth; + final double radius; + final Color color; + + DrawCircle(this.strokeWidth, this.radius, this.color); + + @override + void paint(Canvas canvas, Size size) { + final paint = Paint() + ..color = color + ..strokeWidth = strokeWidth + ..style = PaintingStyle.stroke; + canvas.drawCircle(const Offset(0.0, 0.0), radius, paint); + } + + @override + bool shouldRepaint(CustomPainter oldDelegate) { + return false; + } +} diff --git a/flutter/lib/ui/home/progress_circles.dart b/flutter/lib/ui/home/progress_circles.dart deleted file mode 100644 index b22a86d7b..000000000 --- a/flutter/lib/ui/home/progress_circles.dart +++ /dev/null @@ -1,54 +0,0 @@ -import 'package:flutter/material.dart'; - -import 'package:mlperfbench/ui/home/gradient_circular_progress_indicator.dart'; - -class InfiniteProgressCircle extends StatefulWidget { - final double size; - final double strokeWidth; - - const InfiniteProgressCircle( - {Key? key, required this.size, required this.strokeWidth}) - : super(key: key); - - @override - State createState() => _InfiniteProgressCircleState(); -} - -class _InfiniteProgressCircleState extends State - with SingleTickerProviderStateMixin { - late AnimationController _controller; - - @override - void initState() { - _controller = - AnimationController(vsync: this, duration: const Duration(seconds: 2)); - _controller.addListener(() => setState(() {})); - _controller.repeat(); - super.initState(); - } - - @override - void dispose() { - _controller.dispose(); - super.dispose(); - } - - @override - Widget build(BuildContext context) { - return RotationTransition( - turns: Tween(begin: 0.0, end: 1.0).animate(_controller), - child: GradientCircularProgressIndicator( - progress: 1.0, - // Specify the progress value between 0 and 1 - gradient: const LinearGradient( - colors: [Colors.white, Colors.white, Colors.white10, Colors.white10], - begin: Alignment.topLeft, - end: Alignment.bottomRight, - ), - backgroundColor: Colors.transparent, - stroke: widget.strokeWidth, - size: widget.size, - ), - ); - } -}