在Flutter中绘制椭圆形/圆形的画布内绘制图标

Question

我想添加一个图标到一个使用画布绘制的圆形，但我不知道如何正确地做到这一点。

在这种情况下，我希望将'add'图标添加到绘制的圆圈的中心。

注意:在这种情况下，我尽量避免使用Widget Stack()。

圆形画工代码:

class Circle extends CustomPainter {
Circle();
@override
void paint(Canvas canvas, Size size) {
final _paint = Paint()
..color = Colors.green
..strokeWidth = 6
..style = PaintingStyle.stroke;
canvas.drawOval(
Rect.fromLTWH(0, 0, size.width, size.height),
_paint,
);
}
@override
bool shouldRepaint(CustomPainter oldDelegate) => false;
}

提前感谢你能给的任何想法。

Answer 1

你可以添加这样的图像

import 'dart:ui' as ui;
import 'package:flutter/material.dart';
....
class CanvasPainter extends CustomPainter {
List<ui.Image> items = new List<ui.Image>();
void addItems(ui.Image item) {
items.add(item);
}
@override
void paint(Canvas canvas, Size size) {
for (ui.Image item in items) {
canvas.drawImage(item,  Offset(50.0, 50.0),  Paint());
}
}

或者你只是想添加图像作为圆形形式，你可以使用圆形头像。

child: CircleAvatar(
backgroundColor: Colors.white,
child: ClipRect(
child: Image.network(
'url-to-image',
fit: BoxFit.cover,
),
),
)