画布上的 CustomPainter Path 额外线答案

【问题标题】：CustomPainter Path extra line on canvas画布上的 CustomPainter Path 额外线
【发布时间】：2019-02-15 15:10:51
【问题描述】：

我在需要画线的地方使用 CustomPainter

class ShapesPainter extends CustomPainter {
  @override
  void paint(Canvas canvas, Size size) {
    final Paint firstPaint = Paint();
    firstPaint.color = const Color.fromARGB(255, 236, 0, 140);

    final Path firstPath = Path();
    firstPath.lineTo(size.width, 0);
    firstPath.lineTo(0, size.height * 0.10);
    firstPath.close();
    canvas.drawShadow(firstPath, Colors.black87, 2.0, false);
    canvas.drawPath(firstPath, firstPaint);
 }
}

我需要在屏幕周围留出边距，所以我在容器中使用边距：

........
Container(
          color: Colors.white,
          margin:
              EdgeInsets.only(top: 60.0, bottom: 20.0, left: 15.0, right: 15.0),
          child: Container(
            child: CustomPaint(
              painter: ShapesPainter(),
              child: Container(
.......

我需要在我的自定义路径下绘制一个阴影，我在构建小部件中使用了 anvas.drawShadow 方法，但是左侧也有一个小阴影，请看下图我指出了一个错误，这里是指向小阴影的箭头：

【问题讨论】：

标签： dart flutter flutter-layout

【解决方案1】：

由于我找不到任何解决路径上的 canvas.drawShadow 效果的解决方案，我只是在阴影路径上创建了另一个 Path()，这解决了问题，但它有点像 hack。

final Path firstPathb = Path();
firstPathHide.lineTo(size.width, 0);
firstPathHide.lineTo(-10.0, size.height * 0.10);
firstPathHide.close();
canvas.drawPath(firstPathHide, firstPaint);

【讨论】：