当前位置: 首页 > news >正文

Unity WebGL文本输入

插件

kou-yeung/WebGLInput
版本如下图所示:

在这里插入图片描述

使用

Unity版本:2019.4.40
使用:文本输入组件对象添加WebGLInput脚本,没有其他额外操作,输入组件正常使用
问题:插件中部分C#语法需要高版本支持,可自行修改。

发布

使用WebGL默认模板发布。

问题:

非全屏模式下,文本输入正常,输入光标跟随移动。
全屏模式下,文本输入异常,输入光标不跟随移动。

解决:

运行插件作者的示例项目(默认),查看网页原代码。
修改index.html文件,覆盖全屏按钮的点击事件。修改如下:

  <script>var fullscreenButton = document.querySelector(".fullscreen");fullscreenButton.onclick = function () {document.makeFullscreen('unityContainer');};</script>

完整index.html

<!DOCTYPE html>
<html lang="en-us"><head><meta charset="utf-8"><meta http-equiv="Content-Type" content="text/html; charset=utf-8"><title>Wooden Toy Production Line Webgl</title><link rel="shortcut icon" href="TemplateData/favicon.ico"><link rel="stylesheet" href="TemplateData/style.css"><script src="TemplateData/UnityProgress.js"></script><script src="Build/UnityLoader.js"></script><script>var unityInstance = UnityLoader.instantiate("unityContainer", "Build/WebGL.json", { onProgress: UnityProgress });</script>
</head><body><div class="webgl-content"><div id="unityContainer" style="width: 1008px; height: 567px"></div><div class="footer"><div class="webgl-logo"></div><div class="fullscreen" onclick="unityInstance.SetFullscreen(1)"></div><div class="title">Test Text Input</div></div></div><script>var fullscreenButton = document.querySelector(".fullscreen");fullscreenButton.onclick = function () {document.makeFullscreen('unityContainer');};</script>
</body></html>

成功解决

小优化

使用 WebGL 模板
创建一个webgl模板,不需要每次发布后修改index.html

  1. 找到引擎安装路径,在文件夹中查找webgl模板,例如搜索 WebGLTemplates
  2. Assets文件夹下新建文件夹WebGLTemplates,此文件夹中新建文件夹Custom,名字区分不同的模板
  3. 复制默认模板中的内容到Custom文件夹中,修改index.html
    在这里插入图片描述
  4. 项目设置窗口中选择自定义的模板
    在这里插入图片描述
http://www.dtcms.com/a/272182.html

相关文章:

  • centos7 安装jenkins
  • jenkins部署springboot项目
  • 抽象类与接口:Java面向对象设计的两大支柱
  • 表达式索引海外云持久化实践:关键技术解析与性能优化
  • Spring Boot 整合 RabbitMQ
  • 【前端】接口日志追踪
  • 06.消息传递网络
  • 「日拱一码」023 机器学习——超参数优化
  • 判断当前是否为钉钉环境
  • 【Pandas】pandas DataFrame from_dict
  • 1.2.3_1 OSI参考模型
  • STM32F103C8T6单片机内部执行原理及启动流程详解
  • vue3实现pdf文件预览 - vue-pdf-embed
  • 力扣热门算法题 127.单词接龙,128.最长连续序列,130.被围绕的区域
  • MySQL数据库基础教程:从安装到数据操作
  • 快速合并多个CAD图形为单一PDF文档的方法
  • 常见 Docker 错误及解决方法
  • (vue)前端区分接口返回两种格式,一种Blob二进制字节流,一种常规JSON,且将blob响应转为json
  • 基于Catboost算法的茶叶数据分析及价格预测系统的设计与实现
  • 多元函数的切平面与线性近似:几何直观与计算方法
  • 高数附录(1)—常用平面图形
  • 《O-PAS™标准的安全方法》白皮书:为工业自动化系统筑起安全防线
  • msf复现永恒之蓝
  • 每日一SQL 【各赛事的用户注册率】
  • Datawhale AI 夏令营:基于带货视频评论的用户洞察挑战赛 Notebook(下篇)
  • 流媒体服务
  • SIMATIC S7-1200的以太网通信能力:协议与资源详细解析
  • x86架构CPU市场格局
  • WIFI协议全解析05:WiFi的安全机制:IoT设备如何实现安全连接?
  • PHP安全编程实践系列(三):安全会话管理与防护策略