在SwiftUI中实现盒阴影

我试图在SwiftUI中实现以下css代码

background: #FFFFFF;
box-shadow: 0px 10px 20px rgba(223, 227, 240, 0.2);
border-radius: 27.5px;

它应该是这样的（按钮下方几乎看不到阴影）：

以下是我目前正在试验的代码：

import SwiftUI

struct RegisterView: View {
    var body: some View {
        VStack(spacing: 0) {

            HStack(alignment: .top) {
                Text("Register")
                    .font(.custom("NotoSans-Regular", size: 24))
                    .fontWeight(.bold)
                    .foregroundColor(Color.tertiaryTitleColor)
            }
            .frame(width: 299, height: 39)
            .padding(.top, 78)
            
            HStack {
                BroviderButton(imageName: "googleLogo")
                BroviderButton(imageName: "facebookLogo")
            }
            .padding(.top, 47)

            Spacer()
        }
        .frame(maxHeight: .infinity)
        .frame(maxWidth: .infinity)
        .background(Color.loginBackgroundColor)
        .ignoresSafeArea()
    }
}

struct RegisterView_Previews: PreviewProvider {
    static var previews: some View {
        RegisterView()
    }
}


struct BroviderButton: View {
    var imageName: String
    var body: some View {
        ZStack {
            RoundedRectangle(cornerRadius: 27.5)
                .stroke(Color.dropShadowColor,lineWidth: 1)
                .frame(width: 133, height: 56, alignment: .center)
                .shadow(color: .black, radius: 2, x: 1, y: 2)
            VStack {

                VStack {
                    Image(imageName)
                        .resizable()
                        .scaledToFit()
                }
                .frame(height: 28, alignment: .center)
            }
            .frame(width: 133, height: 56, alignment: .center)
            .foregroundColor(.blue)
            .background(Color.loginButtonBackgroundColor)
            .cornerRadius(27.5)
            .opacity(1)
                        
        }
    }
}

下面是atm机的外观：

我不知道如何将x:10和y:20翻译成SwiftUI代码，也找不到模糊阴影的方法（20%）。欢迎提出任何意见

---

我也不明白为什么在我把VStack放在它上面之后，RoundedRectangle仍然可见。。我想它会隐藏按钮下方的阴影以外的所有内容。

据我所知，这里有两个问题需要解决（当然我没有您的颜色和图像）：

ZStack{
圆角转角（拐角半径：27.5）
.fill（Color.dropShadowColor）//
ZStack {
    RoundedRectangle(cornerRadius: 27.5)
        .fill(Color.dropShadowColor)                // << here fill, not stroke !!
        .frame(width: 133, height: 56, alignment: .center)
        .shadow(color: .black, radius: 2, x: 0, y: 2)  // << no offset by x
    VStack {

        VStack {
            Image(imageName)
                .resizable()
                .scaledToFit()
        }
        .frame(height: 28, alignment: .center)
    }
    .frame(width: 133, height: 56, alignment: .center)
    .foregroundColor(.blue)
    .background(Color.loginButtonBackgroundColor)    // << should be opaque color !!
    .cornerRadius(27.5)
    .opacity(1)
                
}