How do I make a translucent window in SwiftUI?
Asked on 08/04/2024
1 search
To make a translucent window in SwiftUI, you can use the containerBackground
modifier to replace the window background color with a material that gives it a translucent effect. Here's an example from the session "Tailor macOS windows with SwiftUI":
import SwiftUI
struct ContentView: View {
var body: some View {
Text("Hello, World!")
.frame(width: 300, height: 200)
.background(Material.ultraThin)
}
}
@main
struct MyApp: App {
var body: some Scene {
WindowGroup {
ContentView()
.windowStyle(.plain)
.windowLevel(.floating)
.windowBackground(Material.ultraThin)
}
}
}
In this example, the Material.ultraThin
is used to give the window a frosted glass effect, allowing the color from the desktop to shine through. This is demonstrated in the session Tailor macOS windows with SwiftUI.
For more details on customizing macOS windows with SwiftUI, you can refer to the session "Tailor macOS windows with SwiftUI" which covers various aspects of window customization, including styling window toolbars, refining window behaviors, and adjusting window placement.

Tailor macOS windows with SwiftUI
Make your windows feel tailor-made for macOS. Fine-tune your app’s windows for focused purposes, ease of use, and to express functionality. Use SwiftUI to style window toolbars and backgrounds. Arrange your windows with precision, and make smart decisions about restoration and minimization.

Create custom visual effects with SwiftUI
Discover how to create stunning visual effects in SwiftUI. Learn to build unique scroll effects, rich color treatments, and custom transitions. We’ll also explore advanced graphic effects using Metal shaders and custom text rendering.

What’s new in SwiftUI
Learn how you can use SwiftUI to build great apps for any Apple platform. Explore a fresh new look and feel for tabs and documents on iPadOS. Improve your window management with new windowing APIs, and gain more control over immersive spaces and volumes in your visionOS apps. We’ll also take you through other exciting refinements that help you make expressive charts, customize and layout text, and so much more.