LABEL en SWIFTUI en Español

Usamos Label en SwiftUI para mostrar un icono y un texto en nuestras App. Esta vista fue introducidad en SwiftUI 2.0 y la presentaron en la WWDC de 2020. Su uso es muy simple, y nos permite añadir un icono y un texto en un mismo componente.

Label en código

Para poder usarlo solo tenemos que poner:

struct ContentView: View {
    var body: some View {
        Label("Suscribiros a SwiftBeta",
              systemImage: "hand.thumbsup.fill")
    }
}

En el primer parámetro añadiremos una string, un título que queremos que aparezca en nuestro Label y en el segundo parámetros pondremos el nombre del icono, si os acordáis hace un par de posts hablamos sobre los iconos y SF Symbols 2.0 en SwiftUI, podéis mirar el posts para ver la cantidad de iconos que Apple nos ofrece de forma totalmente gratuita.

Estilos de un Label en SwiftUI

También podemos aplicar distintos estilos

• TitleOnlyLabelStyle: Imagínate que rotas el device y tienes menos espacio, de esta manera ocultarías el icono y priorizarías que apareciera el texto.

struct ContentView: View {
    var body: some View {
        Label("Suscribiros a SwiftBeta",
              systemImage: "hand.thumbsup.fill")
            .labelStyle(TitleOnlyLabelStyle())
    }
}

• IconOnlyLabelStyle: Justo al contrario de TitleOnlyLabelStyle, para priorizar y solo mostrar el icono.

struct ContentView: View {
    var body: some View {
        Label("Suscribiros a SwiftBeta",
              systemImage: "hand.thumbsup.fill")
            .labelStyle(IconOnlyLabelStyle())
    }
}

Como curiosidad, antes te comentaba que Label fue introducido en SwiftUI 2.0, pero antes para poner un icono y un texto poníamos un HStack, lo que pasaba es que si ponías varios HStacks al final los iconos y el texto no estaba alineado.

Antes de acabar, comentarte que podemos crear nuestros propios LabelStyle pero esto sale del scope del video, lo veremos más adelante.

Hasta aquí el post de hoy, gracias por leernos! 🤓
👉👉 SUSCRÍBETE al CANAL de youtube
Si tienes preguntas no dudes en contactar con nosotros a través de Twitter