how do i animate glass items in and out? give me code sample in swiftui
Asked on 06/26/2025
1 search
To animate glass items in and out using SwiftUI, you can leverage the new Liquid Glass effects introduced in the latest design updates. Here's a basic example of how you might animate a glass effect in SwiftUI:
import SwiftUI
struct GlassView: View {
@State private var isVisible = false
var body: some View {
VStack {
if isVisible {
RoundedRectangle(cornerRadius: 25)
.fill(Color.white.opacity(0.3))
.frame(width: 200, height: 200)
.transition(.opacity)
.animation(.easeInOut(duration: 0.5), value: isVisible)
}
Button(action: {
withAnimation {
isVisible.toggle()
}
}) {
Text("Toggle Glass")
}
.padding()
}
}
}
struct ContentView: View {
var body: some View {
GlassView()
}
}
In this example, a RoundedRectangle
is used to simulate a glass effect. The transition(.opacity)
modifier is applied to animate the appearance and disappearance of the glass view. The withAnimation
block is used to toggle the visibility of the glass view with a smooth animation.
For more advanced animations and effects, you can explore the session Enhance your UI animations and transitions (08:10) which covers SwiftUI animations in detail.

Build a UIKit app with the new design
Update your UIKit app to take full advantage of the new design system. We’ll dive into key changes to tab views, split views, bars, presentations, search, and controls, and show you how to use Liquid Glass in your custom UI. To get the most out of this video, we recommend first watching “Get to know the new design system” for general design guidance.

Enhance your UI animations and transitions
Explore how to adopt the zoom transition in navigation and presentations to increase the sense of continuity in your app, and learn how to animate UIKit views with SwiftUI animations to make it easier to build animations that feel continuous.

Build a SwiftUI app with the new design
Explore the ways Liquid Glass transforms the look and feel of your app. Discover how this stunning new material enhances toolbars, controls, and app structures across platforms, providing delightful interactions and seamlessly integrating your app with the system. Learn how to adopt new APIs that can help you make the most of Liquid Glass.