Question

我以为我有这个代码所需要的东西在画布上画一条线，但似乎没有。我可以得到关于我做错了什么/没做错的指示吗？

import 'dart:html';
import 'package:pixi/pixi.dart';

class BunnyExample
{
    CanvasRenderer renderer    = new CanvasRenderer(width: 400, height: 300);
    Stage stage       = new Stage(new Colour.fromHtml('#ffffff'));
    Graphics graph = new Graphics();

    BunnyExample()
    {
        document.body.append(this.renderer.view);
        window.requestAnimationFrame(_lineAnim);
    }

    void _lineAnim(var num)
    {
      window.requestAnimationFrame(this._lineAnim);
      graph
      ..position = new Point(0, 0)
      ..pivot = new Point(50, 50)
      ..lineStyle(1,new Colour(255, 0, 0))
      ..beginFill(new Colour(255,0,0))
      ..lineTo(50, 70)
      ..endFill();
      stage.children.add(graph);
      renderer.render(stage);
    }
}

void main()
{
    new BunnyExample();
}

Answer 1

您似乎必须在moveTo()之前致电lineTo()：

void _lineAnim(var num)
{
  window.requestAnimationFrame(this._lineAnim);
  graph
  ..position = new Point(0, 0)
  ..pivot = new Point(50, 50)
  ..lineStyle(1,new Colour(255, 0, 0))
  ..beginFill(new Colour(255,0,0))
  ..moveTo(50, 50)
  ..lineTo(50, 70)
  ..endFill();
  renderer.render(stage);
}

此外，最好在构造函数中设置阶段，否则可能会发生内存泄漏：

BunnyExample()
{
    stage.children.add(graph); //doing this in the animation loop leads to a memory leak
    document.body.append(this.renderer.view);
    window.requestAnimationFrame(_lineAnim);
}

没有使用pixi.dart画线到画布

1 个答案: