Как реализовать функцию ластика для приложения рисования флаттера - PullRequest
Новая
       32

Как реализовать функцию ластика для приложения рисования флаттера

3 голосов
/ 06 января 2020

Есть видео о создании приложения для рисования с помощью флаттера ( YouTube ), которое поддерживает рисование линий / точек при нажатии пользователем на экран, но я не могу найти функцию / способ стереть то, что было у пользователя нарисован как Android нативный (как здесь ) специально для линий. Я не могу просто наложить на них какой-нибудь цвет, например белый, потому что у меня есть фоновое изображение под детектором жестов.

Кто-нибудь может дать мне совет по этому поводу?

Мой пример проекта: 

import 'dart:ui';

import 'package:flutter/material.dart';

void main() => runApp(MyApp());

class MyApp extends StatelessWidget {
  // This widget is the root of your application.
  @override
  Widget build(BuildContext context) {
    return MaterialApp(
      title: 'Flutter Demo',
      theme: ThemeData(
        primarySwatch: Colors.blue,
      ),
      home: MyHomePage(title: 'Flutter Demo Home Page'),
    );
  }
}

class MyHomePage extends StatefulWidget {
  MyHomePage({Key key, this.title}) : super(key: key);

  final String title;

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

class _MyHomePageState extends State<MyHomePage> {
  List<Offset> points = <Offset>[];

  @override
  Widget build(BuildContext context) {
    return Scaffold(
      appBar: AppBar(
        title: Text(widget.title),
      ),
      body: Center(
        child: GestureDetector(
            onPanUpdate: (DragUpdateDetails details) {
              if (details.localPosition.dx < 0) {
                return;
              }
              RenderBox oRenderBox = context.findRenderObject();
              Offset oLocationPoints =
                  oRenderBox.localToGlobal(details.localPosition);
              setState(() {
                this.points = new List.from(this.points..add(oLocationPoints));
              });
            },
            onPanEnd: (DragEndDetails details) => this.points.add(null),
            child: CustomPaint(
                painter: SignaturePainter(
                    points: this.points),
                size: Size.infinite)),
      ),
    );
  }
}

class SignaturePainter extends CustomPainter {
  List<Offset> points = <Offset>[];

  SignaturePainter({this.points});
  @override
  void paint(Canvas canvas, Size size) {
    var paint = Paint()
      ..color = Colors.red
      ..strokeCap = StrokeCap.round
      ..strokeWidth = 3.0;
    for (int i = 0; i < points.length - 1; i++) {
      if (points[i] != null && points[i + 1] != null) {
        canvas.drawLine(points[i], points[i + 1], paint);
      }
    }
  }

  @override
  bool shouldRepaint(SignaturePainter oldDelegate) {
    return oldDelegate.points != points;
  }
}

Спасибо.

...