Learn some basics of VisionOS and build a simple app for it.
I've been working on SwiftUI projects for a while, and I'm really interested in the brand new upcoming operating system, VisionOS. It utilizes frameworks like SwiftUI, RealityKit, and ARKit. I just want to play around with it and build a simple app for VisionOS.
Apple Vision Pro offers an infinite spatial canvas to explore, experiment, and play, giving you the freedom to completely rethink your experience in 3D.
Windows: You can create one or more windows in your visionOS app. They’re built with SwiftUI and contain traditional views and controls, and you can add depth to your experience by adding 3D content.
Volumes: Add depth to your app with a 3D volume. Volumes are SwiftUI scenes that can showcase 3D content using RealityKit or Unity, creating experiences that are viewable from any angle in the Shared Space or an app’s Full Space.
Spaces: By default, apps launch into the Shared Space, where they exist side by side — much like multiple apps on a Mac desktop. Apps can use windows and volumes to show content, and the user can reposition these elements wherever they like.
Checkout the official documentation to learn more.
I'm going to build a simple app that allows users to choose a 3D object from the list and display it.
In the development process, I found that is almost the same as developing an SwiftUI app. If you are familiar with SwiftUI, you are good to go!
First, I create a list of 3D objects. Since I'm a big fan of the game "League of the Legends", I'm going to use some 3D champions of the game. This is nothing special, just a list of strings.
You will see a list of champion names on the left hand side. But don't worry, we will display the 3D model on the right hand side in the next step. You should see something like this, isn't it cool?
You can find some amazing free 3D models on SketchFab. But if you want to use your own 3D models, you can definitely do that (Good luck 🤞). Make sure you export the 3D model as a USDZ file (I guess Apple supports other formats as well, I'm not quite sure about that).
Just like SwiftUI, we need to build a detail view to display the 3D model. I'm going to use the 3D model of champion "aatrox" as an example. You can check out the official document to further explore the APIs.
Isn't it simple? We just need to create a new view and add the 3D model to it. You can also add some animations to the 3D model. I am not going to cover that in this post. You can check out the official document to learn more.
You should see something like this. You can rotate the 3D model by dragging it. You can also zoom in/out by pinching it.
And that's it! Let's put everything together and watch the final demo!
That's a wrap! Building an app for VisionOS is not that hard. If you are familiar with SwiftUI, you are in a good position. I'm looking forward to the official release of VisionOS. I'm sure it will be a game changer for the AR industry. I hope you enjoy this post. If you have any questions, feel free to leave a comment below. Thank you for reading! 🎮