¿Cómo crear UILabel mediante programación usando Swift?


115

¿Cómo creo un UILabel programa usando Swift en Xcode 6?

Comencé con una nueva "Aplicación de vista única" en Xcode 6 y seleccioné Swift para este proyecto. Tengo mis archivos AppDelegate.swifty ViewController.swiftno estoy seguro de qué hacer desde aquí.


1
Le sugiero que comience su estudio aquí: documentación Swift y trabaje hasta llegar a los tutoriales de Raywenderlich
Prashant

Respuestas:


252
override func viewDidLoad()
{
  super.viewDidLoad()
  var label = UILabel(frame: CGRectMake(0, 0, 200, 21))
  label.center = CGPointMake(160, 284)
  label.textAlignment = NSTextAlignment.Center
  label.text = "I'm a test label"
  self.view.addSubview(label)
}  

Actualización Swift 3.0+:

let label = UILabel(frame: CGRect(x: 0, y: 0, width: 200, height: 21))
label.center = CGPoint(x: 160, y: 285)
label.textAlignment = .center
label.text = "I'm a test label"
self.view.addSubview(label)

2
No es necesario declarar esto implícitamente como UILabel, se infiere de UILabel ()
CW0007007

5
No debe codificar de forma rígida el marco de las etiquetas: ¿qué sucede cuando el texto cambia o el texto se localiza y cambia el número de caracteres?
Zorayr

También puede consultar este blog que describe cómo agregar UITextField, UITextView y UILabel mediante programación: webindream.com/how-to-change-ui-elements-programmatic
farhad rubel

@iSuresh ¿cómo sabe que CGPoint (x: 160, y: 285) será el centro del modelo que están usando?
Dave G

2
@rommex Para hacerlo, llame a label.sizeToFit () .
Josh Wolff

27

Aquí está el código correcto para Swift 3, con comentarios con fines instructivos:

override func viewDidLoad()
{
    super.viewDidLoad()

    // CGRectMake has been deprecated - and should be let, not var
    let label = UILabel(frame: CGRect(x: 0, y: 0, width: 200, height: 21))

    // you will probably want to set the font (remember to use Dynamic Type!)
    label.font = UIFont.preferredFont(forTextStyle: .footnote)

    // and set the text color too - remember good contrast
    label.textColor = .black

    // may not be necessary (e.g., if the width & height match the superview)
    // if you do need to center, CGPointMake has been deprecated, so use this
    label.center = CGPoint(x: 160, y: 284)

    // this changed in Swift 3 (much better, no?)
    label.textAlignment = .center

    label.text = "I am a test label"

    self.view.addSubview(label)
}

Gracias Gourav - espero que haya ayudado
Gene Loparco

14

Solo para agregar a las ya excelentes respuestas, es posible que desee agregar varias etiquetas en su proyecto, por lo que hacer todo esto (establecer el tamaño, el estilo, etc.) será una molestia. Para resolver esto, puede crear una clase UILabel separada.

  import UIKit

  class MyLabel: UILabel {

    required init?(coder aDecoder: NSCoder) {
        super.init(coder: aDecoder)
        initializeLabel()
    }

    override init(frame: CGRect) {
        super.init(frame: frame)
        initializeLabel()
    }

    func initializeLabel() {

        self.textAlignment = .left
        self.font = UIFont(name: "Halvetica", size: 17)
        self.textColor = UIColor.white

    }

}

Para usarlo, haga lo siguiente

import UIKit

class ViewController: UIViewController {

     var myLabel: MyLabel()

     override func viewDidLoad() {
          super.viewDidLoad()

          myLabel = MyLabel(frame: CGRect(x: self.view.frame.size.width / 2, y: self.view.frame.size.height / 2, width: 100, height: 20))
          self.view.addSubView(myLabel)
     }


}

¡Justo lo que estaba buscando!
madprogramer

Gracias tío, tengo una pregunta, si quiero pasar una cuerda al self.textinterior de una clase para iniciar así:myLabel = MyLabel(string: "text")
Daniel Beltrami

Acabo de descubrir cómo, usando su clase y llamando así:myLabel.text = "text"
Daniel Beltrami

11

Swift 4.X y Xcode 10

let lbl = UILabel(frame: CGRect(x: 10, y: 50, width: 230, height: 21))
lbl.textAlignment = .center //For center alignment
lbl.text = "This is my label fdsjhfg sjdg dfgdfgdfjgdjfhg jdfjgdfgdf end..."
lbl.textColor = .white
lbl.backgroundColor = .lightGray//If required
lbl.font = UIFont.systemFont(ofSize: 17)

//To display multiple lines in label
lbl.numberOfLines = 0 //If you want to display only 2 lines replace 0(Zero) with 2.
lbl.lineBreakMode = .byWordWrapping //Word Wrap
// OR
lbl.lineBreakMode = .byCharWrapping //Charactor Wrap

lbl.sizeToFit()//If required
yourView.addSubview(lbl)

Si tiene varias etiquetas en su clase, use la extensión para agregar propiedades.

//Label 1
let lbl1 = UILabel(frame: CGRect(x: 10, y: 50, width: 230, height: 21))
lbl1.text = "This is my label fdsjhfg sjdg dfgdfgdfjgdjfhg jdfjgdfgdf end..."
lbl1.myLabel()//Call this function from extension to all your labels
view.addSubview(lbl1)

//Label 2
let lbl2 = UILabel(frame: CGRect(x: 10, y: 150, width: 230, height: 21))
lbl2.text = "This is my label fdsjhfg sjdg dfgdfgdfjgdjfhg jdfjgdfgdf end..."
lbl2.myLabel()//Call this function from extension to all your labels
view.addSubview(lbl2)

extension UILabel {
    func myLabel() {
        textAlignment = .center
        textColor = .white
        backgroundColor = .lightGray
        font = UIFont.systemFont(ofSize: 17)
        numberOfLines = 0
        lineBreakMode = .byCharWrapping
        sizeToFit()
    }
}

8

Puede crear una etiqueta con el código siguiente. Actualizado.

let yourLabel: UILabel = UILabel()
yourLabel.frame = CGRect(x: 50, y: 150, width: 200, height: 21)
yourLabel.backgroundColor = UIColor.orange
yourLabel.textColor = UIColor.black
yourLabel.textAlignment = NSTextAlignment.center
yourLabel.text = "test label"
self.view.addSubview(yourLabel)

5

Otro código swift3

let myLabel = UILabel()
    myLabel.frame = CGRect(x: 0, y: 0, width: 100, height: 100)
    myLabel.center = CGPoint(x: 0, y: 0)
    myLabel.textAlignment = .center
    myLabel.text = "myLabel!!!!!"
    self.view.addSubview(myLabel)

5

Una alternativa que usa un cierre para separar el código en algo un poco más ordenado usando Swift 4:

class theViewController: UIViewController {

    /** Create the UILabel */
    var theLabel: UILabel = {
        let label = UILabel()
        label.lineBreakMode = .byWordWrapping
        label.textColor = UIColor.white
        label.textAlignment = .left
        label.numberOfLines = 3
        label.font = UIFont(name: "Helvetica-Bold", size: 22)
        return label
    }()

    override func viewDidLoad() {
        /** Add theLabel to the ViewControllers view */
        view.addSubview(theLabel)
    }

    override func viewDidLayoutSubviews() {
        /* Set the frame when the layout is changed */
        theLabel.frame = CGRect(x: 0,
                                y: 0,
                                width: view.frame.width - 30,
                                height: 24)
    }
}

Como nota, los atributos de theLabeltodavía se pueden cambiar siempre que se utilicen funciones en el VC. Solo está estableciendo varios valores predeterminados dentro del cierre y minimizando el desorden en funciones comoviewDidLoad()


Hermosa técnica ... pero no me funciona en Xcode 9.4.1 ... a menos que especifique el marco en algún lugar del valor calculado, ya sea en el constructor ( UILabel(frame:)) o en otro lugar del bloque ( label.frame=). Cualquier ajuste posterior del marco (p. Ej., En viewDidLayoutSubviews()) provocó que la etiqueta no apareciera.
Glenn

5

Cree una UILabelvista fuera de la viewDidLoadclase y luego agregue esa vista a su vista principal en el viewDidLoadmétodo.

lazy var myLabel: UILabel = {


    let label = UILabel()
    label.translatesAutoresizingMaskIntoConstraints = false
    label.text = "This is label view."
    label.font = UIFont.systemFont(ofSize: 12)
    return label
}()

Y luego agrega eso viewenviewDidLoad()

override func viewDidLoad() {
    super.viewDidLoad()
    view.addSubview(myLabel)

    // Set its constraint to display it on screen
    myLabel.widthAnchor.constraint(equalToConstant:  200).isActive = true
    myLabel.centerXAnchor.constraint(equalTo: view.centerXAnchor).isActive = true
    myLabel.centerYAnchor.constraint(equalTo: view.centerYAnchor).isActive = true
}

@I Love Coding, ¿podría explicarnos su código? [lazy var myLabel: UILabel = {} ()]. Será de mucha ayuda. Gracias ...
iOS

1
@iOS Cuando crea una variable, ya lazy var variable_name = ""que no consumirá su memoria a menos que su aplicación llame a esa variable. Si esa propiedad no se usa, nunca se ejecutará.
Me encanta la codificación

Luego crearemos todas las variables como perezosas en nuestro proyecto para un mejor rendimiento. Estoy en lo cierto?
iOS

@iOS, ¡sí! Mejor use ese tipo de variable en su aplicación para un mejor rendimiento. Además, también debería poder conocer Thread para un mejor rendimiento.
Me encanta la codificación

3

Crear etiqueta en swift 4

 let label = UILabel(frame: CGRect(x: self.view.frame.origin.x, y: self.view.frame.origin.y, width: self.view.frame.size.width, height: 50))
    label.textAlignment = .center
    label.text = "Hello this my label"

    //To set the color
    label.backgroundColor = UIColor.white
    label.textColor = UIColor.black

    //To set the font Dynamic
    label.font = UIFont(name: "Helvetica-Regular", size: 20.0)

    //To set the system font
    label.font = UIFont.systemFont(ofSize: 20.0)

    //To display multiple lines
    label.numberOfLines = 0
    label.lineBreakMode = .byWordWrapping //Wrap the word of label
    label.lineBreakMode = .byCharWrapping //Wrap the charactor of label

    label.sizeToFit()
    self.view.addSubview(label)

1

Swift 4.2 y Xcode 10. En algún lugar de ViewController:

private lazy var debugInfoLabel: UILabel = {
    let label = UILabel()
    label.textColor = .white
    label.translatesAutoresizingMaskIntoConstraints = false
    yourView.addSubview(label)
    NSLayoutConstraint.activate([
        label.centerXAnchor.constraint(equalTo: suggestionView.centerXAnchor),
        label.centerYAnchor.constraint(equalTo: suggestionView.centerYAnchor, constant: -100),
        label.widthAnchor.constraint(equalToConstant: 120),
        label.heightAnchor.constraint(equalToConstant: 50)])
    return label
}()

...

Utilizando:

debugInfoLabel.text = debugInfo

0
let label = UILabel(frame: CGRect(x: 0, y: 0, width: 200, height: 21))
label.center = CGPoint(x: 160, y: 285)
label.textAlignment = .center
label.text = "My label"
self.view.addSubview(label)

Pruebe el código anterior en ViewDidLoad


0

Swift 4.2 y Xcode 10 Inicializan la etiqueta antes de viewDidLoad.

lazy var topLeftLabel: UILabel = {
    let label = UILabel()
    label.translatesAutoresizingMaskIntoConstraints = false
    label.text = "TopLeft"
    return label
}()

En viewDidLoad agregue una etiqueta a la vista y aplique restricciones.

override func viewDidLoad() {
    super.viewDidLoad()
    view.addSubview(topLeftLabel)
    topLeftLabel.leadingAnchor.constraint(equalTo: view.leadingAnchor, constant: 10).isActive = true
    topLeftLabel.topAnchor.constraint(equalTo: view.safeAreaLayoutGuide.topAnchor, constant: 10).isActive = true
}
Al usar nuestro sitio, usted reconoce que ha leído y comprende nuestra Política de Cookies y Política de Privacidad.
Licensed under cc by-sa 3.0 with attribution required.