How to apply a blur to shadow in SwiftUI-CodePudding

So I am building a custom component and the figma file has the following parameters.

Rectangle Background Drop Shadow 1: Offset X = 0px, Y = 4px
Rectangle Background Drop Shadow 1: Blur = 8px, Spread = -1px
Rectangle Background Drop Shadow Color 1: 16% #000000

I am having a hard time figuring out how to add the blur and the spread. This is what I have so far.

I have the drop shadow working, but it is harsh without the blur and spread

.background(Color.newPrimary
                            .shadow(color: .black, radius: 6, x: 0, y: 4)
                            )

CodePudding user response：

Try adding a second background. You can't blur a shadow directly. Blur will act on the whole view, as I am sure you found out. If you don't want to blur your background, add another background of the shadow color, add the shadow and then blur. I through an .opacity() modifier in there as well to further tweak the look.

    Text("Hello, World!")
        .padding()
        .background(Color.red)
        .background(Color.black
                        .opacity(0.5)
                        .shadow(color: .black, radius: 6, x: 0, y: 4)
                        .blur(radius: 8, opaque: false)
        )