SwiftUI: componente Divider

Qué es Divider

El componente Divider permite añadir una línea divisoria entre contenidos. Es un componente muy útil, ya que dependiendo del contenedor en el que se encuentre se posicionará de forma vertical (como en un HStack) u horizontal (como en un VStack). No tiene ninguna equivalencia con ningún componente de UIKit.

Aquí podéis consultar la documentación oficial

Su inicialización se realiza de la siguiente forma:

Divider()

Tal y como se ve, es una inicialización simple y no requiere de ningún parámetro. Lo añadiremos en medio de los componentes donde queramos añadir la línea divisoria.

Por defecto, el componente ocupa todo el espacio disponible.

struct ContentView: View {
    var body: some View {
        Group {
            VStack(spacing: 15) {
                HStack(spacing: 15) {
                    Text("Hello")
                    Divider()
                    Text("World")
                }
                .frame(height: 50)
                Divider()
                    .background(Color.orange)
                Text("Bye")
                Divider()
                    .frame(width: 100)
                    .background(Color.red)
                Text("World")
            }
        }
    }
}

Modificadores comunes para Divider

El componente Divider comparte los mismos métodos de personalización que el componente View, y pueden ser consultados en el siguiente enlace.

Ejemplo

Puedes encontrar este ejemplo en https://github.com/SDOSLabs/SwiftUI-Test bajo el apartado Divider

Rafael Fernández,
iOS Tech Lider