仅将阴影应用于 Swift UI 中的底部、左侧和右侧部分

Question

下面是我的代码：这段代码为按钮的所有部分提供了阴影。我只想给按钮的底部添加阴影

按钮应如下所示：

var body: some View {
        Button(action: {
            self.action(self.title)
            self.hover.toggle()
        }) {
            if title == "x" {
                ZStack {
                    Image(systemName: "delete.left").cornerRadius(5).font(Font.system(size: 28, weight: .medium))
                    .background(Color..secondaryBG)
                    .accentColor(.accentTint)
                }
            } else {
                Text(title).customText(titleColor: .accentTint, fontName: .gothamMedium, fontSize: 28)
                    .background(Color.secondaryBG)
            }
        }
        .withBackground(color: .accentTint)
            .frame(width: 76, height: 76)
            .cornerRadius(5)
            .shadow(color: .numberPadShadowColor, radius: 5, x: 0, y: 1) // This gives shadow to all the parts. I do not want to give shadow to top part of button
    }

Answer 1

您显示的更像是带有硬边的投影:

给它一个坚实的背景并向下移动：

struct ContentView: View {
    var body: some View {
        Button(action: {
            //
        }) {
            Image(systemName: "delete.left")
                .font(Font.system(size: 28, weight: .medium))
                .foregroundColor(.black)
        }
        .frame(width: 76, height: 76)
        .background(Color(uiColor: .lightGray))
        .cornerRadius(5)
        
        .background(
            RoundedRectangle(cornerRadius: 5)
                .offset(x: 0, y: 1)
        )
    }
}