flutter wave card example

wave_card.dart

import 'package:flutter/widgets.dart';

class WaveCard extends StatelessWidget {
  WaveCard({Key key, padding: EdgeInsets}) : super(key: key);

  @override
  Widget build(BuildContext context) {
    final painter = WavePainter(Color.fromRGBO(96, 204, 184, 0.2));
    return CustomPaint(
      painter: painter,
      size: Size(500, 200),
    );
  }
}

class WavePainter extends CustomPainter {
  EdgeInsets padding = EdgeInsets.all(10.0);

  final Color primaryColor;
  final List<Color> colors = List(4);
  final List<int> radius = const [10, 30, 55, 65];
  final List<double> opacities = const [0.3, 0.5, 0.6, 1];

  WavePainter(this.primaryColor, {this.padding}) {
    for (int i = 0; i < 4; i++) {
      colors[i] = (Color.fromRGBO(primaryColor.red, primaryColor.green,
          primaryColor.blue, primaryColor.opacity + i * 0.1));
    }
  }

  @override
  void paint(Canvas canvas, Size size) {
    final paint = Paint()
      ..color = Color.fromRGBO(
          primaryColor.red, primaryColor.green, primaryColor.blue, 1)
      ..blendMode = BlendMode.hardLight
      ..isAntiAlias = true;

    final rect =
        RRect.fromLTRBR(0, 0, size.width, size.height, Radius.circular(10.0));
    canvas.drawRRect(rect, paint);
    canvas.clipRRect(rect);

    final radius = (size.width > size.height ? size.height : size.width) / 1.5;
    final ox = size.width - 40;
    final oy = size.height / 2;
    final o = Offset(ox, oy);

    for (int i = 0; i < 4; i++) {
      final c = this.colors[i];
      final r = this.radius[i];
      paint.color = Color.fromRGBO(c.red, c.green, c.blue, opacities[i]);
      canvas.drawCircle(o, radius - r, paint);
    }
  }

  @override
  bool shouldRepaint(CustomPainter oldDelegate) {
    return null;
  }
}