React Native 进军混合现实

大家好,这里是大家的林语冰。持续关注,坚持阅读,每天一次,进步一点

免责声明

本文属于是语冰的直男翻译了属于是,略有删改,仅供粉丝参考。英文原味版请传送 React Native Fork Supports Development on Apple Vision Pro

本期共享的是 ------ 一个 React Native Fork(复刻仓库)支持开发苹果 Vision Pro。具体而言,一个新的 React Native 开源复刻项目将 React Native 引入了苹果的 Vision Pro 头显产品,允许移动开发者为混合现实头显开发 App。

苹果 Vision Pro 是去年 6 月苹果公司在其年度全球开发者大会上官宣的混合现实头显,是一款集 AR(增强现实)和 VR(虚拟现实)功能于一体的 MR 头显(混合现实头戴式显示设备)。

简而言之,Vision Pro 类似于邓紫棋在其《启示录》专辑的里装备的那个眼镜,可以化身"头号玩家"飞升元宇宙。乐土,启动!

而就在昨天,全球第 1 台零售版 Vision Pro 才正式被抱出线下实体旗舰店,你我皆为苹果历史见证人。

理论上可以将移动 App 移植到苹果 Vision Pro 的 visionOS 操作系统。

毕竟,M.P. 在最近的 React Native 播客中估计,visionOS 高达 80-90%(以上)的代码与 iOS 系统相同。M.P. 是软件工程咨询公司 Callstack 的技术主管。Callstack 负责该项目的软件工程师 O.K. 如是说,这两者的基建其实都是 UIKit。

换而言之,当 Callstack 与 Rebecker Specialties 的创始人 M.H. "梦幻联动",为 Vision Pro 创建 React Native App 时,它们发现没法在 visionOS 系统上使用该框架。因此 Callstack 决定创建一个 React Native 的分支。通过该分支,Callstack 构建了一个新的开源树外平台(out-of-tree platform),可以和 visionOS 系统"梦幻联动"。它允许开发者将 App 重新定位到 Vision Pro,并完全支持平台 SDK。

"苹果 Vision Pro 最显着的特点当然是这种沉浸式空间体验,其中一大坨 App 彼此相邻,"该复刻仓库的开发者 O.K. 如是说。"这就是我们将为 React Native 带来的愿景,这样用户可以轻松镜像 App,并充分利用苹果 Vision Pro 用户的空间。"

VisionOS 开发的怪癖

将 VisionOS 系统视为具有三种类型的空间内容会有所帮助:

  • 窗口
  • 3D 体积
  • 空间

窗口是包含传统视图和控件的矩形框,并且可以包含某些 3D 内容。体积更像是一个大立方体,可以展示任意角度的 3D 视觉体验。最后是空间......以及其他的一切。默认情况下,App 启动到共享空间,它们并行不悖,就像桌面上的多个 App 一样。

"App 可以使用窗口和体积来显示内容,且用户可以将这些元素重新定位到它们喜欢的任意位置,"苹果 VisionOS 官网如是说。 "为了享受身临其境的体验,App 可以打开一个专属完整空间,其中只会显示该 App 的内容。在完整空间内,App 可以使用窗口和体积,创建无限的 3D 内容,打开通往不同世界的门户,甚至让大家完全沉浸在环境中。"

苹果 Vision Pro 是一款混合现实或扩展现实头显,而不仅仅是虚拟现实。混合现实更像是虚拟叠加层,允许用户与周围环境交互。O.K. 和 M.P. 在播客中共享道,这款头显允许用户使用手、声音和眼睛进行导航,所有这些都由系统层处理,不需要开发者进行编程。

Vision Pro 仍然供不应求 ------ 截至 1 月份的播客,Callstack 仍然在抢购候补名单上 ------ 所以 O.K. 只在模拟器上测评开发,但它表示,操作系统将突出显示用户查看的位置并选择元素,然后可以通过手指动作激活 ------ 就像点击触控板一样。

备胎方案

O.K. 表示,该团队确实将 Flutter 视为 React Native 的备胎方案,但最终还是选择了后者,因为它是一个更成熟的框架,在苹果应用商店和 Google Play 内发布的 App 中抢占的市场份额更大。它补充道,React Native 平台将允许这些开发者将其移动 App 扩展到 visionOS 系统。

NativeScript 是创建 VisionPro App 的另一个备胎。它为多个 JS 框架提供 VisionOS 支持,包括 React 和 Vue,允许开发者将 JS 与苹果的 SwiftUI "梦幻联动"。虽然但是,相比之下,React Native 更容易、更快,M.P. 如是说。

构建树外平台

O.K. 将针对 visionOS 系统的 React Native 分支与微软 Windows 的 React Native 分支进行了比较。

"它允许我们采用众所周知的 JS 编写的相同的代码库,并在 MacOS 系统和 Windows 系统上运行,我们还允许它在 VisionOS 系统上运行,"它讲道。

它补充道,在构建 React Native VisionOS 框架时,团队利用了另一个框架 Swift UI 来弥合 React Native 和 Vision Pro 视觉方面之间的差距。

团队发现不可能甚至没有必要迁移所有 React Native 代码。举个栗子,某些 API 在 Vision Pro 上毫无卵用。

"检索当前用户屏幕信息的 API 对于此平台而言毫无卵用,因为屏幕距离我们的眼睛有且仅有一厘米,我们无法访问用户正在查看的屏幕;但对于视觉效果,我们使用窗口来显示东东,"它说道。 "这就是为什么大多数库开发者和维护者需要解决某些常见问题,才能让它们的库在此平台上奏效。"

只有使用原生代码的库才需要迁移;根据 O.K. 一月份详细介绍如何迁移库的帖子,纯 JS 库将开箱即用。当然,该框架旨在解决某些挑战。O.K. 自愿表示,任何致力于转换其库的开发者都可以向它寻求帮助。

《前端 9 点半》每日更新,持续关注,坚持阅读,每天一次,进步一点

谢谢大家的点赞,掰掰~

相关推荐
想起你的日子5 分钟前
Android studio 实现弹出表单编辑界面
java·前端·android studio
LuckyLay1 小时前
Vue百日学习计划Day9-15天详细计划-Gemini版
前端·vue.js·学习
Coding的叶子1 小时前
React Flow 节点事件处理实战:鼠标 / 键盘事件全解析(含节点交互代码示例)
react.js·交互·鼠标事件·fgai·react agent
weifont5 小时前
聊一聊Electron中Chromium多进程架构
javascript·架构·electron
大得3695 小时前
electron结合vue,直接访问静态文件如何跳转访问路径
javascript·vue.js·electron
水银嘻嘻7 小时前
12 web 自动化之基于关键字+数据驱动-反射自动化框架搭建
运维·前端·自动化
it_remember7 小时前
新建一个reactnative 0.72.0的项目
javascript·react native·react.js
小嘟嚷ovo7 小时前
h5,原生html,echarts关系网实现
前端·html·echarts
十一吖i8 小时前
Vue3项目使用ElDrawer后select方法不生效
前端
只可远观8 小时前
Flutter目录结构介绍、入口、Widget、Center组件、Text组件、MaterialApp组件、Scaffold组件
前端·flutter