<分区>
我有一个大小为 300、300 的 CustomPaoint。在这个下方我还有其他小部件。我还有一个监听器,用于跟踪向下和移动位置并将偏移量添加到列表中。此列表用于状态更改并发送到 CustomPainter 进行绘制。
一切正常。如果我在 CustomPaint 小部件的边界外点击,则它不会绘制。但是,如果我点击 CustomPaint 内部并移出它,那么偏移量将被记录并用于绘画,这会导致在 CustomPaint 下面的其他小部件中进行绘画。
如何避免?下面是我的代码。
class DrawingCanvas extends StatefulWidget {
@override
State<StatefulWidget> createState() => new DrawingCanvasState();
}
class DrawingCanvasState extends State<DrawingCanvas> {
GlobalKey _paintKey = new GlobalKey();
List<Offset> _finalOffsets = <Offset>[];
DrawingCanvasState() {
}
@override
Widget build(BuildContext context) {
return new Listener(
onPointerDown: (PointerDownEvent pdEvent) {
RenderBox referenceBox = _paintKey.currentContext.findRenderObject();
Offset localOffset = referenceBox.globalToLocal(pdEvent.position);
setState((){
this._finalOffsets.clear();
this._finalOffsets.add(localOffset);
});
},
onPointerMove: (PointerMoveEvent pmEvent) {
RenderBox referenceBox = _paintKey.currentContext.findRenderObject();
Offset localOffset = referenceBox.globalToLocal(pmEvent.position);
setState((){
this._finalOffsets.add(localOffset);
});
},
onPointerUp: (PointerUpEvent puEvent){
},
onPointerCancel: (PointerCancelEvent pcEvent){
},
child: new CustomPaint(
key: _paintKey,
size: new Size(300.0, 300.0),
isComplex: true,
willChange: true,
painter: new CanvasPainter(this._finalOffsets),
child: new ConstrainedBox(
constraints: new BoxConstraints.tightForFinite(width: 300.00, height: 300.00),
),
),
behavior: HitTestBehavior.deferToChild,
);
}
}
class CanvasPainter extends CustomPainter {
List<Offset> _offsets;
CanvasPainter(List<Offset> pOffsets){
this._offsets = pOffsets;
}
@override
void paint(Canvas canvas, Size size) {
Paint p = new Paint();
p.color = Colors.black;
p.strokeWidth = 5.0;
p.isAntiAlias = true;
p.style = PaintingStyle.stroke;
p.strokeJoin = StrokeJoin.round;
p.strokeCap = StrokeCap.round;
canvas.drawPoints(PointMode.polygon, this._offsets, p);
}
@override
bool shouldRepaint(CustomPainter oldDelegate) {
// TODO: implement shouldRepaint https://stackoverflow.com/questions/45578209/how-to-touch-paint-a-canvas?rq=1
//print("should repaint check called");
return true;
}
}
注意 - DrawingCanvas 在另一个 Column Widget 中使用。下面还有两个Widgets。
请帮忙。