Uplift iOS Interview
"Uplift iOS Interview" is a comprehensive guide to help aspiring iOS developers soar to new heights in their careers. This book is an indispensable tool for anyone looking to crack the iOS interview and impress their future employers with their technical prowess. With in-depth coverage of Swift, AutoLayout, SwiftUI, Multithreading, Memory management so on and so forth, this book is a treasure trove of knowledge for anyone looking to uplift their iOS development career.
Glassmorphism is a very trending UI design paradigm nowadays. We can use the semi-transparent blurry background to give more focus on the foreground content. SwiftUI provides .blur()
modifier to create the background blur but it has very limited functionality compared to UIVisualEffectView
.
struct ContentView: View { var body: some View { ZStack { Image("background") .resizable() .scaledToFill() .edgesIgnoringSafeArea(.all) .blur(radius: 5) Text("Welcome to München") .font(.title) .padding(30.0) .background(Color.orange) .opacity(0.8) .cornerRadius(20) } } }

Get ahead of the competition and ace your next iOS interview with expert-curated resources. Check out the collection of SwiftUI and Swift interview questions and answers, behavioral interview tips, and the popular custom layout contents. Plus, go through the new section for Engineering Manager to help you excel in your career!
Join my free Newsletter 🚀
SwiftUI does not provide any built-in visual effects view or something related to background blur. But we can use UIKit in SwiftUI using UIViewRepresentable
. To implement a background blur effect in SwiftUI, I am using the Apple-provided VisualEffectBlur.swift
file(Fruta) in the article. UIVisualEffectView
can support multiple styles from ultra-thin to thick.
.systemUltraThinMaterial
.systemThinMaterial
.systemMaterial
.systemThickMaterial
.systemChromeMaterial
You can simply pass the style using VisualEffectBlur(blurStyle: .systemThinMaterial)
. The default blur style is .systemMaterial
.
struct ContentView: View { var body: some View { ZStack { Image("background") .resizable() .scaledToFill() .edgesIgnoringSafeArea(.all) VisualEffectBlur(blurStyle: .systemThinMaterialDark) .ignoresSafeArea() Text("Welcome to München") .font(.title) .padding(30.0) .background(Color.orange) .opacity(0.8) .cornerRadius(20) } } }

VisualEffectBlur.swift
/* The iOS implementation of a UIVisualEffectView's blur and vibrancy. */ import SwiftUI // MARK: - VisualEffectBlur struct VisualEffectBlur<Content: View>: View { var blurStyle: UIBlurEffect.Style var vibrancyStyle: UIVibrancyEffectStyle? var content: Content init(blurStyle: UIBlurEffect.Style = .systemMaterial, vibrancyStyle: UIVibrancyEffectStyle? = nil, @ViewBuilder content: () -> Content) { self.blurStyle = blurStyle self.vibrancyStyle = vibrancyStyle self.content = content() } var body: some View { Representable(blurStyle: blurStyle, vibrancyStyle: vibrancyStyle, content: ZStack { content }) .accessibility(hidden: Content.self == EmptyView.self) } } // MARK: - Representable extension VisualEffectBlur { struct Representable<Content: View>: UIViewRepresentable { var blurStyle: UIBlurEffect.Style var vibrancyStyle: UIVibrancyEffectStyle? var content: Content func makeUIView(context: Context) -> UIVisualEffectView { context.coordinator.blurView } func updateUIView(_ view: UIVisualEffectView, context: Context) { context.coordinator.update(content: content, blurStyle: blurStyle, vibrancyStyle: vibrancyStyle) } func makeCoordinator() -> Coordinator { Coordinator(content: content) } } } // MARK: - Coordinator extension VisualEffectBlur.Representable { class Coordinator { let blurView = UIVisualEffectView() let vibrancyView = UIVisualEffectView() let hostingController: UIHostingController<Content> init(content: Content) { hostingController = UIHostingController(rootView: content) hostingController.view.autoresizingMask = [.flexibleWidth, .flexibleHeight] hostingController.view.backgroundColor = nil blurView.contentView.addSubview(vibrancyView) blurView.autoresizingMask = [.flexibleWidth, .flexibleHeight] vibrancyView.contentView.addSubview(hostingController.view) vibrancyView.autoresizingMask = [.flexibleWidth, .flexibleHeight] } func update(content: Content, blurStyle: UIBlurEffect.Style, vibrancyStyle: UIVibrancyEffectStyle?) { hostingController.rootView = content let blurEffect = UIBlurEffect(style: blurStyle) blurView.effect = blurEffect if let vibrancyStyle = vibrancyStyle { vibrancyView.effect = UIVibrancyEffect(blurEffect: blurEffect, style: vibrancyStyle) } else { vibrancyView.effect = nil } hostingController.view.setNeedsDisplay() } } } // MARK: - Content-less Initializer extension VisualEffectBlur where Content == EmptyView { init(blurStyle: UIBlurEffect.Style = .systemMaterial) { self.init( blurStyle: blurStyle, vibrancyStyle: nil) { EmptyView() } } } // MARK: - Previews struct VisualEffectBlur_Previews: PreviewProvider { static var previews: some View { ZStack { LinearGradient( gradient: Gradient(colors: [.red, .blue]), startPoint: .topLeading, endPoint: .bottomTrailing ) VisualEffectBlur(blurStyle: .systemUltraThinMaterial, vibrancyStyle: .fill) { Text("Hello World!") .frame(width: 200, height: 100) } } .previewLayout(.sizeThatFits) } }
Rev Up Your iOS Skills: Take a Dynamic Learning Journey

iOS Career Boost is the ultimate learning journey to elevate your iOS development career through a dynamic blend of visual learning, handy cheat sheets, coding practice materials, and expertly curated tips and tricks
Get Ready to Shine: Mastering the iOS Interview
- Uplift iOS Interview - A Comprehensive Guide to iOS Interview
- Xcode Cheat Sheet for Swift
- Xcode Cheat Sheet for SwiftUI
Enjoying the articles? Get the inside scoop by subscribing to my newsletter.
Get access to exclusive iOS development tips, tricks, and insights when you subscribe to my newsletter. You'll also receive links to new articles, app development ideas, and an interview preparation mini book. Your email address will only be used for the purpose of sending the newsletter and will not be shared with third parties or advertisers. Rest assured that we value your privacy and will not spam your inbox.
Connect with me on
Twitter and LinkedIn and don't hesitate to reach out with any questions about this post. Thank you for reading.