La vista modal ya tiene compatibilidad integrada con el gesto de deslizar hacia abajo, lo que permite a los usuarios deslizar hacia abajo de forma natural para cerrarla. Sin embargo, es importante tener en cuenta que no todos los usuarios están familiarizados con este gesto, especialmente los recién llegados al iPhone. Por lo tanto, sería beneficioso proporcionar una forma alternativa de cerrar la vista modal, como un botón Cerrar. En la siguiente imagen puedes ver un ejemplo del botón que vamos a crear, que está posicionado en la esquina superior derecha:
Podemos hacer un cerrar la vista modal usando la variable de entorno dismiss. Para conseguir esto tenemos que declarar la variable:
@Environment(\.dismiss) var dismissPara crear el botón de cerrar podemos adjuntar el modifier overlay a la scroll view de la siguiente manera:
.overlay(
HStack{
Spacer()
VStack {
Button {
dismiss()
} label: {
Image(systemName: "chevron.down.circle.fill")
.font(.largeTitle)
.foregroundStyle(.white)
}
.padding(.trailing, 20)
.padding(.top, 40)
Spacer()
}
}
)El botón se superpondrá sobre la vista de desplazamiento, lo que creará un efecto flotante. Incluso si se desplaza hacia abajo en la vista, el botón permanecerá fijo en la misma posición. Para colocar el botón en la esquina superior derecha, podemos utilizar una combinación de HStack, VStack y Spacer. Para cerrar la vista, simplemente llama a la función dismiss().
