Actionscript 3 为什么这个ActionScript3代码没有划清界限？

在一个新的Flex项目中（使用Flash Builder 4.6），我正在尝试一个可以画一条线的最小程序：

但是当它在网络浏览器（Chrome或Firefox）中运行时，点击按钮

myButton

，就不会画线——有人知道如何使它工作，以及如何使它在不需要点击按钮的情况下画图吗

<?xml version="1.0" encoding="utf-8"?>
<s:Application xmlns:fx="http://ns.adobe.com/mxml/2009" 
               xmlns:s="library://ns.adobe.com/flex/spark" 
               xmlns:mx="library://ns.adobe.com/flex/mx" minWidth="955" minHeight="600">
    <fx:Declarations>
        <!-- Place non-visual elements (e.g., services, value objects) here --> 
    </fx:Declarations>

    <fx:Script>

        <![CDATA[

            public function drawLine():void 
            {
                var canvas:Shape = new Shape();
                canvas.graphics.lineStyle(3, 0xff);
                canvas.graphics.moveTo (0,0);
                canvas.graphics.lineTo(300,300);
                this.addChild(canvas);
            }

        ]]>

    </fx:Script>

    <s:Button label="myButton" click="drawLine()" />

</s:Application>

---

Spark应用程序标记扩展了SkinnableComponent，它在使用AddChild（）方法时会引发运行时错误。确保已安装Flash Player的调试版本，以便可以看到错误。它将帮助您调试很多东西

以下是一些有效的代码：

<?xml version="1.0" encoding="utf-8"?>
<s:WindowedApplication xmlns:fx="http://ns.adobe.com/mxml/2009" 
               xmlns:s="library://ns.adobe.com/flex/spark" 
               xmlns:mx="library://ns.adobe.com/flex/mx" minWidth="955" minHeight="600">
    <fx:Declarations>
        <!-- Place non-visual elements (e.g., services, value objects) here --> 
    </fx:Declarations>

    <fx:Script>

        <![CDATA[

            public function drawLine():void 
            {
                drawingArea.graphics.lineStyle(3, 0x000000);
                drawingArea.graphics.moveTo (0,0);
                drawingArea.graphics.lineTo(300,300);
            }

        ]]>

    </fx:Script>

    <s:Button label="myButton" click="drawLine()" />


    <s:Group width="100%" height="100%" id="drawingArea">

    </s:Group>

</s:WindowedApplication>

我给了应用程序它自己的绘图区域，在MXML中，并绘制到该区域。这是一个空气应用程序；但同样的代码也应该适用于基于web的应用程序

这里是另一个示例，它不会在MXML中创建绘图区域；但是ActionSCript：

<?xml version="1.0" encoding="utf-8"?>
<s:WindowedApplication xmlns:fx="http://ns.adobe.com/mxml/2009" 
               xmlns:s="library://ns.adobe.com/flex/spark" 
               xmlns:mx="library://ns.adobe.com/flex/mx" minWidth="955" minHeight="600">
    <fx:Declarations>
        <!-- Place non-visual elements (e.g., services, value objects) here --> 
    </fx:Declarations>

    <fx:Script>

        <![CDATA[
            import mx.core.UIComponent;

            public function drawLine():void 
            {
                var canvas :UIComponent = new UIComponent;
                canvas.graphics.lineStyle(3, 0xff);
                canvas.graphics.moveTo (0,0);
                canvas.graphics.lineTo(300,300);
                this.addElement(canvas);

            }

        ]]>

    </fx:Script>

    <s:Button label="myButton" click="drawLine()" />


</s:WindowedApplication>

---

注；我在这里使用UIComponent作为绘图元素。我相信UIComponent是层次结构链中“最高”的组件，它实现了IVisualElement，并可以传递到addElement方法。

Spark应用程序标记扩展了SkinnableComponent，当使用AddChild（）方法时，它会引发运行时错误。确保已安装Flash Player的调试版本，以便可以看到错误。它将帮助您调试很多东西

以下是一些有效的代码：

<?xml version="1.0" encoding="utf-8"?>
<s:WindowedApplication xmlns:fx="http://ns.adobe.com/mxml/2009" 
               xmlns:s="library://ns.adobe.com/flex/spark" 
               xmlns:mx="library://ns.adobe.com/flex/mx" minWidth="955" minHeight="600">
    <fx:Declarations>
        <!-- Place non-visual elements (e.g., services, value objects) here --> 
    </fx:Declarations>

    <fx:Script>

        <![CDATA[

            public function drawLine():void 
            {
                drawingArea.graphics.lineStyle(3, 0x000000);
                drawingArea.graphics.moveTo (0,0);
                drawingArea.graphics.lineTo(300,300);
            }

        ]]>

    </fx:Script>

    <s:Button label="myButton" click="drawLine()" />


    <s:Group width="100%" height="100%" id="drawingArea">

    </s:Group>

</s:WindowedApplication>

我给了应用程序它自己的绘图区域，在MXML中，并绘制到该区域。这是一个空气应用程序；但同样的代码也应该适用于基于web的应用程序

这里是另一个示例，它不会在MXML中创建绘图区域；但是ActionSCript：

<?xml version="1.0" encoding="utf-8"?>
<s:WindowedApplication xmlns:fx="http://ns.adobe.com/mxml/2009" 
               xmlns:s="library://ns.adobe.com/flex/spark" 
               xmlns:mx="library://ns.adobe.com/flex/mx" minWidth="955" minHeight="600">
    <fx:Declarations>
        <!-- Place non-visual elements (e.g., services, value objects) here --> 
    </fx:Declarations>

    <fx:Script>

        <![CDATA[
            import mx.core.UIComponent;

            public function drawLine():void 
            {
                var canvas :UIComponent = new UIComponent;
                canvas.graphics.lineStyle(3, 0xff);
                canvas.graphics.moveTo (0,0);
                canvas.graphics.lineTo(300,300);
                this.addElement(canvas);

            }

        ]]>

    </fx:Script>

    <s:Button label="myButton" click="drawLine()" />


</s:WindowedApplication>

---

注；我在这里使用UIComponent作为绘图元素。我相信UIComponent是层次结构链上的“最高”组件，它实现了IVisualElement，并可以传递到addElement方法。

在Flex应用程序中绘制简单线条（或更复杂的线条，如果您愿意）的一种更简单的方法是使用FXG图形。当tha应用程序启动时，这个小片段应该立即画出与示例中相同的线：

<s:Path data="M 0 0 L 300 300 Z">
    <s:stroke>
        <s:SolidColorStroke color="0xff" weight="3" />
    </s:stroke>
</s:Path>

现在，为了避免按钮单击，只需在应用程序的creationComplete事件触发时调用

drawLine（）

：

<s:Application xmlns:fx="http://ns.adobe.com/mxml/2009" 
           xmlns:s="library://ns.adobe.com/flex/spark" 
           xmlns:mx="library://ns.adobe.com/flex/mx" 
           minWidth="955" minHeight="600"
           creationComplete="drawLine()">

---

在Flex应用程序中绘制简单线条（如果您愿意，也可以绘制更复杂的线条）的一种更简单的方法是使用FXG图形。当tha应用程序启动时，这个小片段应该立即画出与示例中相同的线：

<s:Path data="M 0 0 L 300 300 Z">
    <s:stroke>
        <s:SolidColorStroke color="0xff" weight="3" />
    </s:stroke>
</s:Path>

现在，为了避免按钮单击，只需在应用程序的creationComplete事件触发时调用

drawLine（）

：

<s:Application xmlns:fx="http://ns.adobe.com/mxml/2009" 
           xmlns:s="library://ns.adobe.com/flex/spark" 
           xmlns:mx="library://ns.adobe.com/flex/mx" 
           minWidth="955" minHeight="600"
           creationComplete="drawLine()">

您可以尝试使用Spark或代替Shape，是否可以使用Shape？在O'Reilly的EssentialActionScript3.0中，p。630，它使用形状，但只是它没有完整的程序列表。嗯，您的形状没有指定任何高度或宽度。我不相信形状有自动调整大小的代码。所以如果我使用

canvas.width=300和
canvas.height=300在创建
canvas
之后，它是相同的…您可以尝试使用Spark，或者不使用Shape，是否可以使用Shape？在O'Reilly的EssentialActionScript3.0中，p。630，它使用形状，但只是它没有完整的程序列表。嗯，您的形状没有指定任何高度或宽度。我不相信形状有自动调整大小的代码。所以如果我使用
canvas.width=300和
canvas.height=300在
画布
创建之后，它是相同的…两者都可以工作。。。但是使用
Shape
是否可以像O'Reilly在Essential ActionScript 3.0中那样？（还有，它如何在不需要按钮调用
drawLine（）
的情况下绘制线条？）是的，应该可以使用形状。但是，您必须将形状包装在Flex容器中，以便在Flex应用程序中使用。（不是火花容器）。是的，你不需要点击按钮就可以画一条线；您可以在任何地方执行代码。也许作为updateDisplayList（）方法的一部分，它是Flex组件生命周期的一部分？两者都可以工作。。。但是使用
Shape
是否可以像O'Reilly在Essential ActionScript 3.0中那样？（还有，它如何在不需要按钮调用
drawLine（）
的情况下绘制线条？）是的，应该可以使用形状。但是，您必须将形状包装在Flex容器中，以便在Flex应用程序中使用。（不是火花容器）。是的，你不需要点击按钮就可以画一条线；您可以在任何地方执行代码。也许作为updateDisplayList（）方法的一部分，它是Flex组件生命周期的一部分？只需添加
import spark.core.*
？如果你不在Flex应用程序中使用
Shape
，你会在ActionScript项目中使用
Shape
吗？@JeremyL我不理解你的
import
问题。至于另一个：是的，在ActionScript项目中使用
Shape
，在Flex项目中使用FXG。因为如果
import
行不在那里，它将编译为一个错误：
SpriteVisualElement
没有定义或是其他什么……只需添加
import spark.core.
？如果你不在Flex应用程序中使用
Shape
，你会在ActionScript项目中使用
Shape
吗？@JeremyL我不理解你的
import
问题。至于另一个：是的，在ActionScript项目中使用
Shape
，在Flex项目中使用FXG。因为如果
import
行不在那里，它将编译为一个错误：
SpriteVisualE