Wie wird die Ausrichtung von oben nach links für UILabel für iOS-Anwendungen festgelegt?

Ich habe ein Etikett in meine nib Datei, dann seine benötigt, um die top-Links-Ausrichtung für das lable. Wie vermittele ich den text zur Laufzeit ist also nicht sicher, wie viel Linien es gibt.
Also, wenn der text enthält nur eine einzige Zeile, dann erscheint es als vertikale-center ausgerichtet. Dass die Angleichung nicht zusammenbringen mit meinen jeweiligen lable vor.

Beispiel:

Wie wird die Ausrichtung von oben nach links für UILabel für iOS-Anwendungen festgelegt?

Schauenden ungerade 🙁

Gibt es eine Möglichkeit, wo ich einstellen kann label text ordnungsgemäße Oben-Links-Ausrichtung?

InformationsquelleAutor der Frage Mrunal | 2011-08-25

ios iphone label text-alignment uilabel

50

Anstatt wieder zu erklären, werde ich den link zu diesem sehr ausführlichen & hoch bewertete Frage/Antwort:

Vertikal ausrichten von text nach oben in UILabel

Die kurze Antwort ist Nein, Apple hat dies nicht leicht, aber es ist möglich, durch ändern der frame-Größe.

InformationsquelleAutor der Antwort shawnwall

62

Es ist ziemlich einfach zu tun. Erstellen Sie eine UILabel Unterklasse mit einer verticalAlignment Eigentum und überschreiben textRectForBounds:limitedToNumberOfLines zurückzukehren, die richtigen Grenzen für oberen, mittleren oder unteren vertikalen Ausrichtung. Hier ist der code:

SOLabel.h

#import <UIKit/UIKit.h>

typedef enum
{
    VerticalAlignmentTop = 0, //default
    VerticalAlignmentMiddle,
    VerticalAlignmentBottom,
} VerticalAlignment;

@interface SOLabel : UILabel

   @property (nonatomic, readwrite) VerticalAlignment verticalAlignment;

@end

SOLabel.m

@implementation SOLabel

-(id)initWithFrame:(CGRect)frame
{
    self = [super initWithFrame:frame];
    if (!self) return nil;

    //set inital value via IVAR so the setter isn't called
    _verticalAlignment = VerticalAlignmentTop;

    return self;
}

-(VerticalAlignment) verticalAlignment
{
    return _verticalAlignment;
}

-(void) setVerticalAlignment:(VerticalAlignment)value
{
    _verticalAlignment = value;
    [self setNeedsDisplay];
}

//align text block according to vertical alignment settings
-(CGRect)textRectForBounds:(CGRect)bounds 
    limitedToNumberOfLines:(NSInteger)numberOfLines
{
   CGRect rect = [super textRectForBounds:bounds 
                   limitedToNumberOfLines:numberOfLines];
    CGRect result;
    switch (_verticalAlignment)
    {
       case VerticalAlignmentTop:
          result = CGRectMake(bounds.origin.x, bounds.origin.y, 
                              rect.size.width, rect.size.height);
           break;

       case VerticalAlignmentMiddle:
          result = CGRectMake(bounds.origin.x, 
                    bounds.origin.y + (bounds.size.height - rect.size.height) / 2,
                    rect.size.width, rect.size.height);
          break;

       case VerticalAlignmentBottom:
          result = CGRectMake(bounds.origin.x, 
                    bounds.origin.y + (bounds.size.height - rect.size.height),
                    rect.size.width, rect.size.height);
          break;

       default:
          result = bounds;
          break;
    }
    return result;
}

-(void)drawTextInRect:(CGRect)rect
{
    CGRect r = [self textRectForBounds:rect 
                limitedToNumberOfLines:self.numberOfLines];
    [super drawTextInRect:r];
}

@end

InformationsquelleAutor der Antwort memmons

30

Den SOLabel für mich funktioniert.

Swift 1:

class UIVerticalAlignLabel: UILabel {

enum VerticalAlignment : Int {
    case VerticalAlignmentTop = 0
    case VerticalAlignmentMiddle = 1
    case VerticalAlignmentBottom = 2
}

var verticalAlignment : VerticalAlignment = .VerticalAlignmentTop {
    didSet {
        setNeedsDisplay()
    }
}

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

override func textRectForBounds(bounds: CGRect, limitedToNumberOfLines: Int) -> CGRect {
    let rect = super.textRectForBounds(bounds, limitedToNumberOfLines: limitedToNumberOfLines)

    switch(verticalAlignment) {
        case .VerticalAlignmentTop:
            return CGRectMake(bounds.origin.x, bounds.origin.y, rect.size.width, rect.size.height)
        case .VerticalAlignmentMiddle:
            return CGRectMake(bounds.origin.x, bounds.origin.y + (bounds.size.height - rect.size.height) / 2, rect.size.width, rect.size.height)
        case .VerticalAlignmentBottom:
            return CGRectMake(bounds.origin.x, bounds.origin.y + (bounds.size.height - rect.size.height), rect.size.width, rect.size.height)
        default:
            return bounds
    }
}

override func drawTextInRect(rect: CGRect) {
    let r = self.textRectForBounds(rect, limitedToNumberOfLines: self.numberOfLines)
    super.drawTextInRect(r)
    }
}

Swift 3:

Diese version aktualisiert wurde aus dem original zu ermöglichen, die Unterstützung für RTL-Sprachen:

public class VerticalAlignLabel: UILabel {
    enum VerticalAlignment {
        case top
        case middle
        case bottom
    }

    var verticalAlignment : VerticalAlignment = .top {
        didSet {
            setNeedsDisplay()
        }
    }

    override public func textRect(forBounds bounds: CGRect, limitedToNumberOfLines: Int) -> CGRect {
        let rect = super.textRect(forBounds: bounds, limitedToNumberOfLines: limitedToNumberOfLines)

        if UIView.userInterfaceLayoutDirection(for: .unspecified) == .rightToLeft {
            switch verticalAlignment {
            case .top:
                return CGRect(x: self.bounds.size.width - rect.size.width, y: bounds.origin.y, width: rect.size.width, height: rect.size.height)
            case .middle:
                return CGRect(x: self.bounds.size.width - rect.size.width, y: bounds.origin.y + (bounds.size.height - rect.size.height) / 2, width: rect.size.width, height: rect.size.height)
            case .bottom:
                return CGRect(x: self.bounds.size.width - rect.size.width, y: bounds.origin.y + (bounds.size.height - rect.size.height), width: rect.size.width, height: rect.size.height)
            }
        } else {
            switch verticalAlignment {
            case .top:
                return CGRect(x: bounds.origin.x, y: bounds.origin.y, width: rect.size.width, height: rect.size.height)
            case .middle:
                return CGRect(x: bounds.origin.x, y: bounds.origin.y + (bounds.size.height - rect.size.height) / 2, width: rect.size.width, height: rect.size.height)
            case .bottom:
                return CGRect(x: bounds.origin.x, y: bounds.origin.y + (bounds.size.height - rect.size.height), width: rect.size.width, height: rect.size.height)
            }
        }
    }

    override public func drawText(in rect: CGRect) {
        let r = self.textRect(forBounds: rect, limitedToNumberOfLines: self.numberOfLines)
        super.drawText(in: r)
    }
}

InformationsquelleAutor der Antwort totiG

25

Fand ich eine Lösung mit AutoLayout in StoryBoard.

1) keine der Reihen auf 0 und Ausrichtung des Textes nach Links.

2) die Höhe Zwang.

3) Die Höhe Constraint-im Verhältnis - Weniger Als oder Gleich

4)
```
   override func viewWillLayoutSubviews() {
        sampleLabel.sizeToFit()
    }
```
Bekam ich das Ergebnis wie folgt :

InformationsquelleAutor der Antwort Alvin George
11

In Ihrem code
```
label.text = @"some text";
[label sizeToFit];
```
Beachten Sie, dass wenn Sie verwenden, dass in Tabellenzellen oder anderen Blick auf die recycelt mit anderen Daten, müssen Sie zum speichern der original-frame irgendwo ein und setzen Sie es vor dem Aufruf sizeToFit.

InformationsquelleAutor der Antwort n13
6

War ich auch mit diesem problem, aber was ich fand war das die Reihenfolge, in der Sie die UILabel Eigenschaften und Methoden Fragen!

Wenn Sie anrufen [label sizeToFit] vor label.font = [UIFont fontWithName:@"Helvetica" size:14]; dann der text nicht ausrichten oben, aber wenn Sie vertauscht, dann tut es!

Mir ist auch aufgefallen, dass die Einstellung der text macht einen Unterschied zu.

Hoffe, das hilft.

InformationsquelleAutor der Antwort rharvey
6

Fand ich eine andere Lösung für das gleiche problem. Ich verwendet UITextView statt UILabel und wechselte editable() Funktion false.

InformationsquelleAutor der Antwort Maxim Zh
4

Als Sie über den interface builder festlegen der Randbedingungen für die Beschriftung ein (achten Sie auf die Höhe und Breite). Dann sind Sie im Size Inspector, überprüfen Sie die Höhe für das label. Dort werden Sie wollen, es zu Lesen >= anstelle von =. Dann in der Umsetzung für die Ansicht-controller, stellen Sie die Anzahl der Zeilen auf 0 (kann auch getan werden, IB), und setzen Sie die Beschriftung [label sizeToFit]; und als Sie Ihren text erhält die Länge, das label wird in die Höhe wachsen und halten Sie Ihren text in der oberen linken.

InformationsquelleAutor der Antwort TomG103

2

Lösung mit SoLabel funktioniert , Danke.

Balg habe ich Hinzugefügt, monotouch-version:

    public class UICustomLabel : UILabel
{
    private UITextVerticalAlignment _textVerticalAlignment;

    public UICustomLabel()
    {
        TextVerticalAlignment = UITextVerticalAlignment.Top;
    }

    public UITextVerticalAlignment TextVerticalAlignment
    {
        get
        {
            return _textVerticalAlignment;
        }
        set
        {
            _textVerticalAlignment = value;
            SetNeedsDisplay();
        }
    }

    public override void DrawText(RectangleF rect)
    {
        var bound = TextRectForBounds(rect, Lines);
        base.DrawText(bound);
    }

    public override RectangleF TextRectForBounds(RectangleF bounds, int numberOfLines)
    {
        var rect = base.TextRectForBounds(bounds, numberOfLines);
        RectangleF resultRect;
        switch (TextVerticalAlignment)
        {
            case UITextVerticalAlignment.Top:
                resultRect = new RectangleF(bounds.X, bounds.Y, rect.Size.Width, rect.Size.Height);
                break;
            case UITextVerticalAlignment.Middle:
                resultRect = new RectangleF(bounds.X,
                                            bounds.Y + (bounds.Size.Height - rect.Size.Height)/2,
                                            rect.Size.Width, rect.Size.Height);
                break;
            case UITextVerticalAlignment.Bottom:
                resultRect = new RectangleF(bounds.X,
                                            bounds.Y + (bounds.Size.Height - rect.Size.Height),
                                            rect.Size.Width, rect.Size.Height);
                break;

            default:
                resultRect = bounds;
                break;
        }

        return resultRect;
    }
}

public enum UITextVerticalAlignment
{
    Top = 0, //default
    Middle,
    Bottom
}

InformationsquelleAutor der Antwort plvlad

1

Die einfachste und einfachste Weg, einbetten, Label in StackView und Einstellung StackView Achse, Horizontale Ausrichtung Oben im Attribut-Inspector von Storyboard wie hier gezeigt.

InformationsquelleAutor der Antwort Baig
1

Wenn das, was Sie brauchen, ist die nicht-editierbaren text, der standardmäßig beginnt in der oberen linken Ecke können Sie einfach eine Text-Ansicht, anstatt ein label und dann setzen Sie seinen Status auf " nicht editierbar, so wie hier:
```
textview.isEditable = false
```
Einfacher als messing mit den Etiketten...

Prost!

InformationsquelleAutor der Antwort Alejandro Camus

0

Für iOS 7 das ist, was ich gemacht habe und für mich gearbeitet

@implementation UILabel (VerticalAlign)
- (void)alignTop
{
    CGSize boundingRectSize = CGSizeMake(self.frame.size.width, CGFLOAT_MAX);
    NSDictionary *attributes = @{NSFontAttributeName : self.font};
    CGRect labelSize = [self.text boundingRectWithSize:boundingRectSize options:NSStringDrawingUsesLineFragmentOrigin | NSStringDrawingUsesFontLeading
                                              attributes:attributes
                                                 context:nil];
    int numberOfLines= ceil(labelSize.size.height / self.font.lineHeight);

    CGRect newFrame = self.frame;
    newFrame.size.height = numberOfLines * self.font.lineHeight;
    self.frame = newFrame;
}

- (void)alignBottom
{
    CGSize boundingRectSize = CGSizeMake(self.frame.size.width, CGFLOAT_MAX);
    NSDictionary *attributes = @{NSFontAttributeName : self.font};
    CGRect labelSize = [self.text boundingRectWithSize:boundingRectSize options:NSStringDrawingUsesLineFragmentOrigin | NSStringDrawingUsesFontLeading
                                            attributes:attributes
                                               context:nil];
    int numberOfLines= ceil(labelSize.size.height / self.font.lineHeight);

    int numberOfNewLined = (self.frame.size.height/self.font.lineHeight) - numberOfLines;

    NSMutableString *newLines = [NSMutableString string];
    for(int i=0; i< numberOfNewLined; i++){
        [newLines appendString:@"\n"];
    }
    [newLines appendString:self.text];
    self.text = [newLines mutableCopy];
}

InformationsquelleAutor der Antwort nmortada

0

Swift 2.0: : Mit UILabel Erweiterung

Machen Konstante enum-Werte in ein leeres Swift-Datei.

// AppRef.swift

import UIKit
import Foundation

enum UILabelTextPositions : String {

 case VERTICAL_ALIGNMENT_TOP = "VerticalAlignmentTop"
 case VERTICAL_ALIGNMENT_MIDDLE = "VerticalAlignmentMiddle"
 case VERTICAL_ALIGNMENT_BOTTOM = "VerticalAlignmentBottom"

}

Mit UILabel-Erweiterung:

Stellen Sie ein leeres Swift-Klasse und nennen Sie es. Fügen Sie die folgende.

// AppExtensions.swift

import Foundation
import UIKit

    extension UILabel{ 
     func makeLabelTextPosition (sampleLabel :UILabel?, positionIdentifier : String) -> UILabel
     {
      let rect = sampleLabel!.textRectForBounds(bounds, limitedToNumberOfLines: 0)

      switch positionIdentifier
      {
      case "VerticalAlignmentTop":
       sampleLabel!.frame = CGRectMake(bounds.origin.x+5, bounds.origin.y, rect.size.width, rect.size.height)
       break;

      case "VerticalAlignmentMiddle":
       sampleLabel!.frame = CGRectMake(bounds.origin.x+5,bounds.origin.y + (bounds.size.height - rect.size.height) / 2,
        rect.size.width, rect.size.height);
       break;

      case "VerticalAlignmentBottom":
       sampleLabel!.frame = CGRectMake(bounds.origin.x+5, bounds.origin.y + (bounds.size.height - rect.size.height),rect.size.width, rect.size.height);
       break;

      default:
       sampleLabel!.frame = bounds;
       break;
      }
      return sampleLabel!

     }
    }

Verwendung :

myMessageLabel.makeLabelTextPosition(messageLabel, positionIdentifier: UILabelTextPositions.VERTICAL_ALIGNMENT_TOP.rawValue)

InformationsquelleAutor der Antwort Alvin George

0

Swift 3-version von @totiG Antwort

class UIVerticalAlignLabel: UILabel {
    enum VerticalAlignment : Int {
        case VerticalAlignmentTop = 0
        case VerticalAlignmentMiddle = 1
        case VerticalAlignmentBottom = 2
    }

    @IBInspectable var verticalAlignment : VerticalAlignment = .VerticalAlignmentTop {
        didSet {
            setNeedsDisplay()
        }
    }

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

    override func textRect(forBounds bounds: CGRect, limitedToNumberOfLines: Int) -> CGRect {
        let rect = super.textRect(forBounds: bounds, limitedToNumberOfLines: limitedToNumberOfLines)

        switch(verticalAlignment) {
        case .VerticalAlignmentTop:
            return CGRect(x: bounds.origin.x, y: bounds.origin.y, width: rect.size.width, height: rect.size.height)
        case .VerticalAlignmentMiddle:
            return CGRect(x: bounds.origin.x, y: bounds.origin.y + (bounds.size.height - rect.size.height) / 2, width: rect.size.width, height: rect.size.height)
        case .VerticalAlignmentBottom:
            return CGRect(x: bounds.origin.x, y: bounds.origin.y + (bounds.size.height - rect.size.height), width: rect.size.width, height: rect.size.height)
        }
    }

    override func drawText(in rect: CGRect) {
        let r = self.textRect(forBounds: rect, limitedToNumberOfLines: self.numberOfLines)
        super.drawText(in: r)
    }
}

InformationsquelleAutor der Antwort bz13

Schreibe einen Kommentar

Du musst angemeldet sein, um einen Kommentar abzugeben.