Я пытаюсь реализовать Squiggly Seekbar с анимацией во Flutter.
Вот пример того, как это выглядит [Видео превью]:
Я пробовал часть кода, как показано ниже
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;
}
}
Я воспользовался помощью этого блога. Может ли кто-нибудь помочь сделать его бесконечным для анимации?
да, вам нужен CustomPainter
, а не CustomClipper
- см. параметр repaint
в конструкторе CustomPainter
, если вы хотите, чтобы ваш художник перерисовывал следующий кадр вашей пышной анимации
Я только что опубликовал пакет, который делает именно то, что вы ищете!
репозиторий github связан там, если вы заинтересованы в его внутренней работе
Итак, вы разработали это до или после проверки моих вопросов: D Я очень ценю, что вы это разработали. Я искал именно то, что вы разработали.
после :D была отличная идея для быстрого вызова
Реагировать потрясающе. Ты про братан.
Я думаю, вы хотели использовать CustomPainter вместо
CustomClipper