Skip to content

Instantly share code, notes, and snippets.

@stefanJi
Last active February 26, 2022 08:33
Show Gist options
  • Save stefanJi/2f28eb9e73271b77a33aad8095119894 to your computer and use it in GitHub Desktop.
Save stefanJi/2f28eb9e73271b77a33aad8095119894 to your computer and use it in GitHub Desktop.
flutter wave card example
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;
}
}
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment