我正在尝试在Flutter中实现Squiggly Seekbar with Animation。
下面是它看起来像Video Preview(https://drive.google.com/file/d/1umRz2npuAINF7710JNm5TgTdmewkVDqe/view)的例子:
我已经尝试了一些代码如下
class MyWaveClipper extends CustomClipper<Path> {
@override
Path getClip(Size size) {
var path = Path();
debugPrint('Widget: ${size.width}, Height: ${size.height}');
path.lineTo(0.0, 100.0);
path.lineTo(0.0, size.height);
path.lineTo(size.width, size.height);
path.lineTo(size.width, 100.0);
for (int i = 0; i < 10; i++) {
if (i % 2 == 0) {
path.quadraticBezierTo(
size.width - (size.width / 16) - (i * size.width / 8),
0.0,
size.width - ((i + 1) * size.width / 8),
size.height - (size.height * 0.8));
} else {
path.quadraticBezierTo(
size.width - (size.width / 16) - (i * size.width / 8),
size.height - (size.height * 0.6),
size.width - ((i + 1) * size.width / 8),
size.height - (size.height * 0.8));
}
}
path.lineTo(0.0, 40.0);
path.close();
return path;
}
@override
bool shouldReclip(CustomClipper<Path> oldClipper) {
return false;
}
}
我采取了this blog的帮助,有人可以帮助使它无限的动画?
1条答案
按热度按时间u91tlkcl1#
我只是published一个软件包,做的正是你正在寻找!
如果你对它的内部工作方式感兴趣的话,github repo是链接在那里的。