La hora de poner en varias líneas de la etiqueta (con salto de línea establece en Word Wrap) en una pila de vista, la etiqueta inmediatamente pierde el salto de línea y muestra el texto de la etiqueta en una línea en su lugar.

¿Por qué sucede esto y cómo hace uno para preservar multilínea etiqueta dentro de una pila de vista?

  • ¿Establece el número de líneas a 0?
  • Encontraste una respuesta?
InformationsquelleAutor Boon | 2015-12-20

18 Comentarios

  1. 174

    La respuesta correcta es: https://stackoverflow.com/a/43110590/566360

    1. Incrustar el UILabel dentro de un UIView (Editor -> Incrustar En -> Ver)
      1. Usar restricciones para adaptarse a la UILabel a la UIView (por ejemplo, espacio final, la parte superior del espacio, y el espacio para superview restricciones)

    La UIStackView extenderé la UIView para que se ajuste correctamente, y el UIView restringirá la UILabel a varias líneas.

    • Impresionante! éste funciona de forma Horizontal StackView
    • Es tan estúpido, pero funciona ! Gracias hombre ! Tal vez algún día Apple va a lanzar algo que no es la mitad roto en su SDK…
    • Para la configuración con la que estaba trabajando, este trabajó como un encanto. Estoy de acuerdo, tonto. Pero funcionó. De pasar. 🙂
    • ¡Oh hombre! Eres un salvador! Yo había estado en ella durante horas 🙂 Recuerda que también establece las líneas a 0 en los Atributos del Inspector, faltaba eso.
    • He tenido la buena suerte de alternar el hidden de la propiedad en el UIStackView en cuestión. Parece forzar una actualización de la distribución de los atributos.
    • esta es la solución, la solución correcta es aquí stackoverflow.com/a/43110590/566360
    • Gracias. La incrustación de la UILabel en un UIView + ajuste de la UIStackView's alineamiento horizontal centro me puso sobre la línea de meta
    • Fue suficiente para mí, sólo para cambiar la alineación horizontal del centro. No UIView travesuras necesario.
    • Esto funcionó muy bien para mí, con un desnivel UIStackView contiene 2 multilínea etiquetas y 2 imágenes.
    • Me encanta usted, Im perder algo de tiempo en este asunto, y esto realmente solucionar mi problema con UILabel y texto en la parte superior izquierda.
    • Usted no debe establecer cualquiera de UIStackView vista de las limitaciones para la alineación como: líder de, detrás de, arriba, abajo. El UIStackView es responsable de que ya (se trata con dispuestas sub vistas a la alineación y espaciado). Si desea más control fino de la posición, añadir su UILabel a un muñeco transparente UIView y, a continuación, establecer el posicionamiento hay restricciones.
    • esto es exactamente lo que se dijo en esta respuesta. pero la respuesta correcta es: stackoverflow.com/a/43110590/566360
    • 3+ años más tarde esta respuesta guardado un día! ¿Por qué oh por qué Apple no señalar en su documentación?! Gracias, @Andy!

  2. 102

    Para una horizontal de la pila de vista que tiene un UILabel como uno de sus puntos de vista, en el Interface Builder en primer lugar establecer label.numberOfLines = 0. Esto debería permitir que la etiqueta tenga más de 1 línea. Esto, en principio, no funcionó para mí cuando la pila de vista había stackView.alignment = .fill. Para hacerlo funcionar simplemente un conjunto de stackView.alignment = .center. La etiqueta se puede expandir a varias líneas en el UIStackView.

    La La documentación de Apple dice

    Para todas las alineaciones, excepto la alineación de relleno, la pila de vista de los usos de cada
    organizado vista intrinsicContentSize de la propiedad a la hora de calcular su
    el tamaño de la perpendicular a la pila del eje

    Nota la palabra excepto aquí. Cuando .fill se utiliza la horizontal UIStackView NO se ajusta verticalmente con lo dispuesto subvistas tamaños.

    • Esta es la solución adecuada sin hacks. Leyendo los documentos siempre vale la pena!
    • Esta debe ser la solución aceptada. Con el UIView solución UILabel del texto flotando sobre otro subvista en mi caso.
    • No funciona en realidad… tengo 3 etiquetas en mi stackview. He líneas de set a cero y alineación al centro… todavía estoy viendo las etiquetas se cortan.
    • ¿Conjunto de la etiqueta ancho Deseado para Explícita ?
    • Esta es la solución correcta. Sin embargo, usted no tiene que usar .center alineación, cualquier cosa, además de .fill debería funcionar
    • Es el .alignment de la UIStackView que usted tiene que fijar para nada pero .fill no el UILabel, que es un poco confuso en el ejemplo dado label.alignment = .center. Creo que esto debería ser stackView.alignment = .center
    • La alineación de mi pila de vista es .center, mi etiqueta numberOfLines es 0, sin embargo, sólo muestra 2 líneas y no el resto. ¿Esta solución no mostrar algo acerca de la compresión o abrazarse resistencia, tal vez?
    • Esto funcionó para mí, pero no «mira» como que estaba trabajando en el guión, así que asegúrese de ejecutar antes de descartarla.
    • Gracias, señor! No sé por qué tuve mi alineación en .fillProportionally
    • Ayudado, pero sigue actuando extraño.. las etiquetas no se expanda por todo el camino. Tuvo que recurrir @Andy solución.
    • Esto funcionó exactamente como yo esperaba!

  3. 42
    • Primer juego de la etiqueta de número de líneas a 0
    • La pila de vista todavía no crecen a multiLine menos que darle un ancho fijo. Cuando nos revisión de su ancho, a continuación, se rompen a multilínea cuando la anchura es alcanzado, como se muestra:

    Varias líneas de la etiqueta en UIStackView

    Si no le damos un ancho fijo a la pila de ver las cosas se tornan ambiguos. ¿Cuánto tiempo durará la pila de ver crecer con la etiqueta (si el valor de la etiqueta dinámica)?

    Espero que esto pueda solucionar su problema.

    • ¿Qué pasa si la pila de vista de la anchura no es fijo, sino que es proporcional a la del dispositivo (es decir, superview s) de ancho.
    • Sí, podemos tener un ancho proporcional demasiado. El punto es si la etiqueta tiene que romper después de cierta anchura sea lo que sea, pero que necesita ser definido.
    • puede especificar preferredMaxLayoutWidth en viewDidLayoutSubviews para su etiqueta en UIViewController o en layoutSubviews si subclase UIView.
    • Esto debería haber sido aceptado respuesta, el punto entero de la stackview es para no tener que agregar restricciones entre el stackview y sus elementos…
    • Dando un valor fijo derrotas el propósito de autodiseño
    • ha funcionado bien, gracias por el número de líneas de punta
    • Gran respuesta que trabajó para mí. El problema era simplemente la creación de un ancho de restricción para mi pila de vista.
    • si no tengo de ancho fijo, pero debe ser no más de otra opinión de ancho. Esto todavía no funciona, pero no es ambigua. Definitivamente bueno para calcular «crecer no es más que «otra visión del ancho’

  4. 12

    Configuración preferredMaxLayoutWidth a la UILabel trabajado para mí

    self.myLabel.preferredMaxLayoutWidth = self.bounds.size.width;
    • Esta es la respuesta correcta en mi libro. Cuando cada vez que te equivocas con UILabel y la necesidad de manejar múltiples líneas que usted realmente necesita para darle un preferredMaxLayoutWidth. Podría funcionar sin ella, pero las cosas pueden ponerse bastante funky muy rápidamente sin ella.
    • Todos trataron todas las respuestas y todos ellos estaban equivocados, excepto la suya. Gracias!
    • Esta perfectamente resuelto mi problema y se siente mucho menos chapucero, gracias.
  5. 11

    Acaba de establecer el número de líneas a 0 en el Atributo inspector de etiquetas. Va a trabajar para usted.

    Varias líneas de la etiqueta en UIStackView

    • Para un vertical stackView, usted necesita tener el conjunto de Distribución para «Rellenar» para que esto funcione.
    • Ajuste de la Distribución de «Llenar» es la clave para la solución.
    • He encontrado que para un vertical UIStackView, tuve que colocar la parte superior y la parte inferior de restricciones para un niño UILabel para expandir y mostrar todo el texto.
  6. 4

    El truco de magia para mí era establecer un widthAnchor a la UIStackView.

    Configuración leadingAnchor y trailingAnchor no funciona, pero la configuración de centerXAnchor y widthAnchor hizo la UILabel se muestre correctamente.

  7. 3

    El siguiente es un Patio de recreo de la aplicación de multi-etiqueta de línea con un salto de línea dentro de un UIStackView. No requiere de la incrustación de la UILabel dentro de nada y ha sido probado con Xcode 9.2 y Swift 4. Espero que sea útil.

    import UIKit
    import PlaygroundSupport
    
    let containerView = UIView()
    containerView.frame = CGRect.init(x: 0, y: 0, width: 400, height: 500)
    containerView.backgroundColor = UIColor.white
    
    var label = UILabel.init()
    label.textColor = .black
    label.numberOfLines = 0
    label.translatesAutoresizingMaskIntoConstraints = false
    label.text = "This is an example of sample text that goes on for a long time. This is an example of sample text that goes on for a long time."
    
    let stackView = UIStackView.init(arrangedSubviews: [label])
    stackView.translatesAutoresizingMaskIntoConstraints = false
    stackView.axis = .vertical
    stackView.distribution = .fill
    stackView.alignment = .fill
    containerView.addSubview(stackView)
    stackView.centerXAnchor.constraint(equalTo: containerView.centerXAnchor).isActive = true
    stackView.centerYAnchor.constraint(equalTo: containerView.centerYAnchor).isActive = true
    stackView.widthAnchor.constraint(equalTo: containerView.widthAnchor).isActive = true
    stackView.heightAnchor.constraint(equalTo: containerView.heightAnchor).isActive = true
    
    PlaygroundPage.current.liveView = containerView
  8. 3

    iOS 9+

    Llamada [textLabel sizeToFit] después de establecer la UILabel del texto.

    sizeToFit re-diseño de la multilínea etiqueta utilizando preferredMaxWidth. La etiqueta cambiará el tamaño de la stackView, que va a cambiar el tamaño de la celda. No hay restricciones adicionales además de la fijación de la pila de la vista a la vista del contenido son necesarios.

  9. 3

    Aquí un ejemplo completo de una vertical UIStackView compone de varias líneas UILabels con cambio automático de altura.

    Las etiquetas envoltura basado en la stackview y anchura de la stackview la altura se basa en la etiqueta se ajusta la altura. (Con este enfoque, usted no será necesario incorporar las etiquetas en un UIView.) (Swift 5, iOS 12.2)

    Varias líneas de la etiqueta en UIStackView

    //A vertical stackview with multiline labels and automatic height.
    class ThreeLabelStackView: UIStackView {
        let label1 = UILabel()
        let label2 = UILabel()
        let label3 = UILabel()
    
        init() {
            super.init(frame: .zero)
            self.translatesAutoresizingMaskIntoConstraints = false
            self.axis = .vertical
            self.distribution = .fill
            self.alignment = .fill
    
            label1.numberOfLines = 0
            label2.numberOfLines = 0
            label3.numberOfLines = 0
            label1.lineBreakMode = .byWordWrapping
            label2.lineBreakMode = .byWordWrapping
            label3.lineBreakMode = .byWordWrapping
            self.addArrangedSubview(label1)
            self.addArrangedSubview(label2)
            self.addArrangedSubview(label3)
    
            //(Add some test data, a little spacing, and the background color
            //make the labels easier to see visually.)
            self.spacing = 1
            label1.backgroundColor = .orange
            label2.backgroundColor = .orange
            label3.backgroundColor = .orange
            label1.text = "Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi."
            label2.text = "Hello darkness my old friend..."
            label3.text = "When I wrote the following pages, or rather the bulk of them, I lived alone, in the woods, a mile from any neighbor, in a house which I had built myself, on the shore of Walden Pond, in Concord, Massachusetts, and earned my living by the labor of my hands only."
        }
    
        required init(coder: NSCoder) { fatalError("init(coder:) has not been implemented") }
    }

    Aquí es una muestra ViewController que lo utiliza.

    class ViewController: UIViewController {
        override func viewDidLoad() {
            super.viewDidLoad()
    
            let myLabelStackView = ThreeLabelStackView()
            self.view.addSubview(myLabelStackView)
    
            //Set stackview width to its superview.
            let widthConstraint  = NSLayoutConstraint(item: myLabelStackView, attribute: NSLayoutConstraint.Attribute.width, relatedBy: NSLayoutConstraint.Relation.equal, toItem: self.view, attribute: NSLayoutConstraint.Attribute.width, multiplier: 1, constant: 0)
            self.view.addConstraints([widthConstraint])
        }
    }
  10. 2

    Agregar UIStackView propiedades,

    stackView.alignment = .fill
    stackView.distribution = .fillProportionally
    stackView.spacing = 8.0
    stackView.axis = .horizontal

    Lugar de la adición de la etiqueta en el interior de UIView que no es necesario.Si usted está utilizando dentro de UITableViewCell por favor, vuelva a cargar los datos en la rotación.

  11. 1

    Diseño del sistema debe averiguar el origen, la anchura y la altura a dibujar subvistas, en este caso todos los de su subvistas tiene la misma prioridad, que el punto de conflicto, el diseño del sistema no conoce las dependencias entre los puntos de vista, que uno dibuja primero, segundo y así sucesivamente

    Pila subvistas la compresión de resolver el problema con múltiples líneas, dependiendo de su pila de vista es horizontal o vertical y que quiere convertirse en múltiples líneas. stackOtherSubviews .setContentCompressionResistancePriority(.defaultHight, for: .horizontal)
    lblTitle.setContentCompressionResistancePriority(.defaultLow, for: .horizontal)

  12. 1

    Después de intentar todo lo anterior sugerencia de que no se encontraron propiedades de cambio es necesario para la UIStackView. Acabo de cambiar las propiedades de la UILabels de la siguiente manera (Las etiquetas se agregan a una pila vertical de la vista ya):

    Swift 4 ejemplo:

        [titleLabel, subtitleLabel].forEach(){
            $0.numberOfLines = 0
            $0.lineBreakMode = .byWordWrapping
            $0.setContentCompressionResistancePriority(UILayoutPriority.required, for: .vertical)
        }
  13. 0

    En mi caso, he seguido las sugerencias anteriores, pero mi texto todavía estaba recibiendo trunca a una sola línea, aunque sólo en el paisaje. Resulta que he encontrado un invisible \0 carácter nulo en el texto de la etiqueta que era el culpable. Debe de haber sido introducido junto con el guión símbolo que se había metido. A ver si esto también está sucediendo en su caso, utilizar la Vista Depurador para seleccionar la etiqueta y examinar su texto.

  14. 0

    Xcode 9.2:

    Acaba de establecer el número de líneas a 0. Guión va a mirar raro después de la configuración de este. No te preocupes ejecutar el proyecto. Mientras se ejecuta todo va a cambiar de tamaño de acuerdo a su guión de instalación. Creo que su tipo de error en el guión gráfico.
    Varias líneas de la etiqueta en UIStackView

    Consejos : Establece que «el número de la línea para 0» en el pasado. reiniciarlo cuando desee editar algún otro punto de vista y se fija a 0 después de la edición.

    Varias líneas de la etiqueta en UIStackView

  15. 0

    Lo que funcionó para mí!

    stackview: alineación: relleno, distribución: relleno, restricción de ancho proporcional a superview ex. 0.8,

    de la etiqueta: centro, las líneas y = 0

  16. 0

    Para mí, el problema fue que la altura de la pila de vista era simplemente demasiado corto. La etiqueta y la pila de vista fueron correctamente configurado para permitir la etiqueta para tener varias líneas, pero la etiqueta fue la primera víctima de la compresión de contenido que el de la pila de vista utilizado para llegar a su altura lo suficientemente pequeño.

Dejar respuesta

Please enter your comment!
Please enter your name here