VRTK4⭐四.和 UI 元素交互

文章目录

  • [🟥 安装Tilia Unity.UI](#🟥 安装Tilia Unity.UI)
  • [🟧 配置射线与UI交互器](#🟧 配置射线与UI交互器)
    • [1️⃣ 配置直线射线](#1️⃣ 配置直线射线)
    • [2️⃣ 配置UI交互器](#2️⃣ 配置UI交互器)
  • [🟨 配置UI](#🟨 配置UI)
    • [1️⃣ 更新EventSystem](#1️⃣ 更新EventSystem)
    • [2️⃣ 进行Canvas设置](#2️⃣ 进行Canvas设置)

我们要实现的功能:

右手触摸到圆盘:显示直线射线

右手圆盘键按下:与选中UI交互

🟥 安装Tilia Unity.UI

PackageManager安装git包 : https://github.com/studentutu/Tilia.UnityUI.git

🟧 配置射线与UI交互器

1️⃣ 配置直线射线

如何所示,创建 Indicators.ObjectPointers.Straight ,并完成配置.

2️⃣ 配置UI交互器

1.将 Full_L_Interactions.Interactor Variant 放置在 RightControllerAlias 下,并删减至如下结构.

2.如下图所示,完成 [L_R]_ UI Pointer on Interactor 的配置

🟨 配置UI

1️⃣ 更新EventSystem

如下图所示,更新 EventSystem

2️⃣ 进行Canvas设置

完成如下步骤:

  • Canvas转换为WorldSpace
  • 添加 VRTK4_UICanvas 组件
  • 设置Canvas的Size

注意:
Canvas的大小决定了该UI的交互范围.只有在范围内的UI才能被交互.

大家还有什么问题,欢迎在下方留言!

如果你有 技术的问题 或 项目开发

都可以加下方联系方式

和我聊一聊你的故事🧡

相关推荐
ZC跨境爬虫2 小时前
跟着 MDN 学 HTML day_36:(深入理解 Comment 接口与 DOM 注释节点)
前端·javascript·ui·html·音视频·视频编解码
for_ever_love__5 小时前
UI学习:无限轮播视图
学习·ui·ios·objective-c
UnicornDev6 小时前
【Flutter x HarmonyOS 6】魔方计时APP——记录页面的UI设计
flutter·ui·华为·harmonyos·鸿蒙
XS0301067 小时前
Servlet实现前后端交互
servlet·交互
XiYang-DING7 小时前
【Java EE】网络通信中的 4 种交互模式
java·java-ee·交互
byte轻骑兵8 小时前
【HID】规范精讲[12]: 蓝牙HID设备的连接信息存储机制深度解析
人工智能·人机交互·交互·键盘·鼠标·hid
秋雨梧桐叶落莳8 小时前
iOS——MVC架构学习
学习·ui·ios·架构·mvc·objective-c
weixin_446260858 小时前
AI驱动的前沿前端技术栈深度解析:从模型能力到UI封装的完整生命周期
前端·人工智能·ui
ZC跨境爬虫8 小时前
跟着 MDN 学 HTML day_35:(深入解析 CharacterData 抽象接口)
java·前端·ui·html·edge浏览器·媒体
YJlio9 小时前
2023-09-25:ChatGPT 开始支持“看、听、说”,从纯文本正式迈向多模态交互
人工智能·python·科技·chatgpt·django·交互·pygame