Apple Vision Pro 即將推出,現在是看看 SwiftUI API 的完美時機,這使我們能夠將我們的應用程序適應 visionOS 提供的沉浸式世界。蘋果表示,構建應用程序的最佳方式是使用 Swift 和 SwiftUI。下面,我們將學習如何使用 SwiftUI 構建 visionOS 應用程序。
我喜歡 SwiftUI 的一點是它如何自動適應平臺。你無需執行任何操作即可在 visionOS 上運行使用 SwiftUI 編寫的應用程序。它可以即插即用。但是,你始終可以通過向前移動并適應平臺功能來改進用戶體驗。
struct ContentView: View { var body: some View { NavigationSplitView { List { // 列表內容 } .navigationTitle("Models") .toolbar { ToolbarItem(placement: .bottomOrnament) { Button("open", systemImage: "doc.badge.plus") { } } ToolbarItem(placement: .bottomOrnament) { Button("open", systemImage: "link.badge.plus") { } } } } detail: { Text("Choose something from the sidebar") } }}
在上面的示例中,我們使用了稱為 bottomOrnament 的新工具欄放置。visionOS 中的裝飾是位于窗口外部的位置,用于呈現與窗口連接的控件。你還可以通過使用新的 ornament 視圖修改器手動創建它們。
struct ContentView: View { var body: some View { NavigationSplitView { List { // 列表內容 } .navigationTitle("Models") .ornament(attachmentAnchor: .scene(.leading)) { // 在此處放置你的視圖 } } detail: { Text("Choose something from the sidebar") } }}
新的 ornament 視圖修改器允許我們為其連接的窗口創建一個具有特定錨點的裝飾。將你的應用內容適應 visionOS 提供的沉浸式體驗的另一種方法是使用 transform3DEffect 和 rotation3DEffect 視圖修改器來加入深度效果。如下圖:
你的應用程序可以在 visionOS 上的同一場景中并排顯示 2D 和 3D 內容。在這種情況下,我們可以使用 RealityKit 框架來呈現 3D 內容。例如,RealityKit 為我們提供了 Model3D SwiftUI 視圖,允許我們從 USDZ 或實際文件中顯示 3D 模型。
struct ContentView: View { var body: some View { NavigationSplitView { List(Model.all) { model in NavigationLink { Model3D(named: model.name) } label: { Text(verbatim: model.name) } } .navigationTitle("Models") } detail: { Model3D(named: "robot") } }}
Model3D 視圖的工作方式類似于 AsyncImage 視圖,并異步加載模型。你還可以使用 Model3D 初始化器的另一種變體,它允許你自定義模型配置并添加占位視圖。
struct ContentView: View { var body: some View { NavigationSplitView { List(Model.all) { model in NavigationLink { Model3D( url: Bundle.main.url( forResource: model.name, withExtension: "usdz" )! ) { resolved in resolved .resizable() .aspectRatio(contentMode: .fit) } placeholder: { ProgressView() } } label: { Text(verbatim: model.name) } } .navigationTitle("Models") } detail: { Model3D(named: "robot") } }}
在你的應用程序中呈現 3D 內容時,你可以使用 windowStyle 修飾符來啟用內容的體積顯示。體積樣式允許你的內容在第三維中增長,以匹配模型的大小。
對于更復雜的 3D 場景,我們可以使用 RealityView 并填充它以 3D 內容。
struct ContentView: View { var body: some View { NavigationSplitView { List(Model.all) { model in NavigationLink { RealityView { content in // load the content and add to the scene } } label: { Text(verbatim: model.name) } } .navigationTitle("Models") } detail: { Text("Choose something from the sidebar") } }}
visionOS 的第三個選項是完全沉浸式體驗,允許我們通過隱藏周圍的所有內容來專注于你的場景。
@mainstruct MyApp: App { var body: some Scene { WindowGroup { ContentView() } ImmersiveSpace(id: "solar-system") { SolarSystemView() } }}
正如你在上面的示例中所看到的,我們通過使用 ImmersiveSpace 類型來定義場景。它允許我們通過使用 openImmersiveSpace 環境值來啟用它。
struct MyMenuView: View { @Environment(/.openImmersiveSpace) private var openImmersiveSpace var body: some View { Button("Enjoy immersive space") { Task { await openImmersiveSpace(id: "solar-system") } } }}
我們還可以使用 dismissImmersiveSpace 環境值來關閉沉浸式空間。請記住,你一次只能顯示一個沉浸式空間。
struct SolarSystemView: View { @Environment(/.dismissImmersiveSpace) private var dismiss var body: some View { // Immersive experience Button("Dismiss") { Task { await dismiss() } } }}
在介紹了 SwiftUI 在 visionOS 上的應用之后,我們了解到 SwiftUI 可以幫助我們輕松構建適應 visionOS 的應用程序。不僅如此,SwiftUI 還提供了許多方便的工具和修飾符,例如 windowStyle 修飾符,可用于在應用程序中呈現 3D 內容,并使內容根據模型的大小自動適應。通過引入沉浸式空間,我們可以將用戶帶入全新的體驗,讓他們沉浸在應用程序的世界中。總的來說,SwiftUI 為構建 visionOS 應用程序提供了強大而靈活的工具,我們可以期待在這個全新的平臺上開發出令人驚嘆的應用體驗。
本文鏈接:http://www.tebozhan.com/showinfo-26-88936-0.html如何使用 SwiftUI 構建 visionOS 應用
聲明:本網頁內容旨在傳播知識,若有侵權等問題請及時與本網聯系,我們將在第一時間刪除處理。郵件:2376512515@qq.com