İOS uygulaması için UILabel için sol üst hizalama nasıl ayarlanır?

Uç dosyama bir etiket ekledim, ardından bu etiket için sol üst hizalamaya sahip olmak gerekiyor. Çalışma zamanında metin sağladığım için, ne kadar satır olduğundan emin değilim. Dolayısıyla, metin yalnızca tek satır içeriyorsa, dikey ortalanmış olarak görünür. Bu hizalama, önündeki ilgili etikete uymuyor.

Örneğin:

Garip görünen :(

Etiket metnini Üst Sol hizalamaya ayarlayabileceğim bir yol var mı?

Yeniden açıklamak yerine, bu oldukça kapsamlı ve yüksek puan alan soru / cevaba bağlantı vereceğim:

Bir UILabel içinde metni dikey olarak yukarı hizala

Kısa cevap hayır, Apple bunu kolaylaştırmadı, ancak çerçeve boyutunu değiştirerek mümkün.

Yapması oldukça kolay. Bir UILabelözelliğe sahip bir alt kasa oluşturun verticalAlignmentve textRectForBounds:limitedToNumberOfLinesüst, orta veya alt dikey hizalama için doğru sınırları döndürmek için geçersiz kılın . İşte kod:

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

StoryBoard'da AutoLayout kullanarak bir çözüm buldum.

1) Satır sayısını 0 ve metin hizalamasını Sola ayarlayın.

2) Yükseklik sınırlamasını ayarlayın.

3) Yükseklik Kısıtlaması İlişki içinde olmalıdır - Küçük veya Eşittir

4)

   override func viewWillLayoutSubviews() {
        sampleLabel.sizeToFit()
    }

Sonucu şu şekilde aldım:

SOLabel benim için çalışıyor.

Swift 3 ve 5:

Bu sürüm, RTL dilleri için destek sağlamak üzere orijinal sürümden güncellendi:

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)
    }
}

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)
    }
}

Benim durumumda, bottom spacekısıtlama sorunuydu. Ben ayarlamıştım = 16.

Ayarladığımda bottom to >= 16bu sorun çözüldü.

Ayrıca, etikette herhangi bir yükseklik sınırlaması varsa, onu kaldırmanız gerekir.

Boyut denetçisindeki etiketimin kısıtlama görünümü:

Kodunuzda

label.text = @"some text";
[label sizeToFit];

Bunu tablo hücrelerinde veya farklı verilerle geri dönüştürülen diğer görünümlerde kullanırsanız, sizeToFit'i çağırmadan önce orijinal çerçeveyi bir yerde saklamanız ve sıfırlamanız gerekeceğine dikkat edin.

Aynı sorun için başka bir çözüm buldum. Onun UITextViewyerine kullandım UILabelve editable()işlevi olarak değiştirdim false.

Ben de bu sorunu yaşıyordum ama bulduğum şey, UILabel'in özelliklerini ve yöntemlerini belirlediğiniz sırada önemlidir!

Daha [label sizeToFit]önce ararsanız label.font = [UIFont fontWithName:@"Helvetica" size:14];, metin üste hizalanmaz, ancak bunları değiştirirseniz, o zaman olur!

Ayrıca metni önce ayarlamanın da bir fark yarattığını fark ettim.

Bu yardımcı olur umarım.

Arayüz oluşturucuyu kullanırken, etiketiniz için kısıtlamaları ayarlayın (yüksekliği ve genişliği de ayarladığınızdan emin olun). Ardından Boyut Denetçisi'nde etiketin yüksekliğini kontrol edin. Orada = yerine> = okumasını isteyeceksiniz. Daha sonra bu görünüm denetleyicisinin uygulamasında, satır sayısını 0'a ayarlayın (IB'de de yapılabilir) ve [etiket boyutuToFit] etiketini ayarlayın; ve metninizin uzunluğu arttıkça, etiketin yüksekliği büyüyecek ve metninizi sol üstte tutacaktır.

İhtiyacınız olan şey, varsayılan olarak sol üst köşede başlayan, düzenlenebilir olmayan bir metinse, bir etiket yerine basitçe bir Metin Görünümü kullanabilir ve ardından bunun durumunu, aşağıdaki gibi düzenlenemez olarak ayarlayabilirsiniz:

textview.isEditable = false

Etiketlerle uğraşmaktan çok daha kolay ...

Şerefe!

SoLabel ile çözüm işe yarıyor, Teşekkürler.

Körük monotouch versiyonunu ekledim:

    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
}

En basit ve en kolay yol, Label'ı StackView'e yerleştirmek ve burada gösterildiği gibi Storyboard'dan StackView'in Axis'i Horizontal'a, Alignment to Attribute Inspector'dan Top'a ayarlamaktır .

TotiG'nin harika cevabının üzerine inşa ederek, bir UILabel'in dikey hizalamasını doğrudan StoryBoard'dan özelleştirmeyi son derece kolaylaştıran bir IBDesignable sınıfı oluşturdum. StoryBoard kimlik denetçisinden UILabel'inizin sınıfını 'VerticalAlignLabel' olarak ayarladığınızdan emin olun. Dikey hizalama etkili olmazsa, hile yapması gereken Düzenleyici-> Tüm Görünümleri Yenile'ye gidin.

Nasıl çalışır: UILabel'inizin sınıfını doğru bir şekilde ayarladıktan sonra, film şeridi size bir tamsayı (hizalama kodu) alan bir giriş alanı göstermelidir.

Güncelleme: Merkezlenmiş etiketler için destek ekledim ~ Sev

Üst Hizalama için 0 girin

Ortaya Hizalama için 1 girin

Alt Hizalama için 2 girin

    @IBDesignable class VerticalAlignLabel: UILabel {
    
    @IBInspectable var alignmentCode: Int = 0 {
        didSet {
            applyAlignmentCode()
        }
    }
    
    func applyAlignmentCode() {
        switch alignmentCode {
        case 0:
            verticalAlignment = .top
        case 1:
            verticalAlignment = .topcenter
        case 2:
            verticalAlignment = .middle
        case 3:
            verticalAlignment = .bottom
        default:
            break
        }
    }
    
    override func awakeFromNib() {
        super.awakeFromNib()
        self.applyAlignmentCode()
    }
    
    override func prepareForInterfaceBuilder() {
        super.prepareForInterfaceBuilder()
        
        self.applyAlignmentCode()
    }
    
    enum VerticalAlignment {
        case top
        case topcenter
        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 #available(iOS 9.0, *) {
            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 .topcenter:
                    return CGRect(x: self.bounds.size.width - (rect.size.width / 2), 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 .topcenter:
                    return CGRect(x: (self.bounds.size.width / 2 ) - (rect.size.width / 2), 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)
                }
            }
        } else {
            // Fallback on earlier versions
            return rect
        }
    }
    
    override public func drawText(in rect: CGRect) {
        let r = self.textRect(forBounds: rect, limitedToNumberOfLines: self.numberOfLines)
        super.drawText(in: r)
    }
}

UILabel'inizi UITextView olarak da değiştirebilirsiniz, çünkü UITextView'ın avantajı, metnin otomatik olarak sol üste hizalanması dışında temelde aynı şeyi yaparlar

Bu sorunu yaşıyorum ama etiketim UITableViewCell'deydi ve sorunu çözmenin en kolay yolunun boş bir UIView oluşturmak ve içindeki etiketi sınırlamalarla sadece üstte ve yalnızca sol tarafa, kapalı lanetle satır sayısını 0 olarak ayarlayın

İOS 7 için benim için yaptığım ve çalıştığım şey buydu

@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];
}

Swift 2.0:: UILabel Uzantısını Kullanma

Boş bir Swift dosyasında sabit enum değerleri oluşturun.

//  AppRef.swift

import UIKit
import Foundation

enum UILabelTextPositions : String {

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

}

UILabel Uzantısını Kullanma:

Boş bir Swift sınıfı oluşturun ve ona ad verin. Aşağıdakileri ekleyin.

//  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!

     }
    }

Kullanım:

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

@ TotiG'nin cevabının Swift 3 versiyonu

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)
    }
}

@ totiG'nin cevabı doğru ve sorunumu çözdü. Ancak bu yöntemi uygularken 5s, SE gibi daha küçük cihazlarda bir sorun buldum, bu benim için çalışmıyor. Ben sete sahip label.sizeToFit()içindeoverride func layoutSubViews()

override func layoutSubViews() {
    super.layoutSubViews()
    // Do other works if needed
    label.sizeToFit()
}

Swift 5

Çok basit, mülklerin sırası her şeydir.

titleLabel.frame = CGRect(x: 20, y: 20, width: 374, height: 291.2)
titleLabel.backgroundColor = UIColor.clear //set a light color to see the frame
titleLabel.textAlignment = .left
titleLabel.lineBreakMode = .byTruncatingTail
titleLabel.numberOfLines = 4
titleLabel.font = UIFont(name: "HelveticaNeue-Bold", size: 35)
titleLabel.text = "Example"
titleLabel.sizeToFit()
self.view.addSubview(titleLabel)

İOS uygulaması için UILabel için sol üst hizalama nasıl ayarlanır? Etiket İçerik Modunu "Sol Üst" olarak ayarla benim için çalışıyor, çok teşekkür ederim: