0
class DigitalWavePainter extends CustomPainter {
  final double animationValue;
  final double widthOfCanvas;
  final double heightOfCanvas;

  DigitalWavePainter(
    this.animationValue, 
    this.widthOfCanvas, 
    this.heightOfCanvas,
  );

  @override
  void paint(Canvas canvas, Size size) {
    final width = widthOfCanvas;
    final height = heightOfCanvas;

    final path = Path();

    final numSegments = 200; // Increase the number of line segments
    final segmentWidth = width / numSegments;

    final amplitude = height + 10;
    final upperBoundary = height * 0.01;
    final lowerBoundary = height; // Adjust the lower boundary value

    final waveProgress = animationValue * 4;
    double dotY = -50;
    double dotX = -50;
    path.moveTo(
      -50,
      (math.sin(0) * amplitude) + height / 2,
    ); // Start at the initial point of the wave

    for (int i = 1; i <= numSegments; i++) {
      final x = i * segmentWidth / 2;
      final animationTime = (x / width * math.pi) + waveProgress * math.pi;
      final y = (math.sin(animationTime) * amplitude) + height / 12;
      dotY = y;
      if (y < upperBoundary) {
        final newY = upperBoundary;
        dotY = newY;
        dotX = x;
        path.lineTo(x, newY);

      } else if (y > lowerBoundary) {
        final newY = lowerBoundary;
        dotY = newY;
        dotX = x;
        path.lineTo(x, newY);
        print("lower boundary");
      } else {
        dotX = x;
        dotY = y;
        path.lineTo(x, y);
      }
    }

    const dotRadius = 15.0; // Set the radius of the dot

    final paint = Paint()
      ..color = Colors.blue
      ..strokeWidth = 16.0
      ..style = PaintingStyle.stroke;
    final circlePaint = Paint()
      ..color = Colors.blue
      ..style = PaintingStyle.fill;

    final boundaryPaint = Paint()
      ..color = Colors.white
      ..style = PaintingStyle.stroke
      ..strokeWidth = 5.0;

    canvas.drawCircle(
      Offset(dotX, dotY),
      dotRadius,
      circlePaint,
    ); // Draw the dot as a filled circle at the current position// Draw the boundary of the dot as a circle

    canvas.drawPath(path, paint);
    canvas.drawCircle(Offset(dotX, dotY), dotRadius, boundaryPaint);
  }

  @override
  bool shouldRepaint(DigitalWavePainter oldDelegate) {
    return oldDelegate.animationValue != animationValue;
  }
}

I have created a moving line from left to right which contain circle in center. The circle only moves up and down as curves in the lines comes so it looks it is like a circle moving and leaving the trail. But in the line is only on left side of the circle, which circle leaves, I want to add coming lines from forward.

its-me-mahmud
  • 690
  • 1
  • 7
  • 14
Waleed Ahmed
  • 1
  • 1
  • 5

0 Answers0