Как нарисовать пользовательскую замкнутую кривую во флаттере? - PullRequest
Новая
       26

Как нарисовать пользовательскую замкнутую кривую во флаттере?

0 голосов
/ 30 сентября 2019

Я пытался использовать cubicTo, conicTo и другие кривые на холсте CustomPainter, но сгенерированные не являются плавными, чтобы сделать его похожим на простую замкнутую кривую.

1 Ответ

1 голос
/ 30 сентября 2019

Вы можете расширить класс CustomPainter для создания фигур, линий и кривых.

Имейте в виду, что начальная точка любого пути равна x = 0, y = 0 (верхний левый угол).

когда вы хотите рисовать замкнутые контуры, вы всегда должны закрывать траекторию после того, как завершите рисование траекторией. см. пример ниже, он нарисует гладкую форму волны.

Вы можете проверить здесь что и как можно нарисовать с помощью пути 

class CustomWave extends CustomPainter{
  @override
  void paint(Canvas canvas, Size size) {

    var path = Path();
    var paint = Paint();

    path.moveTo(0,size.height*0.84);
    path.quadraticBezierTo(size.width*0.25, size.height*0.77, size.width*0.52, size.height*0.84);
    path.quadraticBezierTo(size.width*0.74, size.height*0.92, size.width, size.height*0.84);
    path.lineTo(size.width, size.height);
    path.lineTo(0, size.height);
    path.close();
    paint.color = AppColors.primaryColor.withOpacity(0.70);
    canvas.drawPath(path, paint);
  }

  @override
  bool shouldRepaint(CustomPainter oldDelegate)=>true

}
...