在新的Unity WebGL模板中添加全屏显示方式 [英] Add way to go full screen in new Unity WebGL template
问题描述
通常来说，在使用Unity WebGL构建时，默认模板如下所示
从
此外，index.html应该具有与此类似的代码
<！DOCTYPE html>< html lang ="en-us">< head><元字符集="utf-8">< meta http-equiv ="Content-Type"content =" text/html;charset = utf-8".< title> Unity WebGL Player |％UNITY_WEB_NAME％</title>< script src ="％UNITY_WEBGL_LOADER_URL％"</script>< script>var unityInstance = UnityLoader.instantiate("unityContainer"，％UNITY_WEBGL_BUILD_URL％");</script></head><身体>< div id ="unityContainer"style ="width:％UNITY_WIDTH％px;高度:％UNITY_HEIGHT％px；margin:自动</div></body></html> 然后，在播放器设置下，选择该模板
事实是，这没有增加到全尺寸的选项.
您只需在index.html模板中添加具有onclick事件 unityInstance.SetFullscreen(1)<的具有特定高度和宽度的div./code>，例如
< div style =""height:20px;宽度:960px；背景:绿色；"< b></div>单击此处以使其全屏显示. 因此，将代码更改为(我决定将其放在Unity画布上方
<！DOCTYPE html>< html lang ="en-us">< head><元字符集="utf-8">< meta http-equiv ="Content-Type"content =" text/html;charset = utf-8".< title> Unity WebGL Player |％UNITY_WEB_NAME％</title>< script src ="％UNITY_WEBGL_LOADER_URL％"</script>< script>var unityInstance = UnityLoader.instantiate("unityContainer"，％UNITY_WEBGL_BUILD_URL％");</script></head><身体>< div style ="高度:20px;宽度:％UNITY_WIDTH％px;背景:绿色；"< b></div>单击此处以使其全屏显示.< div id ="unityContainer"style ="width:％UNITY_WIDTH％px;高度:％UNITY_HEIGHT％px；margin:自动</div></body></html> 这将输出以下内容
并在加载游戏时单击绿色区域将其变为全屏显示.
Generally speaking, when working with Unity WebGL builds, the default template looks like this
From the documentation, we can see that when we want to use WebGL templates in Unity we have to create a folder in Assets named WebGLTemplates, and a folder named New Template (or whatever name you will) and add an index.html there.
Also, the index.html should have a code similar to this
<!DOCTYPE html>
<html lang="en-us">
<head>
<meta charset="utf-8">
<meta http-equiv="Content-Type" content="text/html; charset=utf-8">
<title>Unity WebGL Player | %UNITY_WEB_NAME%</title>
<script src="%UNITY_WEBGL_LOADER_URL%"></script>
<script>
var unityInstance = UnityLoader.instantiate("unityContainer", "%UNITY_WEBGL_BUILD_URL%");
</script>
</head>
<body>
<div id="unityContainer" style="width: %UNITY_WIDTH%px; height: %UNITY_HEIGHT%px; margin: auto"></div>
</body>
</html>
Then, under Player settings, select that template
Thing is, this doesn't come with the option to increase to full-size.
You can simply add in the index.html template a div with a specific height and width that has the onclick event unityInstance.SetFullscreen(1), like
<div style="height:20px; width: 960px; background: green;" onclick="unityInstance.SetFullscreen(1)"><b>Click here to make it full screen.</b></div>
So, change the code to (i decided to put it above the Unity canvas
<!DOCTYPE html>
<html lang="en-us">
<head>
<meta charset="utf-8">
<meta http-equiv="Content-Type" content="text/html; charset=utf-8">
<title>Unity WebGL Player | %UNITY_WEB_NAME%</title>
<script src="%UNITY_WEBGL_LOADER_URL%"></script>
<script>
var unityInstance = UnityLoader.instantiate("unityContainer", "%UNITY_WEBGL_BUILD_URL%");
</script>
</head>
<body>
<div style="height:20px; width: %UNITY_WIDTH%px; background: green;" onclick="unityInstance.SetFullscreen(1)"><b>Click here to make it full screen.</b></div>
<div id="unityContainer" style="width: %UNITY_WIDTH%px; height: %UNITY_HEIGHT%px; margin: auto"></div>
</body>
</html>
And this will output the following
and clicking the green area when the game is loaded will make it go fullscreen.
这篇关于在新的Unity WebGL模板中添加全屏显示方式的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！
