FreeComponents
Video Player
Showcase video player with first-frame thumbnail, tap-to-fullscreen AVKit playback, and orientation callbacks
Free
Free with a ShipSwift account.
Copies a short instruction with your private download link. Paste it into your agent: it downloads the whole skill (the source code, the setup steps and the mistakes we already made for you) and builds the screen.
Works with
+70
What it does
Inline video component for showcase sections with a thumbnail poster and a glass play button. Tapping opens a fullscreen AVKit.VideoPlayer with native controls; closing it remembers the paused position so the next tap resumes from there.
What you get
- ✓191 lines of source code, ready to paste
- ✓Features
- ✓Source Code
- ✓Usage
- ✓Integration Checklist
- ✓Pitfalls
componentdisplayvideoplayeravkitSwiftUIfullscreen
Features
- First-frame poster: an
AVPlayerLayerpaused at time 0 (no separate thumbnail generation) - Fullscreen uses native
AVKit.VideoPlayer(controls, AirPlay, PiP) - Playback position preserved across open/close cycles
- Silent-switch-proof audio via
AVAudioSession(.playback) onEnterFullscreen/onExitFullscreencallbacks for the host app to manage orientation locking (no UIKit AppDelegate dependency inside the component)
Usage
// Basic usage: bundle resource
SWVideoPlayer(resource: "launch_clip")
.aspectRatio(16 / 9, contentMode: .fit)
// Remote URL
SWVideoPlayer(url: URL(string: "https://example.com/clip.mp4")!)
// With orientation callbacks (host app unlocks landscape for fullscreen)
SWVideoPlayer(
resource: "launch_clip",
onEnterFullscreen: { AppDelegate.setOrientation(.allButUpsideDown) },
onExitFullscreen: { AppDelegate.setOrientation(.portrait) }
)Integration Checklist
- Add video file to app bundle (Xcode → drag into project → "Copy items if needed")
- Verify in Target → Build Phases → Copy Bundle Resources
- If your app is portrait-locked, implement
setOrientationviaUIApplicationDelegateAdaptor+ the callbacks - Add
landscapeLeft/landscapeRightto Target's Supported Interface Orientations to allow fullscreen rotation
Pitfalls
- iOS only: uses
UIViewRepresentable,AVAudioSessionandfullScreenCover; the file is namedSWVideoPlayer+iOS.swiftso cross-platform targets can exclude it from macOS init(resource:)traps on a missing file: it callsfatalErrorif the resource is not in the main bundle; useinit(url:)when the file may be absent- Poster appears once the first frame decodes: the player is created on first appearance, so the card shows only the dimmed background for a moment until the frame at time 0 is ready
- Black frame at t=0: the poster is the frame at exactly 0s; if your clip opens on black, re-export it with a non-black first frame
- Audio session is process-global: calling
.playbackcategory here affects the whole app's audio behavior
More in Components
- Add SheetFreeBottom sheet with text input field, Cancel and Continue buttons, presented as a medium detent sheet
- Alert Toast NotificationFreeGlobal toast-style alert overlay with preset styles (info, success, warning, error) and auto-dismiss
- Bullet Point TextFreeText label with a colored capsule bullet point indicator that accepts any View content via @ViewBuilder
- Cached ImageFreeAsyncImage drop-in with a memory + disk cache, so re-created views show remote images on the first frame instead of flashing the placeholder
- Floating LabelsFreeAnimated floating capsule labels that fade in and out at specified positions around an image
- Gradient DividerFreeHorizontal divider with a center-fade gradient effect (clear to color to clear)