SwiftUI Camera and ARKit Overlay Code (Free Guide)

The cleanest way to add a camera or ARKit overlay in SwiftUI is to start from a finished overlay design on VP0, then bridge the live feed underneath it. VP0 is the free iOS design library for AI builders, so you copy a near-matching camera or scanner screen into Claude Code or Cursor and get the capture button, framing guides and controls right in one pass. SwiftUI has no native camera view, so the real work is two things: bridging UIKit cleanly and keeping the overlay separate from the feed. A camera or AR view that stutters reads as broken, and smoothness drives retention, which already sits near 25% on day one, so treat it like a React Native 3D product viewer: it has to be smooth or it is worthless.

Bridge the feed with UIViewRepresentable

SwiftUI cannot show a camera or AR scene directly. You wrap the UIKit view in a UIViewRepresentable: an ARView for ARKit, or a preview layer over an AVFoundation capture session for a plain camera. Then you place your SwiftUI controls in a ZStack on top, so the live feed is the background and your buttons, guides and status are the overlay. Keeping these two layers separate is what makes the UI easy to design and the feed easy to manage.

The permission string is mandatory

iOS will crash your app the instant it requests the camera if NSCameraUsageDescription is missing from Info.plist. This is the single most common camera-app crash. Add a clear, honest purpose string (“Used to scan documents,” not “Camera”), request access at the moment of use, and design the denied state: show a short explanation and a button to open Settings, never a dead black screen. Apple’s Human Interface Guidelines cover requesting permission in context.

ARKit vs a plain camera

Need	Use	Note
Photo, video, scanning	AVFoundation	Lighter, works on all devices
World tracking, plane detection, place 3D	ARKit	Needs an A-series chip, feature-gate it
Overlay UI (buttons, guides)	SwiftUI ZStack	Same for both, design it from VP0

A worked example

Say you build a document scanner. Start from a VP0 scanner overlay so the capture button, edge guides and hint text are done. Bridge an AVFoundation session in a UIViewRepresentable as the background, put the overlay in a ZStack, and add NSCameraUsageDescription. Request the camera when the user taps scan, and if denied, show the explain-and-open-Settings state. For AR, swap the background for an ARView and feature-gate it so older devices fall back to the plain camera.

Common mistakes

The most common mistake is forgetting the usage-description string, which crashes the app on first camera use. The second is mixing capture logic into the SwiftUI view instead of the bridge, which makes both hard to change. The third is shipping ARKit with no fallback, so unsupported devices get nothing. The fourth is ignoring the denied-permission state and showing a black screen.

Key takeaways

• SwiftUI has no native camera or AR view, so bridge ARView or AVFoundation with UIViewRepresentable.
• Add NSCameraUsageDescription or the app crashes when it requests the camera.
• Use AVFoundation for a normal camera and ARKit only for world tracking; feature-gate AR.
• Design the overlay (controls, guides, denied state) from a free VP0 design.

Keep reading: for the small in-app messages around capture see native toast notification modals, and for a field-report capture flow see the HVAC inspection report app UI for iPad.

FAQ

How do I add an ARKit or camera overlay in SwiftUI?

SwiftUI has no native camera view, so wrap ARView (ARKit) or an AVFoundation capture session in a UIViewRepresentable, then place your SwiftUI controls in a ZStack on top as the overlay. Add the NSCameraUsageDescription string in Info.plist or the app crashes when it asks for the camera. Start the overlay UI from a free VP0 design and let Claude Code fill in the bridge.

Why does my SwiftUI camera app crash on launch?

Almost always a missing usage-description string. iOS requires NSCameraUsageDescription in Info.plist before it shows the permission prompt. Without it the app crashes the moment it requests the camera. Add a clear purpose string and handle the denied case in your UI.

ARKit or AVFoundation: which should I use?

Use AVFoundation for a plain camera (photo, video, scanning) and ARKit only when you need world tracking, plane detection or placing 3D content in the scene. ARKit is heavier and needs an A-series chip, so feature-gate it and fall back to a normal camera on unsupported devices.

Is VP0 good for a camera or AR overlay UI?

Yes. VP0 is the free iOS design library for AI builders, so you copy a near-matching camera or scanner overlay into Cursor or Claude Code and get the controls, framing guides and capture button right, then bridge the live feed underneath. It handles the overlay, not the AR session itself.