【问题标题】:Height and width of a SWF file in htmlhtml 中 SWF 文件的高度和宽度
【发布时间】:2011-04-18 12:46:08
【问题描述】:

在下面的代码中只有按钮图像被嵌入到flex代码中。但是在html对象或嵌入标签中为什么必须指定高度和宽度。即使这是一个正常的按钮,如果我们不指定高度和宽度似乎有些错误

html

<div align="center">
    <br />
    <div style="display:block;width:100px;height:100px;" id="audio" 
        class="testsound" align="center"/>
    <p class="clickable">
        <object classid="clsid:D27CDB6E-AE6D-11cf-96B8-444553540000" 
        width="400" height="100" id="myMovieName">
            <param name="movie" value="/media/players/testsound.swf"/>
            <param name="soundurl" value="/media/players/music.mp3"/>
            <param name="quality" value="high"/>
            <param name="bgcolor" value="#FFFFFF"/>
            <embed width="100" height="100" href="/media/players/testsound.swf" 
                src="/media/players/testsound.swf" 
                flashvars="soundUrl=/media/players/music.mp3" 
                quality="high" bgcolor="#FFFFFF" 
                name="myMovieName" loop="false" align=""
                type="application/x-shockwave-flash">
            </embed>
        </object>
    </p>
</div>

MXML

<?xml version="1.0"?>
<!-- embed/EmbedSound.mxml -->
<mx:Application xmlns:mx="http://www.adobe.com/2006/mxml">

    <mx:Script>
        <![CDATA[

            import flash.media.*; 

            public var snd:Sound = new sndCls() as Sound; 
            public var sndChannel:SoundChannel;

            public function playSound():void {
                sndChannel=snd.play();
            }   

        ]]>
    </mx:Script>
    <mx:Image id="loader1" click="playSound();"
        source="@Embed(source='/opt/cloodon/site/media/img/speaker.gif')" />
</mx:Application>

【问题讨论】:

    标签: html actionscript-3 flash mxmlc


    【解决方案1】:

    嵌入标签中的高度和宽度是必需的属性。在标签定义上查看swfobjectAdobe 以及required and optional attributes

    您是在问为什么需要它们,或者如果没有它们,为什么您的页面会中断(提示,第一个答案是第二个问题)?

    编辑:

    您应该修改 EMBED 和 OBJECT 标签的宽度和高度属性,使其与 swf 的大小完全一致。

    您可以在 .mxml 中设置应用程序的宽度和高度

    <mx:Application width="300" height="200">
    

    如果您将 scaleMode 设置为“noScale”,您将不会在 swf 中看到任何缩放。

    stage.scaleMode = StageScaleMode.NO_SCALE;
    stage.align = StageAlign.TOP_LEFT;
    

    如果您使用的是 Actionscript 3(应该是),您可以在主类中设置元数据。

    [SWF(width="640", height="480")]
    public class MyClass extends Sprite
    {
        public function MyClass()
        {
            stage.scaleMode = StageScaleMode.NO_SCALE;
            stage.align = StageAlign.TOP_LEFT;
        }
    }
    

    【讨论】:

    • 但是现在从你的帖子中它并没有确切地建议应该做些什么来使 swf 适合它在 html 文件中的确切大小
    • 好的,在我上面的编辑中还有一些建议。希望这会有所帮助。
    【解决方案2】:

    您应该在主 mxml 中指定 Application 的宽度和高度,即使它只包含一个可点击的图像!
    如果您希望您的页面具有width: 400pxheight: 100px 的弹性图像(按钮??),那么您的Application 标记必须如下所示:

    <mx:Application xmlns:mx="http://www.adobe.com/2006/mxml" width="400" height="100">
    

    尽管如此,在您的 html 中,您应该让 objectembed 标签具有相同的 widthheight,并且您应该为您的 embed 标签的 align 属性指定一个值以及,例如:align="middle"

    您的object 标签应该类似于

    <object classid="clsid:D27CDB6E-AE6D-11cf-96B8-444553540000" 
        width="400" height="100" id="myMovieName"
        codebase="http://fpdownload.macromedia.com/get/flashplayer/current/swflash.cab">
        <param name="movie" value="/media/players/testsound.swf"/>
        <param name="soundurl" value="/media/players/music.mp3"/>
        <param name="quality" value="high"/>
        <param name="bgcolor" value="#FFFFFF"/>
        <!-- the embed tag does not have href attribute  -->
        <embed width="400" height="100"  
            src="/media/players/testsound.swf" 
            flashvars="soundUrl=/media/players/music.mp3" 
            quality="high" bgcolor="#FFFFFF" 
            name="myMovieName" loop="false" align="middle"
            type="application/x-shockwave-flash"
            pluginspage="http://www.adobe.com/go/getflashplayer">
        </embed>
    </object>
    

    其他 您的 sndClass 在哪里声明?如果您嵌入了该 mp3,则您的脚本标签应包含:

    <mx:Script>
        <![CDATA[
            import mx.core.SoundAsset; 
    
            [Embed('/media/players/music.mp3')]
            private var _sound:Class;
            public var snd:SoundAsset = new _sound() as SoundAsset;
    
            public var sndChannel:SoundChannel;
    
            public function playSound():void {
                sndChannel=snd.play();
            }   
    
        ]]>
    </mx:Script>
    

    如果您想从 html 指定 mp3 的路径,您可以查看this post for reference

    更新 2

    要根据您的 flex 按钮的大小设置 html object 的宽度和高度,您应该如下更新您的应用程序 mxml 代码:

    <?xml version="1.0" encoding="utf-8"?>
    <mx:Application xmlns:mx="http://www.adobe.com/2006/mxml" layout="absolute" 
        width="1" height="1" backgroundColor="#bee3f6"
        horizontalScrollPolicy="off" verticalScrollPolicy="off"
        creationComplete="onCreationComplete()" viewSourceURL="srcview/index.html">
        <mx:Script>
            <![CDATA[
                import mx.events.FlexEvent;
    
                //This method will change the button's label ==> width.
                public function sayWhat():void {
                    var _date:Date = new Date();
                    extButton.label = "It's " + (_date.getHours() + 1) + ":" + _date.getMinutes() + 
                        ((_date.getMilliseconds() % 2) == 0 ? ". nice." : ". very tired.");
                }
    
                public function onCreationComplete():void {
                    // binds this.sayWhat to the external interface, so when from   
                    // javascript is called the compiled swf object's sayWhat function,
                    // it will be transferred to this.sayWhat. 
                    ExternalInterface.addCallback("sayWhat", sayWhat);
    
                    // set the flash application's size to be exact the button's size.
                    this.width = extButton.width;
                    this.height = extButton.height;
    
                    try 
                    {
                        // The js function: onFlashAppInited(width, height);
                        // The next line tells the external interface (the parent application:
                        // browser window), that this application has finished loading, its 
                        // ready to be used. 
                        // We're passing the button's width and height as parameters
                        // In js there has to be a global method with this name.
                        ExternalInterface.call("onFlashAppInited", extButton.width, extButton.height);
                    }
                    catch (e:Error)
                    {
                        trace(e.message + "\n" + e.getStackTrace(), e.name);
                    }
                }        
    
                protected function onButtonUpdateComplete(event:FlexEvent):void
                {
                    // if the button's size has changed, we notify the javascript to set the 
                    // correct size to the object tag too.
                    if ((this.width != extButton.width) || (this.height != extButton.height))
                    {
                        // set the application size
                        this.width = extButton.width;
                        this.height = extButton.height;
                        // notify the js about the change
                        ExternalInterface.call("onFlashAppSizeChanged", this.width, this.height);
                    }
                }
    
            ]]>             
        </mx:Script>
        <mx:Button id="extButton" label="Do something!" updateComplete="onButtonUpdateComplete(event)" />
    </mx:Application>
    

    注意,最初这个应用程序只有 1x1 像素(如果更小,它不会初始化!)。
    onCreationComplete 处理程序中,它的大小被更改以匹配按钮的大小。

    这些值(宽度和高度)被传递给 JavaScript 函数 onFlashAppInited,您也应该更新它:

    function onFlashAppInited(width, height) {
        alert("Flash app inited!");
        appInited = true;
    
        onFlashAppSizeChanged(width,height);
    
        // remove the temporary swf container: tmp
        document.body.removeChild(document.getElementById("tmp"));
    }
    
    function onFlashAppSizeChanged(width, height) {
        flashApp.width = width + "px";
        flashApp.height = height + "px";
    }
    

    【讨论】:

    • 我同意你在 mxml 和 html 中设置高度和宽度。但默认情况下,我们不知道 flex 中按钮的大小,所以如果指定了默认按钮,如何知道它的高度和宽度以及如何在 html.. 中设置它?
    • :-?您可以尝试从 flex 中的 onCreationComplete 方法中检索按钮的大小(宽度/高度),并将其传递给 javascript(沿 flashAppInited 方法作为参数)。这样,javascript 端将收到有关按钮宽度的通知,并且可以调整 swf 对象的大小以具有完全相同的大小。
    • K..你能告诉我如何检索它的任何链接吗..顺便说一句,我看到了你的网站。虽然它没有功能,但它已经很酷了..
    • 我已经更新了答案,基于您将能够在 flex 按钮的大小发生变化时将其发送到 js 端。也更新了示例(如果您想尝试)。
    • 到目前为止运气好吗?如果您需要进一步的指导,请告诉我。 +1 关于在 flex 和 javascript 之间使用通信的问题。
    【解决方案3】:

    除了@Dominic Tancredi 的评论: OBJECT 和 EMBED 标签都需要 WIDTH 和 HEIGHT 属性。

    【讨论】:

      猜你喜欢
      • 1970-01-01
      • 1970-01-01
      • 2013-04-25
      • 1970-01-01
      • 1970-01-01
      • 1970-01-01
      • 1970-01-01
      • 1970-01-01
      • 1970-01-01
      相关资源
      最近更新 更多