> 文章列表 > Unity WebGL监听是否进入全屏模式

Unity WebGL监听是否进入全屏模式

Unity WebGL监听是否进入全屏模式

今天遇到一个需求打包成WebGL之后要当做一个iframe,嵌入到别的网页中,其中遇到两个难题。

1.要增加一个全屏模式。

2.全屏的时候使用unity中的title,非全屏的时候要使用网页本身的title。

全屏一开始使用webkitRequestFullScreen,直接控制全屏发现,当点击全屏后,画面出现拉伸,需要点击一下才会回复正常的画面。没有找到有效的解决方法。

于是使用unity自己封装的方法来控制全屏吧。

修改打包后的CSS文件,将全屏按钮移动到画面中。

#unity-fullscreen-button {   position: absolute;

    bottom: 10px;

    width: 38px;

    height: 38px;

    right: 10px; background: url('fullscreen-button.png') no-repeat center }

 

 第二个问题,做好js调用unity中的代码,控制title的显示和隐藏,然后增加这个方法就可以监听浏览区是否进入全屏状态。

  window.onresize = function() {if (document.fullscreenElement) {console.log('进入全屏')unityInstance.SendMessage("JSToUnity","Show");} else {// TODO...console.log('退出全屏')unityInstance.SendMessage("JSToUnity","Close");}
};