Flutter 绘制虚线

最新推荐文章于 2024-06-23 08:59:23 发布

73一人

最新推荐文章于 2024-06-23 08:59:23 发布

阅读量408

点赞数 3

文章标签： flutter javascript 开发语言

本文链接：https://blog.csdn.net/u010940131/article/details/138796661

版权

Flutter 没有自带的虚线绘制工具，需要自己绘制，下面提供一个方法来绘制吧，可以作为Paint的扩展，也可以直接用这个方法绘制。上代码。

void dashPaint(
      Canvas canvas, startdx, startdy, enddx,enddy, dashWidth, gapWidth, Paint paint) {
    // 使用循环来模拟虚线效果
// dashWidth 虚线的宽度，gapWidth的宽度， start起点坐标，end终点坐标
    double currentX = startdx;
    double currentY = startdy;
    double d= sqrt((enddx- startdx)*(enddx- startdx)+(enddy- startdy)*(enddy- startdy)); //计算线段长度
    // sin
    double sin = (enddy - startdy) /d;
    double cos = (enddx - startdx) /d;
    while ((sin>0&&currentY < enddy) ||(sin<0&&currentY > enddy)){
      canvas.drawLine(
        Offset(currentX, currentY),
        Offset(currentX+ dashWidth* cos, currentY + dashWidth * sin ),
        paint,
      );
      currentX += (dashWidth + gapWidth)* cos;
      currentY += (dashWidth + gapWidth)* sin;
    }
  }