Estoy tratando de darle una sombra a Button usando el siguiente código.
Código:
Button(action: {
}) {
Text("SIGN IN")
.font(.system(size: 17))
.fontWeight(.bold)
.foregroundColor(.green)
.frame(minWidth: 0, maxWidth:.infinity)
.padding()
.background(Color.white)
.clipped()
.overlay(
RoundedRectangle(cornerRadius: 25)
.stroke(lineWidth: 1)
.foregroundColor(.white)
)
}
.shadow(color:.gray, radius: 2, x: 0, y: 2)
Producción:

En la imagen de arriba puedes ver que la sombra no es adecuada.
¿Cómo puedo lograr lo siguiente?

Solución del problema
yo lo haría así
Nota: el último.padding no es importante, dependiendo de dónde y cómo se colocará el botón, aquí es solo para demostración.

Button(action: {
}) {
Text("SIGN IN")
.font(.system(size: 17))
.fontWeight(.bold)
.foregroundColor(.green)
.frame(minWidth: 0, maxWidth:.infinity)
.padding()
.background(
RoundedRectangle(cornerRadius: 25)
.fill(Color.white)
.shadow(color:.gray, radius: 2, x: 0, y: 2)
)
.padding()
}
respaldo
No hay comentarios:
Publicar un comentario