SwiftUI shadow - spread parameter

Is there any way how to create shadow in SwiftUI with the spread parameter (means of how much greater the shadow should be than the original view)? I've tried to use custom implementation of shadow using background Color with blur, but it resulted in performance issues.

Code Block swift
content
    .background(GeometryReader { geometry in
        Rectangle()
            .fill(color)
            .frame(width: geometry.size.width + spread,
                         height: geometry.size.height + spread)
            .cornerRadius(isCircle ? (geometry.size.width + spread) / 2 : cornerRadius)
            .padding([.top, .leading], -spread / 2)
            .padding(.leading, x)
            .padding(.top, y)
            .blur(radius: blur)
    })


I haven't found any other resources. I think that shadowPath would be helpful using UIKit, but I don't know any way ho to achieve it using SwiftUI.

Thanks for any advice!
Up vote post of elSnupator Down vote post of elSnupator
2.1k views
Posted by
elSnupator
Reply
Add a Comment

Replies

Not sure if this is what your after, but it might help ...

Code Block 
struct ContentView: View {
  var body: some View {
    VStack(spacing: 100) {
      ShadowView(color: .red)
        .shadow(color: .black, radius: 10, x: 0.0, y: -5.0)
      ShadowView(color: .green)
        .shadow(color: .black, radius: 10, x: 0.0, y: 0.0)
        .shadow(color: .black, radius: 10, x: 0.0, y: 0.0)
      ShadowView(color: .blue)
        .shadow(color: .black, radius: 30, x: 0.0, y: 20.0)
    }
  }
}
struct ShadowView: View {
  var color: Color
  var body: some View {
    RoundedRectangle(cornerRadius: 25.0)
      .fill(color)
      .frame(width: 200, height: 100)
  }
}


Posted by
OnionSource
Up vote reply of OnionSource Down vote reply of OnionSource
Add a Comment

i got a solution using blur, offset and padding

https://gist.github.com/alexis-ag/5565bda1e7a1cd5b740d12cc2e09e2a6 here is my gist

{YOUR_VIEW}.dropShadow(type: .sameView(opacity: 1), radius: 6, offset: .init(x: 0, y: 30), spread: .init(width: -20, height: -20))

Posted by
alexis-ag
Up vote reply of alexis-ag Down vote reply of alexis-ag
Add a Comment