如何在Flutter中将PointMode传递给Canvas.drawPoints(..)?

时间:2017-10-17 03:24:39

标签: dart flutter

我正在调用下面的函数drawPoints,它位于API-doc

之后
      final paint = new Paint()
       ..color = Colors.blue[400]
       ..strokeCap = StrokeCap.round;
     var offsetList = [new Offset(2.0, 5.0), new Offset(50.0, 100.0)];
     canvas.drawPoints(const PointMode(1), offsetList, paint);

当我将const PointMode(1)传入canvas.drawPoints时,会抛出编译错误。将PointMode传递给此函数的正确方法是什么?

3 个答案:

答案 0 :(得分:2)

使用

是正确的

canvas.drawPoints(PointMode.points,offsetList,paint);

但是对于定义,您必须导入'dart:ui'。

答案 1 :(得分:0)

PointMode是一个枚举,你无法实例化它。您可以从here检查所有可用的PointModes。

要在drawPoints方法中指定PointMode,您只需更改

即可
canvas.drawPoints(const PointMode(1), offsetList, paint);

canvas.drawPoints(PointMode.points, offsetList, paint);

答案 2 :(得分:0)

作为Alessio Ricci said,您需要导入dart:ui。这是一个完整的答案,可以查看上下文中的所有内容。

如何在Flutter中绘制点

enter image description here

要在Flutter中绘画,请使用CustomPaint小部件。 CustomPaint小部件将CustomPainter对象作为参数。在该类中,您必须重写paint方法,该方法为您提供了可以在其上绘画的画布。这是在上图中绘制点的代码。

@override
void paint(Canvas canvas, Size size) {
  final pointMode = ui.PointMode.points;
  final points = [
    Offset(50, 100),
    Offset(150, 75),
    Offset(250, 250),
    Offset(130, 200),
    Offset(270, 100),
  ];
  final paint = Paint()
    ..color = Colors.black
    ..strokeWidth = 4
    ..strokeCap = StrokeCap.round;
  canvas.drawPoints(pointMode, points, paint);
}

注意:

  • 使用dart:ui中的低级方法时,通常的做法是在类的前面加上ui.
  • 您应该保持在大小范围之内。
  • 偏移量是一对(dx,dy)双打,从左上角偏移为(0,0)。
  • 如果不设置颜色,则默认为白色。

其他选项

如果使用PointMode.polygon选项,则可以连接点。

enter image description here

使用PointMode.lines选项仅接受成对的行。请注意,最后一点已被丢弃。

enter image description here

上下文

这是 main.dart 代码,以便您可以在上下文中看到它。请注意'dart:ui' as ui导入。

import 'dart:ui' as ui;
import 'package:flutter/material.dart';

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

class MyApp extends StatelessWidget {
  @override
  Widget build(BuildContext context) {
    return MaterialApp(
      home: Scaffold(
        body: HomeWidget(),
      ),
    );
  }
}

class HomeWidget extends StatelessWidget {
  @override
  Widget build(BuildContext context) {
    return Center(
      child: CustomPaint( //                       <-- CustomPaint widget
        size: Size(300, 300),
        painter: MyPainter(),
      ),
    );
  }
}

class MyPainter extends CustomPainter { //         <-- CustomPainter class
  @override
  void paint(Canvas canvas, Size size) {
    //                                             <-- Insert your painting code here.
  }

  @override
  bool shouldRepaint(CustomPainter old) {
    return false;
  }
}

另请参见

有关我对CustomPaint的完整回答,请参见this article