Como personalizar el botón Back en SwiftUI

En lugar de usar las API de UIKit para personalizar el botón Volver o Atrás, un enfoque alternativo es ocultar el botón Atrás predeterminado y crear nuestro propio botón Atrás en SwiftUI. Para ocultar el botón Atrás, puedes usar el modifier .navigationBarBackButtonHidden y establecer su valor en verdadero. Aquí tienes un ejemplo de cómo puedes hacerlo en la vista de detalles:

.navigationBarBackButtonHidden(true)

SwiftUI también ofrece un modifier llamado toolbar para crear tus propios elementos de la barra de navegación.

Aquí puedes ver un ejemplo de como podemos usarlo:

.toolbar {
            
            ToolbarItem(placement: .navigationBarLeading) {
                
                Button{
                    
                    dismiss()
                    
                } label: {
                    
                    Text("\(Image(systemName: "chevron.left")) Custom Back Button")
                        .foregroundColor(.black)
                    
                    
                }
                    
                    
                    
                }
                
                
            }

En el cierre del modifier .toolbar, creamos un objeto ToolbarItem con la ubicación establecida en .navigationBarLeading. Esto especifica que el botón debe ubicarse en el borde principal de la barra de navegación.

Para poder poner en acción este código tenemos que declarar la clave .dismiss de la siguiente manera:

@Environment(\.dismiss) var dismiss

El resultado en XCode es el siguiente:

SwiftUI ofrece una amplia gama de valores de entorno integrados. Para descartar la vista actual y volver a la vista anterior, podemos recuperar el valor del entorno utilizando la clave .dismiss. Luego, podemos llamar a la función dismiss() para descartar la vista actual. Ten en cuenta que la clave de entorno .dismiss solo está disponible en iOS 15 o posterior. Si necesitas compatibilidad con una versión anterior de iOS, puedes utilizar la clave de entorno .presentationMode:

@Environment(\.presentationMode) var presentationMode

Entonces puedes llamar a la función dismiss del presentation mode de esta manera:

presentationMode.wrappedValue.dismiss()