我希望MyCanvas在自己上画线,但它们似乎是在背景后面绘制的。发生了什么,我该怎么做?
Main.mxml
<?xml version="1.0" encoding="utf-8"?>
<mx:Application xmlns:mx="http://www.adobe.com/2006/mxml" xmlns:my="*">
<my:MyCanvas width="300" height="300" id="myCanvas"></my:MyCanvas>
<mx:Button label="Draw" click="myCanvas.Draw();"></mx:Button>
</mx:Application>
MyCanvas.as
package
{
import mx.containers.Canvas;
public class MyCanvas extends Canvas
{
public function MyCanvas()
{
this.setStyle("backgroundColor", "white");
}
public function Draw():void
{
graphics.lineStyle(1);
graphics.moveTo( -10, -10);
graphics.lineTo(width + 10, height + 10);
}
}
}
感谢。
答案 0 :(得分:2)
Graphics
本身的DisplayObject
对象始终位于DisplayList的底部。在这种情况下,超类可能会在应用白色背景时添加重叠的子项(不确定我不是Flex专家)。
然而,尝试添加一个专门用于绘制的孩子可能会更安全。 通过这种方式,您可以更好地控制其可见性:
package
{
import mx.containers.Canvas;
public class MyCanvas extends Canvas
{
private var shape:Shape;
public function MyCanvas()
{
this.setStyle("backgroundColor", "white");
addChild(shape = new Shape());
}
public function Draw():void
{
shape.graphics.lineStyle(1);
shape.graphics.moveTo( -10, -10);
shape.graphics.lineTo(width + 10, height + 10);
}
}
}