Question

我正在尝试让Unity WebPlayer控件在调整浏览器大小时调整大小。这是我认为相关的代码：

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
    <head>
        <script type="text/javascript">
        <!--
        function GetUnity() 
        {
            if (typeof unityObject != "undefined") 
            {
                return unityObject.getObjectById("unityPlayer");
            }
            return null;
        }

        function ResizeUnity()
        {
            //This function properly assigns innerWidth and Height to winWidth and winHeight
            GetWindowSize();

            var unity = GetUnity();
            if(unity != null)
            {
                //This does not properly resize anything at all
                unity.width = winWidth;
                unity.height = winHeight;
            }
        }
    }

    if (typeof unityObject != "undefined") 
    {
        GetWindowSize();
        //This replaces the unityPlayer div below with an actual WebPlayer object
        unityObject.embedUnity("unityPlayer", "WebPlayer.unity3d", winWidth, winHeight, params);            
    }
    -->
    </script>
    <style type="text/css">
    <!--
    div#unityPlayer {
        cursor: default;
        height: 100%;
        width: 100%;
    }
    -->
    </style>
    </head>
    <body margin="0" marginwidth="0" marginheight="0" scroll="no" onResize="ResizeUnity()">
        <div class="content">
            <div id="unityPlayer">
                <div class="missing">
                    <a href="http://unity3d.com/webplayer/" title="Unity Web Player. Install now!">
                    </a>
                </div>
            </div>
        </div>
    </body>
</html>

从代码中的各种alert()开始，我可以在更改窗口大小时验证是否正在调用ResizeUnity()。我可以验证winWidth和winHeight在调整大小时是否获得了适当的值。但是，无论我对浏览器窗口做什么，Unity WebPlayer对象都保持与加载时相同的大小。

我做错了什么？

Answer 1

似乎GetUnity()函数没有抓住一个足够高的div层次结构的元素来调整正确的元素大小。用这个更新我的ResizeUnity()函数就可以了：

function ResizeUnity()
{
    //This function properly assigns innerWidth and Height to winWidth and winHeight
    GetWindowSize();

    var unity = document.getElementById('unityPlayer');
    if(unity != null)
        {                   
            unity.style.width = winWidth + "px";
            unity.style.height = winHeight + "px";
        }
}

Answer 2

您需要调整包含游戏的div的属性。大多数时候CSS足以做到这一点，你不需要JavaScript。

这是一个使用浏览器的全宽和高度显示游戏的工作示例：

<html xmlns="http://www.w3.org/1999/xhtml">
    <head>
        <script type="text/javascript" src="http://code.jquery.com/jquery-2.0.3.min.js"></script>
        <script type="text/javascript" src="http://webplayer.unity3d.com/download_webplayer-3.x/3.0/uo/UnityObject2.js"></script>
        <script type="text/javascript">
            var u = new UnityObject2();
            jQuery(function() {
                u.initPlugin(jQuery("#unityPlayer")[0], "http://unity3d.com/files/live-demos/angrybots/AngryBots.unity3d");
            });
        </script>
        <style type="text/css">
        html, body {
            height: 100%;
            margin: 0;
        }
        #unityPlayer {
            position:fixed;
            top:0px;
            left:0px;
            height: 100%;
            width: 100%;
        }
        </style>
    </head>
    <body>
        <p>Some text that will be hidden...</p>
        <div id="unityPlayer"></div>
        <p>Some more text that will also be hidden.</p>
    </body>
</html>

调整浏览器大小时调整Unity WebPlayer元素的大小

2 个答案: