猎户空间站示例
一座小型离线空间站:收集三个能量单元,交给终端,任务完成。界面全部用网页做成,背包、任务进度和设置由蓝图掌管。
打开示例
- 先下载依赖。
- 在内容浏览器里打开“显示插件内容”,打开
/,点击运行。OrionBrowser/ Showcase/ L_OrionBrowserOverview
单独的示例工程 OrionBrowserTemplate 直接打开即可,默认关卡是 /。想在别的关卡里运行这个示例,在 World Settings 里把 GameMode 设为 BP_OrionStationGameMode。
界面内容
五个页面加一条任务 HUD。四套主题(曜石、星云、极光、纸墨)和三种背景可以在设置页或命令搜索(Ctrl+K)里切换。
曜石(默认)
星云
极光
纸墨
| 页面 | 内容 |
|---|---|
| 概览 | 示例简介、任务状态,以及去往其他页面的入口 |
| 展厅 | 十个展室,每个展示一组插件能力或一种网页技术 |
| 背包 | 蓝图持有的物品,选中一件可查看详情 |
| 设置 | 改好后点应用,由蓝图保存 |
| 指南 | 任务步骤和当前设备的操作方式 |
展厅
背包
设置
命令搜索(英文界面)
| 展室 | 演示内容 |
|---|---|
| 动效 | 一块表面依次变成按钮、加载指示、播放器、滑块、图表和命令面板 |
| 组件 | 按钮、开关、滑块、分段控件和图表 |
| 光效 | 全息箔、镜头眩光、流光描边、高光、霓虹和玻璃 |
| 字体 | 十二种字体的实时样张,可调字重、字号和字距 |
| 楼阁 | 用 three.js 搭建的楼阁,带日夜光照、阴影和倒影 |
| 宇宙 | 透明画布上的太阳系、星系和黑洞,背后就是关卡 |
| 性能 | 可调负载的小行星带,显示帧率和帧时间 |
| 影音 | 带声音的本地视频,自带播放控件和电平表 |
| 输入 | 控件音效、按键提示、按键测试和输入法输入 |
| 虚幻 | Native Surface、运行时图片、WorldUI 标签和网页浏览器 |
组件
光效
字体(英文界面)
楼阁
宇宙
输入(英文界面)
操作方式
| 按键 | 作用 |
|---|---|
| WASD | 任务开始后在关卡里移动 |
| E | 与屏幕中央附近的 WorldUI 卡片交互(收集、提交) |
| I | 打开或关闭背包 |
| P | 打开菜单或返回上一页(PIE 里用它代替 Escape) |
| 方向键 | 在菜单页移动焦点 |
| Ctrl+K | 打开命令搜索,可以搜索页面、展室、主题和常用操作 |
主要资产
都在 / 下:
| 资产 | 作用 |
|---|---|
L_OrionBrowserOverview |
示例关卡 |
BP_OrionStationGameMode |
示例使用的 GameMode |
BP_OrionStationController |
持有游戏状态、校验网页的操作、发布状态、保存存档、创建界面 |
WBP_OrionBrowserShowcase |
承载网页界面的 Widget,把事件转交控制器 |
DA_OrionBrowserShowcase |
界面的 App Definition |
BP_OrionEnergyCell、BP_OrionTerminal |
能量单元和终端,带 WorldUI 交互 |
WBP_OrionWebsite |
显示官网的网页浏览器 |
拿它做自己的界面
- 网页源码在插件的
Content/,可以对照着看。UI/ WebUI/ Showcase/ src - 做自己的界面时,参考
WBP_OrionBrowserShowcase的接线,另建自己的 App Definition 和 Widget。最快的做法见教程 1:用 AI 制作界面,逐步接线见教程 3。
帧率设置
示例工程把游戏帧率上限设为 60,给网页界面和游戏都留出显卡时间;它还打开了硬件加速的画面传输(bUseAcceleratedPaint=True),做法见教程 4。这两项只属于示例工程,安装插件不会改你的工程。
自己的游戏不要让帧率完全不设上限:显卡被游戏占满时,网页界面可能不再刷新。可以用 Get Game User Settings → Set Frame Rate Limit → Apply Non-Resolution Settings 设置上限。