Flex：爲什麼SpriteVisualElement不遵循佈局？

Question

在下面的代碼中，我在垂直佈局中的滑塊之前添加了一個SpriteVisualElement。每當我編譯並運行時，滑塊總是將自己定位在精靈元素的前面，而不是在它下面。這是一個閃存錯誤還是我做錯了什麼？任何解決這個問題的方法？

<s:layout> 
    <s:VerticalLayout/> 
</s:layout> 
<s:SpriteVisualElement id="container" includeInLayout="true"/> 
<s:HSlider/> 

<fx:Script> 
    <![CDATA[ 
     import mx.events.FlexEvent; 
     protected function creationComplete_handler(event:FlexEvent):void 
     { 
      var canvas:Shape = new Shape(); 
      canvas.graphics.lineStyle(1,0); 
      canvas.graphics.beginFill(0); 
      canvas.graphics.drawRect(0,0,480,360); 
      canvas.graphics.endFill(); 
      container.addChild(canvas); 
     } 
    ]]> 
</fx:Script> 

Answer 1

那是因爲你的SpriteVisualElement沒有一個尺寸。它的width和height是0。您仍然可以看到黑色方塊，因爲它溢出了，但沒有進行測量，因爲它是純粹的ActionScript圖形。

因此，要解決您的問題簡單地給container大小：

<s:SpriteVisualElement id="container" width="480" height="360" /> 
<s:HSlider/> 

includeInLayout是true默認。

---

如果你想要做的是，雖然畫一些形狀，你最好使用FXG了點。例如您的矩形將成爲這樣的事情：

<s:Rect width="480" height="360"> 
    <s:fill> 
     <s:SolidColor color="0xff0000" /> 
    </s:fill> 
    <s:stroke> 
     <s:SolidColorStroke color="0x00ff00" weight="1" /> 
    </s:stroke> 
</s:Rect> 
<s:HSlider/>