CODEWITHSUNDEEP
swiftui
Steven-Carrot
Steven-Carrot

Reputation: 3061

How to achieve ios blur background with roundedrectangle()?

I have this code:

import SwiftUI
 struct MyBackGround: View {
    var body: some View {
        ZStack() {
            Color.pink.ignoresSafeArea()
            RoundedRectangle(cornerRadius: 20).background(Color.white.opacity(0.5))
                .frame(width: 220, height: 100)
        }
    }
}

And this image: blur image back ground

I want to achieve the similar look of iOS blur background, but it did not work.

Upvotes: 0

Views: 347

Answers (1)

Steven-Carrot
Steven-Carrot

Reputation: 3061

You can achieve this with a simpler code. Your code does not work because your RoundedRectangle contains black as its foreground color originally.

import SwiftUI

struct ContentView: View {

var body: some View {
    ZStack {
        Color.pink.ignoresSafeArea(.all)
        RoundedRectangle(cornerRadius: 20)
            .fill(.ultraThinMaterial)
            .frame(width: 200, height: 200)
    }
  }

}

Upvotes: 1

Related Questions