0

我有一个 Flex 应用程序，它有一个 UIComponent，它包含一个 Bitmap 对象。在 Flex 3 中，一切都很好。在 Flex 4 中，相同的代码会导致 UIComponent 中的子元素发生偏移，这是我无法理解的。

这是我的 .html 文件的对象标记：

        <object classid="clsid:d27cdb6e-ae6d-11cf-96b8-444553540000" codebase="http://download.macromedia.com/pub/shockwave/cabs/flash/swflash.cab#version=10,0,0,0" width="320" height="480" id="MyId">
          <param name="allowScriptAccess" value="sameDomain" />
          <param name="allowFullScreen" value="false" />
          <param name="movie" value="MyFlexApp.swf" />
          <param name="quality" value="high" />
          <param name="bgcolor" value="#ffff00" />
          <embed allowScriptAccess="sameDomain" allowFullScreen="false" src="MyFlexApp.swf" quality="high" bgcolor="#ffff00" width="320" height="480" name="MyAppName" type="application/x-shockwave-flash" pluginspage="http://www.adobe.com/go/getflashplayer" />
        </object>

这是我的 .mxml 文件：

<?xml version="1.0"?>
<!-- usingas/UsingCDATA.mxml -->
<mx:Application xmlns:mx="http://www.adobe.com/2006/mxml" applicationComplete="init()" width="320" height="480" backgroundColor="#FF0000" styleName="plain">
  <mx:Script>
    <![CDATA[
    import mx.core.UIComponent;
    import MyClass;
    public function init() : void
    {
            var s:UIComponent = new MyClass();
            addChild( s );
    }
    ]]>
  </mx:Script>
</mx:Application>

这是 MyClass.as：

public class MyClass extends UIComponent
{
    ... <snip> ...

    screenBitmap = new Bitmap( screenBitmapData );
    addChildAt( screenBitmap, 0 );
    // screenBitmap.x = -160;
    // screenBitmap.y = -24;
    var t:TextField = new TextField();
    t.type = TextFieldType.INPUT;
    t.border = true;
    t.text = "hello";
    addChildAt( t, 1 );

    ... <snip> ...
}

请注意，该标签具有黄色背景色。我看到黄色背景正确填充了 .swf 的 320x480 大小。请注意，应用程序的背景颜色为红色。同样，在闪烁黄色之后，我看到红色背景正确填充了 .swf 的 320x480 大小，所以我相信应用程序本身没有偏移。

但我看到的是 screenBitmap 对象在显示器内出现偏移。它太低了 24 像素，向右 160 像素（因此位图的左边缘正好从应用程序显示矩形的中间开始）。我不明白这些偏移量来自哪里。特别是，我不知道 MyClass 对象是否在 Application 对象内偏移（即，好像 Application 对象具有 160 的“左填充”和 24 的“顶部填充”），或者它是否是 MyClass 对象具有这些填充，然后应用于其子级（位图和 TextField）。（我在这里使用“填充”来表示 Flex 正在以某种方式执行的 .css 填充之类的东西，尽管我在 Flex 文档中没有看到提到这样的概念。）

通过取消注释这两行

    // screenBitmap.x = -160;
    // screenBitmap.y = -24;

我可以让位图“正确”显示，但这不正确，因为位图上的鼠标事件随后被错误地偏移。我当然也可以补偿鼠标事件处理的变化，但我想了解为什么会发生这种变化，而不是盲目地补偿它。

请注意，我还包括一个 TextField 对象：

    var t:TextField = new TextField();
    t.type = TextFieldType.INPUT;
    t.border = true;
    t.text = "hello";
    addChildAt( t, 1 );

我这样做只是为了确保我的位图对象没有什么奇怪的东西导致了这种转变。文本对象得到相同的偏移，其左上角在 160, 24 在整个 .swf 矩形内。

正如我所说，我没有在 Flex 3 中获得这些偏移量。我使用完全相同的代码，现在只是使用 Flex 4 SDK 进行编译。

知道偏移量来自哪里吗？

4

1 回答 1

0

非常感谢 The_asMan 和 Sunil D。以下是修正后的 .mxml 文件，其中不再存在偏移问题：

<?xml version="1.0" encoding="utf-8"?>
<s:Application
    xmlns:fx="http://ns.adobe.com/mxml/2009"
    xmlns:mx="library://ns.adobe.com/flex/mx"
    xmlns:s="library://ns.adobe.com/flex/spark" applicationComplete="init()" width="320" height="480" backgroundColor="#FF0000">
  <fx:Script>
    import mx.core.UIComponent;
    import MyClass;
    public function init() : void
    {
            var s:UIComponent = new MyClass();
            addChild( s );
    }
    ]]>
  </fx:Script>
</s:Application>
于 2012-11-17T02:43:55.237 回答