Szukaj…


Wprowadzenie

Klasa UILabel implementuje widok tekstowy tylko do odczytu. Możesz użyć tej klasy do narysowania jednego lub wielu wierszy tekstu statycznego, takich jak te, których możesz użyć do zidentyfikowania innych części interfejsu użytkownika. Podstawowa klasa UILabel zapewnia obsługę zarówno prostych, jak i złożonych stylów tekstu etykiety. Możesz także kontrolować aspekty wyglądu, takie jak to, czy etykieta używa cienia, czy rysuje z podświetleniem. W razie potrzeby można dodatkowo dostosować wygląd tekstu, dzieląc go na podklasy.

Składnia

  • UILabel.numberOfLines: Int // pobierz lub ustaw maksymalną liczbę linii, jaką może mieć etykieta. 0 jest nieograniczona
  • UILabel.text: String? // pobierz lub ustaw tekst wyświetlany na etykiecie
  • UILabel.textColor: UIColor! // pobierz lub ustaw kolor tekstu na etykiecie
  • UILabel.tintColor: UIColor! // pobierz lub ustaw kolor odcienia etykiety
  • UILabel.attributeText: NSAttributString? // pobierz lub ustaw przypisany tekst etykiety
  • UILabel.font: UIFont! // pobierz lub ustaw czcionkę tekstu na etykiecie
  • UILabel.textAlignment: NSTextAlignment // pobierz lub ustaw wyrównanie tekstu

Uwagi

UILabels to widoki, których można użyć do wyświetlenia jednego lub wielu wierszy tekstu. Zawiera wiele sposobów stylizowania tekstu, takich jak cienie, kolory tekstu i czcionki.

UILabels może również wyświetlać ciągi atrybutów, które są tekstem + wstawianie znaczników w celu zastosowania stylów do części tekstu.

UILabel nie jest zgodny z protokołem UIAppearance, więc nie można używać metod proxy UIAppearance do dostosowywania wyglądu UILabels. Zobacz tę dyskusję, aby uzyskać więcej.

Referencje dla programistów Apple tutaj

Zmiana tekstu w istniejącej etykiecie

Zmiana tekstu istniejącego UILabel może odbywać się poprzez dostęp i modyfikację właściwości text UILabel . Można to zrobić bezpośrednio, używając literałów String lub pośrednio, używając zmiennych.

Ustawianie tekstu za pomocą literałów String

Szybki

label.text = "the new text"

Cel C

// Dot Notation
label.text = @"the new text";

// Message Pattern
[label setText:@"the new text"];

Ustawienie tekstu za pomocą zmiennej

Szybki

let stringVar = "basic String var"
label.text = stringVar

Cel C

NSString * stringVar = @"basic String var";

// Dot Notation
label.text = stringVar;

// Message Pattern
[label setText: stringVar];

Kolor tekstu

Za pomocą właściwości textColor etykiety można zastosować kolor tekstu do całego tekstu etykiety.

Szybki

label.textColor = UIColor.redColor()
label.textColor = UIColor(red: 64.0/255.0, green: 88.0/255.0, blue: 41.0/225.0, alpha: 1)

Szybki 3

label.textColor = UIColor.red
label.textColor = UIColor(red: 64.0/255.0, green: 88.0/255.0, blue: 41.0/225.0, alpha: 1)

Cel C

label.textColor = [UIColor redColor];
label.textColor = [UIColor colorWithRed:64.0f/255.0f green:88.0f/255.0f blue:41.0f/255.0f alpha:1.0f];

Stosowanie koloru tekstu do części tekstu

Możesz także zmieniać kolor tekstu (lub inne atrybuty) fragmentów tekstu za pomocą NSAttributedString :

Cel C

attributedString = [[NSMutableAttributedString alloc] initWithString:@"The grass is green; the sky is blue."];
[attributedString addAttribute: NSForegroundColorAttributeName value:[UIColor greenColor] range:NSMakeRange(13, 5)];
[attributedString addAttribute: NSForegroundColorAttributeName value:[UIColor blueColor] range:NSMakeRange(31, 4)];
label.attributedText = attributesString;

Szybki

let attributedString = NSMutableAttributedString(string: "The grass is green; the sky is blue.")
attributedString.addAttribute(NSForegroundColorAttributeName, value: UIColor.green(), range: NSRange(location: 13, length: 5))
attributedString.addAttribute(NSForegroundColorAttributeName, value: UIColor.blue(), range: NSRange(location: 31, length: 4))
label.attributedText = attributedString

Wyrównanie tekstu

Szybki

label.textAlignment = NSTextAlignment.left 
//or the shorter
label.textAlignment = .left 

Każda wartość w NSTextAlignment wyliczenia jest ważny: .left , .center , .right , .justified , .natural

Cel C

label.textAlignment = NSTextAlignmentLeft;

Każda wartość w wyliczeniu NSTextAlignment jest poprawna: NSTextAlignmentLeft , NSTextAlignmentCenter , NSTextAlignmentRight , NSTextAlignmentJustified , NSTextAlignmentNatural

Wyrównanie w pionie w UILabel nie jest obsługiwane po wyjęciu z pudełka: wyrównaj tekst pionowo do góry w UILabel

Utwórz UILabel

Z ramą

Kiedy znasz dokładne wymiary, które chcesz ustawić dla swojej etykiety, możesz zainicjować UILabel za pomocą ramki CGRect .

Szybki

let frame = CGRect(x: 0, y: 0, width: 200, height: 21)
let label = UILabel(frame: frame)
view.addSubview(label)

Cel C

CGRect frame = CGRectMake(0, 0, 200, 21);
UILabel *label = [[UILabel alloc] initWithFrame:frame];
[view addSubview:label];

Z automatycznym układem

Możesz dodać ograniczenia na UILabel jeśli chcesz, aby iOS dynamicznie obliczał ramkę w czasie wykonywania.

Szybki

let label = UILabel()
label.backgroundColor = .red
label.translatesAutoresizingMaskIntoConstraints = false
view.addSubview(label)

NSLayoutConstraint.activate([
    //stick the top of the label to the top of its superview:
    label.topAnchor.constraint(equalTo: view.topAnchor)

    //stick the left of the label to the left of its superview
    //if the alphabet is left-to-right, or to the right of its 
    //superview if the alphabet is right-to-left:
    label.leadingAnchor.constraint(equalTo: view.leadingAnchor)

    //stick the label's bottom to the bottom of its superview:
    label.bottomAnchor.constraint(equalTo: view.bottomAnchor)

    //the label's width should be equal to 100 points:
    label.widthAnchor.constraint(equalToConstant: 100)
])

Cel C

UILabel *label = [[UILabel alloc] init];

Z Objective-C + Visual Format Language (VFL)

  UILabel *label = [UILabel new];
  label.translatesAutoresizingMaskIntoConstraints = NO;
  [self.view addSubview label];
  // add horizontal constraints with 5 left and right padding from the leading and trailing

  [self.view addConstraints:[NSLayoutConstraint constraintsWithVisualFormat:@"V:|-5-[labelName]-5-|"
                                                                    options:0
                                                                    metrics:nil
                                                                      views:@{@"labelName":label}]];
  // vertical constraints that will use the height of the superView with no padding on top and bottom
  [self.view addConstraints:[NSLayoutConstraint constraintsWithVisualFormat:@"H:|[labelName]|"
                                                                    options:0
                                                                    metrics:nil
                                                                      views:@{@"labelName":label}]]

Dokumentację VFL można znaleźć tutaj

Po utworzeniu etykiety pamiętaj o ustawieniu wymiarów za pomocą Układu automatycznego. Xcode wyświetli błędy, jeśli zostanie to wykonane nieprawidłowo.

Z konstruktorem interfejsów

Korzystasz także z Konstruktora interfejsów, aby dodać Label UILabel do pliku Storyboard lub .xib , przeciągając Label z panelu Biblioteka obiektów i upuszczając ją w widoku w obszarze roboczym:

Zrzut ekranu z Konstruktora interfejsów

Zamiast programowo określać ramkę (pozycję i rozmiar) dla UILabel , Storyboard lub .xib pozwala na użycie układu automatycznego w celu dodania ograniczeń do kontrolki.

Aby uzyskać dostęp do tej etykiety utworzonej z storyboard lub xib utwórz IBOutlet tej etykiety.

Łączenie między Konstruktorem interfejsów a kontrolerem widoku

Po dodaniu UILabel do Storyboard lub .xib pliku możesz połączyć go z kodem, naciskając Control ⌃ a następnie przeciągając myszą między UILabel do ViewController , lub możesz przeciągnąć do kodu, klikając prawym przyciskiem myszy, aby mają ten sam efekt.

wprowadź opis zdjęcia tutaj

W oknie dialogowym właściwości możesz ustawić nazwę UILabel i ustawić ją jako strong lub weak . Aby uzyskać więcej informacji o strong i weak , zobacz to ,

Innym sposobem jest zaprogramowanie gniazdka w następujący sposób:

Szybki

@IBOutlet weak var nameLabel : UILabel!

Cel C

@property (nonatomic, weak) IBOutlet UILabel *nameLabel;

Ustaw czcionkę

Szybki

let label = UILabel()

Cel C

UILabel *label = [[UILabel alloc] init];
or
UILabel *label = [UILabel new]; // convenience method for calling alloc-init

Zmień domyślny rozmiar czcionki

Szybki

label.font = UIFont.systemFontOfSize(17)

Szybki 3

label.font = UIFont.systemFont(ofSize: 17)

Cel C

label.font = [UIFont systemFontOfSize:17];

Użyj określonej grubości czcionki

iOS 8.2

Szybki

label.font = UIFont.systemFontOfSize(17, weight: UIFontWeightBold)

Swift3

label.font = UIFont.systemFont(ofSize: 17, weight: UIFontWeightBold)

Cel C

label.font = [UIFont systemFontOfSize:17 weight:UIFontWeightBold];
iOS 8.2

Szybki

label.font = UIFont.boldSystemFontOfSize(17)

Swift3

label.font = UIFont.boldSystemFont(ofSize: 17)

Cel C

label.font = [UIFont boldSystemFontOfSize:17];

Użyj stylu tekstu typu dynamicznego.

Rozmiar czcionki i punktu będzie zależał od preferowanego rozmiaru czytania użytkownika.

Szybki

label.font = UIFont.preferredFontForTextStyle(UIFontTextStyleBody)

Szybki 3

label.font = UIFont.preferredFont(forTextStyle: .body)

Cel C

label.font = [UIFont preferredFontForTextStyle:UIFontTextStyleBody];

Użyj zupełnie innej czcionki

Szybki

label.font = UIFont(name: "Avenir", size: 15)

Cel C

label.font = [UIFont fontWithName:@"Avenir" size:15];

Zastąp rozmiar czcionki

Sposobem na ustawienie rozmiaru czcionki bez znajomości rodziny czcionek jest użycie właściwości font UILabel .

Szybki

label.font = label.font.fontWithSize(15)

Szybki 3

label.font = label.font.withSize(15)

Cel C

label.font = [label.font fontWithSize:15];

Użyj niestandardowej czcionki Swift

Zobacz ten link

Liczba linii

Po utworzeniu etykiety i ustawieniu tekstu na więcej niż jeden wiersz, który może wyświetlać, zostanie ona obcięta i zobaczysz tylko jeden wiersz tekstu zakończony trzema kropkami (...). Wynika to z faktu, że właściwość o nazwie numberOfLines jest ustawiona na 1, a zatem wyświetlana jest tylko jedna linia. Jest to powszechny błąd w obsłudze UILabel i wiele osób uważa to za błąd, lub mogą użyć więcej niż jednej etykiety, aby wyświetlić więcej niż wiersz tekstu, ale po prostu edytując tę właściwość, możemy powiedzieć UILabel aby akceptuj do określonej liczby linii. Na przykład, jeśli ta właściwość jest ustawiona na 5, etykieta może pokazywać 1, 2, 3, 4 lub 5 linii danych.

Programowanie wartości

Aby ustawić tę właściwość, po prostu przypisz do niej nową liczbę całkowitą:

Szybki

label.numberOfLines = 2

Cel C

label.numberOfLines = 2;

Uwaga

Możliwe jest ustawienie tej właściwości na 0. Jednak nie oznacza to, że nie będzie akceptować żadnych linii, zamiast tego oznacza, że etykieta może zawierać tyle linii, ile potrzeba (aka „Infinity”):

Szybki

label.numberOfLines = 0

Cel C

label.numberOfLines = 0;

Uwaga

Jeśli etykieta ma ograniczenie wysokości, ograniczenie będzie przestrzegane. W takim przypadku label.numberOfLines = 0 może nie działać zgodnie z oczekiwaniami.

Uwaga

W przypadku bardziej złożonego tekstu wielowierszowego lepiej jest dopasować UITextView . *

Ustawianie wartości w Konstruktorze interfejsów

Zamiast ustawiać numberOfLines programowo, można użyć Storyboard lub .xib i ustawić numberOfLines nieruchomości. W ten sposób osiągamy takie same wyniki jak powyższy kod.

Jak poniżej:

wprowadź opis zdjęcia tutaj

Rozmiar pasujący

Załóżmy, że masz UILabel na storyboard i utworzeniu IBOutlet go w ViewController.swift / ViewController.m i nazwał ją labelOne .

Aby dokonać zmiany widoczne, zmienić backgroundColor i textColor z labelOne w viewDidLoad metody:

Funkcja sizeToFit jest używana, gdy chcesz automatycznie zmienić rozmiar etykiety na podstawie zawartości w niej przechowywanej.

Szybki

labelOne.backgroundColor = UIColor.blueColor()
labelOne.textColor = UIColor.whiteColor()
labelOne.text = "Hello, World!"
labelOne.sizeToFit()

Szybki 3

labelOne.backgroundColor = UIColor.blue
labelOne.textColor = UIColor.white
labelOne.text = "Hello, World!"
labelOne.sizeToFit()

Cel C

labelOne.backgroundColor = [UIColor blueColor];
labelOne.textColor = [UIColor whiteColor];
labelOne.text = @"Hello, World!";
[labelOne sizeToFit];

Dane wyjściowe powyższego kodu to:

wprowadź opis zdjęcia tutaj

Jak widać, nic się nie zmienia, ponieważ tekst idealnie pasuje do labelOne. sizeToFit zmienia tylko ramkę etykiety.

Zmieńmy tekst na nieco dłuższy:

labelOne.text = "Hello, World! I’m glad to be alive!"

Teraz labelOne wygląda następująco:

wprowadź opis zdjęcia tutaj

Nawet wywołanie sizeToFit niczego nie zmienia. Jest tak, ponieważ domyślnie liczbaOfLines wyświetlana przez UILabel jest ustawiona na 1. Zmieńmy ją na zero na scenorysie:

wprowadź opis zdjęcia tutaj

Tym razem, gdy uruchamiamy aplikację, labelOne pojawia się poprawnie:

wprowadź opis zdjęcia tutaj

Właściwość numberOfLines można również zmienić w pliku ViewController :

// Objective-C
labelOne.numberOfLines = 0; 

// Swift
labelOne.numberOfLines = 0

Kolor tła

Szybki

label.backgroundColor = UIColor.redColor()

label.backgroundColor = .redColor()

Szybki 3

label.backgroundColor = UIColor.red

Cel C

label.backgroundColor = [UIColor redColor];

Dodaj cienie do tekstu

Szybki

label1.layer.shadowOffset = CGSize(width: 3, height: 3)
label1.layer.shadowOpacity = 0.7
label1.layer.shadowRadius = 2

Szybki 3

label1.layer.shadowOffset = CGSize(width: 3, height: 3)
label1.layer.shadowOpacity = 0.7
label1.layer.shadowRadius = 2

Cel C

label1.layer.shadowOffset = CGSizeMake(3, 3);
label1.layer.shadowOpacity = 0.7;
label1.layer.shadowRadius = 2;

wprowadź opis zdjęcia tutaj

Zmienna wysokość za pomocą wiązań

Możesz utworzyć UILabel z dynamiczną wysokością, korzystając z automatycznego układu.

Musisz ustawić numberOfLines na zero (0) i dodać minimalną wysokość, ustawiając ograniczenia z relacją typu .GreaterThanOrEqual na atrybucie .Height

iOS 6

Szybki

label.numberOfLines = 0

let heightConstraint = NSLayoutConstraint(
    item: label,
    attribute: .Height,
    relatedBy: .GreaterThanOrEqual,
    toItem: nil,
    attribute: .NotAnAttribute,
    multiplier: 0,
    constant: 20
)

label.addConstraint(heightConstraint)
iOS 9

Szybki

label.numberOfLines = 0
label.translatesAutoresizingMaskIntoConstraints = false
label.heightAnchor.constraintGreaterThanOrEqualToConstant(20).active = true

LineBreakMode

Za pomocą kodu

UILabel.lineBreakMode: NSLineBreakMode

Szybki

label.lineBreakMode = .ByTruncatingTail
  • .ByWordWrapping
  • .ByCharWrapping
  • .ByClipping
  • .ByTruncatingHead
  • .ByTruncatingTail
  • .ByTruncatingMiddle

Szybki 3

label.lineBreakMode = .byTruncatingTail
  • .byWordWrapping
  • .byCharWrapping
  • .byClipping
  • .byTruncatingHead
  • .byTruncatingTail
  • .byTruncatingMiddle

Cel C

[label setLineBreakMode:NSLineBreakByTruncatingTail];
  • NSLineBreakByWordWrapping
  • NSLineBreakByCharWrapping
  • NSLineBreakByClipping
  • NSLineBreakByTruncatingHead
  • NSLineBreakByTruncatingTail
  • NSLineBreakByTruncatingMiddle

Korzystanie ze scenorysu

Można to również ustawić w inspektorze atrybutów UILabel:

wprowadź opis zdjęcia tutaj wprowadź opis zdjęcia tutaj

Stałe

  • Zawijanie słów - zawijanie odbywa się na granicach słów, chyba że samo słowo nie mieści się w jednej linii
  • Zawijanie char - owijanie następuje przed pierwszą postacią, która nie pasuje
  • Przycinanie - linie po prostu nie są rysowane poza krawędź pojemnika tekstowego
  • Ścinanie głowy - linia jest wyświetlana tak, że koniec mieści się w pojemniku, a brakujący tekst na początku linii jest wskazywany przez glif elipsowy
  • Ścinanie ogona - linia jest wyświetlana tak, że początek mieści się w kontenerze, a brakujący tekst na końcu linii jest oznaczony glifem elipsy
  • Ścinanie środka - linia jest wyświetlana tak, że początek i koniec pasują do pojemnika, a brakujący tekst na środku jest wskazywany przez glif elipsowy

Oblicz granice zawartości (np. Dynamiczne wysokości komórek)

Typowym przypadkiem użycia w celu obliczenia ramki, którą zajmie etykieta, jest odpowiednie dopasowanie rozmiarów komórek widoku tabeli. Zalecanym sposobem na to jest użycie metody NSString boundingRectWithSize:options:attributes:context: NSString

options przyjmuje opcje rysowania ciągów:

  • NSStringDrawingUsesLineFragmentOrigin należy stosować do etykiet z wieloma wierszami
  • NSStringDrawingTruncatesLastVisibleLine należy dodać za pomocą | operator, jeśli istnieje maksymalna liczba linii

attributes to NSDictionary atrybutów, które wpływają na przypisane ciągi (pełna lista: Dokumenty Apple ), ale czynniki wpływające na wysokość obejmują:

  • NSFontAttributeName : Bardzo ważne, rozmiar i rodzina czcionek jest kluczową częścią wyświetlanego rozmiaru etykiety.

  • NSParagraphStyleAttributeName : Do dostosowywania sposobu wyświetlania tekstu. Obejmuje to odstępy między wierszami, wyrównanie tekstu, styl obcięcia i kilka innych opcji. Jeśli nie zmieniłeś wyraźnie żadnej z tych wartości, nie powinieneś się o to martwić, ale może to być ważne, jeśli zmieniłeś niektóre wartości na IB.

context powinien być nil ponieważ podstawowym przypadkiem użycia NSStringDrawingContext jest umożliwienie zmiany rozmiaru czcionki w celu dopasowania do określonego odbicia, co nie powinno mieć miejsca w przypadku obliczania wysokości dynamicznej.

Cel C

- (CGFloat)tableView:(UITableView *)tableView heightForRowAtIndexPath:(NSIndexPath *)indexPath {
    
    UITableViewCell *cell = [tableView cellForRowAtIndexPath:indexPath];

    NSString *labelContent = cell.theLabel.text;
    // you may choose to get the content directly from the data source if you have done minimal customizations to the font or are comfortable with hardcoding a few values
//    NSString *labelContent = [self.dataSource objectAtIndexPath:indexPath];
    
    // value may be hardcoded if retrieved from data source
    NSFont *labelFont = [cell.theLabel font];
    
    // The NSParagraphStyle, even if you did not code any changes these values may have been altered in IB
    NSMutableParagraphStyle *paragraphStyle = [NSMutableParagraphStyle new];
    paragraphStyle.lineBreakMode = NSLineBreakByWordWrapping; 
    paragraphStyle.alignment = NSTextAlignmentCenter;

    NSDictionary *attributes = @{NSFontAttributeName: labelFont,
                                 NSParagraphStyleAttributeName: paragraphStyle};

    // The width is also important to the height
    CGFloat labelWidth = CGRectGetWidth(cell.theLabel.frame);
    // If you have been hardcoding up to this point you will be able to get this value by subtracting the padding on left and right from tableView.bounds.size.width
//    CGFloat labelWidth = CGRectGetWidth(tableView.frame) - 20.0f - 20.0f;

    CGRect bodyBounds = [labelContent boundingRectWithSize:CGSizeMake(width, CGFLOAT_MAX) options:NSStringDrawingUsesLineFragmentOrigin attributes:attributes context:nil];

    return CGRectGetHeight(bodyBounds) + heightOfObjectsOnTopOfLabel + heightOfObjectBelowLabel;
}

Swfit 3

override func tableView(_ tableView: UITableView, heightForRowAt indexPath: IndexPath) -> CGFloat {
    var cell = tableView.cellForRow(atIndexPath: indexPath)!
    var labelContent = cell.theLabel.text
    var labelFont = cell.theLabel.font
    var paragraphStyle = NSMutableParagraphStyle()

    paragraphStyle.lineBreakMode = .byWordWrapping
    paragraphStyle.alignment = .center

    var attributes = [NSFontAttributeName: labelFont, NSParagraphStyleAttributeName: paragraphStyle]

    var labelWidth: CGFloat = cell.theLabel.frame.width

    var bodyBounds = labelContent.boundingRect(withSize: CGSize(width: width, height: CGFLOAT_MAX), options: .usesLineFragmentOrigin, attributes: attributes, context: nil)

    return bodyBounds.height + heightOfObjectsOnTopOfLabel + heightOfObjectBelowLabel
}

I odwrotnie, jeśli masz ustawioną maksymalną liczbę linii, najpierw musisz obliczyć wysokość pojedynczej linii, aby upewnić się, że nie otrzymamy wartości wyższej niż dozwolony rozmiar:

    // We calculate the height of a line by omitting the NSStringDrawingUsesLineFragmentOrigin option, which will assume an infinitely wide label
    CGRect singleLineRect = [labelContent boundingRectWithSize:CGSizeMake(CGFLOAT_MAX, CGFLOAT_MAX)
                                                 options:NSStringDrawingTruncatesLastVisibleLine
                                                 context:nil];
    CGFloat lineHeight = CGRectGetHeight(singleLineRect);
    CGFloat maxHeight = lineHeight * cell.theLabel.numberOfLines;

    // Now you can call the method appropriately
    CGRect bodyBounds = [labelContent boundingRectWithSize:CGSizeMake(width, maxHeight) options:(NSStringDrawingUsesLineFragmentOrigin|NSStringDrawingTruncatesLastVisibleLine) attributes:attributes context:nil];

    return CGRectGetHeight(bodyBounds) + heightOfObjectsOnTopOfLabel + heightOfObjectBelowLabel;

Etykieta klikalna

UWAGA: W większości przypadków lepiej jest użyć przycisku UIButton zamiast tworzyć UILabel którego można dotknąć. Skorzystaj z tego przykładu tylko, jeśli jesteś pewien, że z jakiegoś powodu nie chcesz używać UIButton .

  1. Utwórz etykietę
  2. Włącz interakcję użytkownika
  3. Dodaj UITapGestureRecognizer

Kluczem do utworzenia klikalnego UILabel jest umożliwienie interakcji użytkownika.

Szybki

let label = UILabel()
label.userInteractionEnabled = true

let gesture = UITapGestureRecognizer(target: self, action: #selector(labelClicked(_:)))
label.addGestureRecognizer(gesture)

Cel C

UILabel *label = [[UILabel alloc] init];
[label setUserInteractionEnabled:YES];

UITapGestureRecognizer* gesture = [[UITapGestureRecognizer alloc] initWithTarget:self action:@selector(labelClicked:)];
[label addGestureRecognizer:gesture];

Ustawienie „userInteractionEnabled” w inspektorze atrybutów scenorysu

Zamiast używać kodu, możesz wybrać UILabel w serii ujęć i zaznaczyć opcję:

wprowadź opis zdjęcia tutaj

Dynamiczna ramka etykiety od nieznanej długości tekstu

Czasami musimy zmienić rozmiar UILabel na podstawie dynamicznej zawartości, w przypadku której długość tekstu jest nieznana. W tym przykładzie szerokość UILabel jest ustalona na 280 punktów, a wysokość jest nieskończona, powiedzmy 9999. Szacowanie ramki w odniesieniu do stylu tekstu i maximumLabelSize.

Cel C

UILabel * label = [[UILabel alloc] init];

NSString *message = @"Some dynamic text for label";

//set the text and style if any.
label.text = message;

label.numberOfLines = 0;

CGSize maximumLabelSize = CGSizeMake(280, 9999); //280:max width of label and 9999-max height of label.

// use font information from the UILabel to calculate the size
CGSize expectedLabelSize = [label sizeThatFits:maximumLabelSize];

//Deprecated in iOS 7.0
//CGSize expectedLabelSize = [message sizeWithFont:label.font constrainedToSize:maximumLabelSize lineBreakMode:NSLineBreakByWordWrapping];

// create a frame that is filled with the UILabel frame data
CGRect newFrame = label.frame;

// resizing the frame to calculated size
newFrame.size.height = expectedLabelSize.height;

// put calculated frame into UILabel frame
label.frame = newFrame;

Szybki

var message: String = "Some dynamic text for label"
//set the text and style if any.
label.text = message
label.numberOfLines = 0
var maximumLabelSize: CGSize = CGSize(width: 280, height: 9999)
var expectedLabelSize: CGSize = label.sizeThatFits(maximumLabelSize)
// create a frame that is filled with the UILabel frame data
var newFrame: CGRect = label.frame
// resizing the frame to calculated size
newFrame.size.height = expectedLabelSize.height
// put calculated frame into UILabel frame
label.frame = newFrame

Oznacz tekst przypisany

01. Podkreśl tekst: - Pojedyncza / podwójna linia, przekreśl: - Pojedyncza / podwójna linia

Krok 1

Wybierz etykietę i zmień typ etykiety Zwykły na Przypisany wprowadź opis zdjęcia tutaj wprowadź opis zdjęcia tutaj

Krok 2

Kliknij tekst etykiety i kliknij prawym przyciskiem myszy

wprowadź opis zdjęcia tutaj

Krok 3

Następnie kliknij Czcionka -> Pokaż czcionki

wprowadź opis zdjęcia tutaj

Krok 4

Następnie pojawi się widok czcionek i kliknij przycisk podkreślenia, aby tekst był podkreślony, lub kliknij przycisk przekreślenia, aby przekreślić tekst. Wybierz jedną linię lub podwójną linię.

wprowadź opis zdjęcia tutaj

Na koniec kliknij Enter, a etykieta zostanie podkreślona lub przekreślona zgodnie z twoim wyborem.

wprowadź opis zdjęcia tutaj

02. Dodaj efekty cieniowania / rozmycia tła

Uzyskaj widok Czcionki jak opisano powyżej i kliknij przycisk efektów.

wprowadź opis zdjęcia tutaj

Jeśli nie widzisz podglądu, kliknij pokaż obraz w ustawieniach

wprowadź opis zdjęcia tutaj

Na koniec zmień shaddow i offset zgodnie z własnymi preferencjami.

wprowadź opis zdjęcia tutaj

Wyjustuj tekst

Szybki

let sampleText = "Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum."

// Create label
let label = UILabel(frame: CGRectMake(0, 0, view.frame.size.width, 400))
label.numberOfLines = 0
label.lineBreakMode = NSLineBreakMode.ByWordWrapping

// Justify text through paragraph style
let paragraphStyle = NSMutableParagraphStyle()
paragraphStyle.alignment = NSTextAlignment.Justified
let attributes = [NSParagraphStyleAttributeName: paragraphStyle, NSBaselineOffsetAttributeName: NSNumber(float: 0)]
let attributedString = NSAttributedString(string: sampleText, attributes: attributes)
label.attributedText = attributedString
view.addSubview(label)

Cel C

  NSString *sampleText = @"Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum.";
    
    // Create label
    UILabel *label = [[UILabel alloc] initWithFrame:CGRectMake(0, 0, self.view.frame.size.width, 400)];
    label.numberOfLines = 0;
    label.lineBreakMode = NSLineBreakByWordWrapping;
    
    
    // Justify text through paragraph style
    NSMutableParagraphStyle *paragraphStyle = [[NSMutableParagraphStyle alloc] init];
    paragraphStyle.alignment = NSTextAlignmentJustified;
    NSAttributedString *attributedString = [[NSAttributedString alloc] initWithString:sampleText attributes:@{
                    NSParagraphStyleAttributeName : paragraphStyle,
                    NSBaselineOffsetAttributeName : [NSNumber numberWithFloat:0]
                    }];
    label.attributedText = attributedString;
    [self.view addSubview:label];

Automatycznie dopasuj etykietę do tekstu

Ten przykład pokazuje, jak szerokość etykiety może się automatycznie zmieniać, gdy zmienia się zawartość tekstu.

animowany gif z etykietą automatycznego zmieniania rozmiaru

Przypnij lewą i górną krawędź

Wystarczy użyć układu automatycznego, aby dodać ograniczenia do przypięcia lewej i górnej strony etykiety.

zrzut ekranu: skonfiguruj ograniczenia automatycznego układu

Następnie automatycznie zmieni rozmiar.

Notatki

  • Ten przykład pochodzi z tej odpowiedzi Przepełnienie stosu .

  • Nie dodawaj ograniczeń dla szerokości i wysokości. Etykiety mają rzeczywisty rozmiar na podstawie zawartości tekstu.

  • Nie trzeba ustawiać sizeToFit podczas korzystania z automatycznego układu. Pełny kod przykładowego projektu znajduje się tutaj:

      import UIKit
      class ViewController: UIViewController {
      
          @IBOutlet weak var myLabel: UILabel!
      
          @IBAction func changeTextButtonTapped(sender: UIButton) {
              myLabel.text = "my name is really long i want it to fit in this box"
          }
      }
    
  • Tej metody można również użyć do prawidłowego rozmieszczenia wielu etykiet w poziomie, jak w tym przykładzie .

animowany gif pokazujący automatyczne zmienianie rozmiaru wielu etykiet

  • Jeśli chcesz, aby etykieta myLabel.preferredMaxLayoutWidth = 150 // or whatever w linie, ustaw liczbę linii na 0 w IB i dodaj myLabel.preferredMaxLayoutWidth = 150 // or whatever w kodzie. (Przycisk jest również przypięty do dolnej części etykiety, dzięki czemu przesunie się w dół, gdy wzrośnie wysokość etykiety).

zrzut ekranu: zmiana rozmiaru wielu linii

Uzyskaj rozmiar UILabel ściśle na podstawie tekstu i czcionki

NSString zapewnia metodę boundingRectWithSize której można użyć do przewidywania wynikowego CGSize UILabel na podstawie jego tekstu i czcionki bez potrzeby tworzenia UILabel

Cel C

[[text boundingRectWithSize:maxSize options:(NSStringDrawingTruncatesLastVisibleLine | NSStringDrawingUsesLineFragmentOrigin) attributes:@{NSFontAttributeName: fontName} context:nil] size];

Szybki

let nsText = text as NSString?
nsText?.boundingRectWithSize(maxSize, options: [.TruncatesLastVisibleLine, .UsesLineFragmentOrigin], attributes: [NSFontAttributeName: fontName], context: nil).size

Szybki

Utwórz etykietę i etykietę Ograniczenie wysokości. Dodaj poniższy kod, w którym przypiszesz tekst do etykiety.

@IBOutlet var lblDescriptionHeightConstration: NSLayoutConstraint! 
@IBOutlet weak var lblDescription: UILabel!

let maxWidth = UIScreen.mainScreen().bounds.size.width - 40
let sizeOfLabel = self.lblDesc.sizeThatFits(CGSize(width: maxWidth, height: CGFloat.max))
self.lblDescriptionHeightConstration.constant = sizeOfLabel.height

Uwaga: „40” to przestrzeń lewej i prawej strony ekranu.

Podświetlony i podświetlony kolor tekstu

Cel C

UILabel *label = [[UILabel alloc] init];
label.highlighted = YES;
label.highlightedTextColor = [UIColor redColor];

Szybki

let label = UILabel()
label.highlighted = true
label.highlightedTextColor = UIColor.redColor()

Szybki 3

let label = UILabel()
label.isHighlighted = true
label.highlightedTextColor = UIColor.red


Modified text is an extract of the original Stack Overflow Documentation
Licencjonowany na podstawie CC BY-SA 3.0
Nie związany z Stack Overflow