首页 > 解决方案 > Flutter customPainter不会重新绘制

问题描述

shouldRepaint 发生变化时不会重新绘制:

import 'package:flutter/material.dart';

class MainCanvas extends CustomPainter{
  static var penPointsToRender = [];

  @override
  void paint(Canvas canvas, Size size) {
    Paint paint = Paint()..color=Colors.black..strokeWidth=4;

    renderPenPoints(paint, canvas, 2);

  }

  static void renderPenPoints(Paint paint, Canvas canvas, double pointsRadius){
    for (int i = 0; i < penPointsToRender.length - 1; i++) {
      if (penPointsToRender[i + 1] != null && penPointsToRender[i] != null) {
        canvas.drawLine(penPointsToRender[i], penPointsToRender[i + 1], paint);
      }
    }
  }

  @override
  bool shouldRepaint(covariant CustomPainter oldDelegate) {
    return true;
  }

}

每次触摸都会更新此列表。

我有这个自定义手势检测器,它使用提供者作为它的状态管理系统:

import 'package:flutter/material.dart';
import 'package:flutter_canvas/Widgets/Models/canvas_gesture_detector_model.dart';

class CanvasGestureDetector extends StatefulWidget {
  CanvasGestureDetector(this.canvasGestureDetectorModel,{Key key,this.child}) : super(key: key);
  CanvasGestureDetectorModel canvasGestureDetectorModel;
  Widget child;

  @override
  _CanvasGestureDetectorState createState() => _CanvasGestureDetectorState();
}

class _CanvasGestureDetectorState extends State<CanvasGestureDetector> {

  @override
  Widget build(BuildContext context) {
    return GestureDetector(
      behavior: HitTestBehavior.translucent,
      onPanDown: widget.canvasGestureDetectorModel.onPanDown,
      onPanUpdate: widget.canvasGestureDetectorModel.onPanUpdate,
      onPanEnd: widget.canvasGestureDetectorModel.onPanEnd,
      child: widget.child,
    );
  }
}

探测器型号为:

import 'package:flutter/material.dart';
import 'package:flutter_canvas/Widgets/Canvas/canvas.dart';
import 'package:flutter_canvas/Widgets/Canvas/canvas_area.dart';

class CanvasGestureDetectorModel with ChangeNotifier{
  Function(DragDownDetails) onPanDown;
  Function(DragUpdateDetails) onPanUpdate;
  Function(DragEndDetails) onPanEnd;

  void changeGestureBehavior(BuildContext context,String toolName){
    switch(toolName){
      case "Brush":
        setBrushGestureDetection(context);
        break;
    }
  }

  void setBrushGestureDetection(BuildContext context){
    onPanDown = (panInfo){
      MainCanvas.penPointsToRender.add(panInfo.localPosition);
    };
    onPanUpdate = (panInfo){
      if(
      panInfo.globalPosition.dx < CanvasArea.canvasPaddingHorizontal / 2 ||
          panInfo.globalPosition.dx > CanvasArea.canvasPaddingHorizontal / 2 + (MediaQuery.of(context).size.width - CanvasArea.canvasPaddingHorizontal) ||
          panInfo.globalPosition.dy < CanvasArea.canvasPaddingVertical / 2 - 20 ||
          panInfo.globalPosition.dy > (MediaQuery.of(context).size.height - CanvasArea.canvasPaddingVertical) + (CanvasArea.canvasPaddingVertical ) / 2 -20
      ){return;}
      if (MainCanvas.penPointsToRender.elementAt(
          MainCanvas.penPointsToRender.length - 1) != panInfo.localPosition) {
        MainCanvas.penPointsToRender.add(panInfo.localPosition);
      }
    };
    onPanEnd = (panInfo){
      MainCanvas.penPointsToRender.add(null);
    };
    notifyListeners();
  }
}

由于某种原因,当我更新 penPointsToRender 的数量时,它不会导致 customPainter 重新绘制,即使它会更新并将点添加到静态列表中。

我不知道是什么原因造成的,任何建议将不胜感激

标签: flutterdartcanvaspaintrepaint

解决方案


推荐阅读