UIB кнопка з двома рядками тексту в заголовку (numberOfLines = 2)


86

Я намагаюся зробити UIButtonте, що має два рядки тексту в заголовку Label. Це код, який я використовую:

    UIButton *titleButton = [[UIButton alloc] initWithFrame:CGRectMake(15, 10, frame.size.width-100, 100)];
    titleButton.titleLabel.font = [UIFont boldSystemFontOfSize:24.0];
    [titleButton setTitle:@"This text is very long and should get truncated at the end of the second line" forState:UIControlStateNormal];
    titleButton.titleLabel.lineBreakMode = UILineBreakModeTailTruncation;
    titleButton.titleLabel.numberOfLines = 2;
    [self addSubview:titleButton];

Коли я спробую це, текст відображається лише в одному рядку. Здається, єдиним способом досягти більше одного рядка тексту UIButton.titleLabelє встановлення numberOfLines=0та використання UILineBreakModeWordWrap. Але це не гарантує, що текст складатиме рівно два рядки.

UILabelОднак використання звичайного простору працює:

    UILabel *titleLabel = [[UILabel alloc] initWithFrame:CGRectMake(15, 10, frame.size.width-100, 100)];
    titleLabel.font = [UIFont boldSystemFontOfSize:24.0];
    titleLabel.text = @"This text is very long and should get truncated at the end of the second line";
    titleLabel.numberOfLines = 2;
    titleLabel.lineBreakMode = UILineBreakModeTailTruncation;
    [self addSubview:titleLabel];

Хтось знає, як зробити UIButtonтвір двома рядками? Чи є єдиним рішенням створити окремий текст UILabelдля зберігання тексту та додати його як підпрогляд кнопки?


1
Ви це бачили ? - stackoverflow.com/questions/604632 / ...
Viraj

Вірадж, так, якщо встановити numberOfLines=0і використовувати UILineBreakModeWordWrap, можна отримати кілька рядків. Проблема в тому, що він може дати більше двох рядків, якщо текст занадто довгий. Мені потрібні рівно два самотники з еліпсами в кінці другого рядка (якщо текст занадто довгий).
маркетолог

О, тоді я думаю, що додавання підпрогляду може бути єдиним шляхом.
Viraj

Відповіді:


87

Оновлена ​​відповідь для останніх версій iOS

Оскільки це прийнята відповідь, додав тут відповідь @ Sean:

Встановіть ці властивості на titleLabel вашої кнопки.

button.titleLabel.lineBreakMode = NSLineBreakByWordWrapping;
button.titleLabel.numberOfLines = 2; // if you want unlimited number of lines put 0

Свіфт 3 і 4:

button.titleLabel?.lineBreakMode = .byWordWrapping
button.titleLabel?.numberOfLines = 2 // if you want unlimited number of lines put 0

Оригінальна відповідь для старішої версії iOS

Якщо ви хочете 2 рядки тексту поверх вашого, UIButtonви повинні додати UIlabelповерх нього, який робить саме це.

UILabel *titleLabel = [[UILabel alloc] initWithFrame:CGRectMake(15, 10, frame.size.width-100, 100)];
titleLabel.font = [UIFont boldSystemFontOfSize:24.0];
titleLabel.text = @"This text is very long and should get truncated at the end of the second line";
titleLabel.numberOfLines = 2;
titleLabel.lineBreakMode = UILineBreakModeTailTruncation;
[myButton addSubview:titleLabel]; //add label to button instead.

Оновлено для рішення конструктора інтерфейсів

Додано відповідь @Borut Tomazin для більш повної відповіді. Знову оновив цю частину, оскільки відповідь @Borut Tomazin була вдосконалена.

Ви можете зробити це набагато простіше, не вимагаючи коду. У Interface Builder встановіть Line Breakна UIButton значення Word Wrap. Чим ви можете вставити кілька рядків заголовка. Просто натисніть Option + Returnклавіші, щоб створити новий рядок. Вам також потрібно буде додати це до визначеного користувачем атрибуту виконання в Interface Builder:

titleLabel.textAlignment Number [1]

5
UILineBreakModeзастаріли, використовуйте NSLineBreakModeзамість нього
Гійом

2
Це непотрібно щодо останніх версій iOS. Дивіться відповідь @ sean.
cbowns

146

Вам не потрібно додавати UILabel до кнопки UIB. Це лише зайві предмети і робота.

Встановіть ці властивості на titleLabel вашої кнопки.

button.titleLabel.lineBreakMode = NSLineBreakByWordWrapping;
button.titleLabel.numberOfLines = 2;//if you want unlimited number of lines put 0

Стрімкий:

button.titleLabel!.lineBreakMode = NSLineBreakMode.ByWordWrapping
button.titleLabel!.numberOfLines = 2//if you want unlimited number of lines put 0

6
Це 2013 рік, і на сьогодні це сучасне рішення.
Клаас,

@Blip, на жаль, ви не можете, і це потрібно робити в коді. Можливо, варто подати звіт про помилку в Apple із запитом на цю функцію.
bpapa

@bpapa Так, я згоден, розкадровки повинні бути більш гнучкими.
Blip

6
Це працює для мене, однак воно порушує поведінку кнопки за замовчуванням intrinsicContentSize, яка все одно повертає висоту, яка відповідає лише одному рядку тексту. Я виправив це, замінивши кнопки, intrinsicContentSizeде я встановив висоту [self.titleLabel sizeThatFits(CGSizeMake(self.titleLabel.frame.size.width, CGFLOAT_MAX)].height.
Еліза

@WillVonUllrich, оскільки прийняту відповідь ви можете змінити лише тоді, коли її буде відредаговано. Я додав ці відповіді до прийнятої, щоб це допомогло людям, які не дивляться далі, ніж прийнята відповідь.
Totumus Maximus

88

Ви можете зробити це набагато простіше, не вимагаючи коду. У Interface Builder встановіть Line Breakна UIButton значення Word Wrap. Чим ви можете вставити кілька рядків заголовка. Просто натисніть Option + Returnклавіші, щоб створити новий рядок. Вам також потрібно буде додати це до визначеного користувачем атрибуту виконання в Interface Builder:

titleLabel.textAlignment Number [1]

Це все так просто. Сподіваюся, це допоможе ...


1
Це рішення є кращим (менше об’єктів, коду), ніж прийняте в даний час, для простих випадків.
Джонатан Чжан,

1
Ви встановлюєте такі самі властивості, як і програмно, тому ваш аргумент "менше об'єктів" є недійсним. Код, можливо, менше. Але це читабельніше. Виберіть;)
Totumus Maximus

О, мені здається незрозумілим. Дякуємо за спробу пояснити. Не так сильно хвилювався той факт, що це робиться в IB vs Code. Більше пов’язано з тим, що вам не потрібно додавати додаткову етикетку з рішенням Борута, і це також робить те саме. Але так, обидва чудово працюють. :)
Джонатан Чжан,

дійсно переважно, коли для такого базового завдання потрібно йти на код.
Кан Пойразоглу

3
Ви можете досягти тієї самої мети на 100% без коду, додавши визначений titleLabel.textAlignment користувачем атрибут виконання в Interface Builder та встановивши для нього значення Number = 1 (значення NSTextAlignmentCenter).
0xced

21
 button.titleLabel.lineBreakMode = NSLineBreakByWordWrapping;

button.titleLabel.textAlignment = NSTextAlignmentCenter;

[button setTitle: @"Line1\nLine2" forState: UIControlStateNormal];

Ідеальний! Не потрібно розбивати NSStringвнутрішню частину setTitle. WordWrapping`` робить це за вас!
Alex Cio

Для мене мені довелося розділити рядок всередині встановленого заголовка. Без цього це не спрацювало
user1960169

9

Щоб повністю уникнути необхідності редагувати код і, отже, необхідності підкласувати свій погляд, у Xcode5 та новіших версіях ви можете дотримуватися пропозиції Борута Томазіна:

У Interface Builder (або розкадровці) встановіть Розрив рядка на Обтікання словами. Чим ви можете вставити кілька рядків заголовка. Просто натисніть Option+ Returnклавіші, щоб створити новий рядок.

а потім у визначених користувачем атрибутах виконання, які ви можете додати

Шлях ключа: titleLabel.textAlignment
Тип: Number
Значення:1

Примітка: це може бути не повністю "майбутнім доказом", оскільки ми переводимо UITextAlignmentCenterконстанту в її числове значення (і ця константа може змінюватися в міру випуску нових версій iOS), але найближчим часом це здається безпечним.


0

Ви можете змінити необхідне значення безпосередньо з Storyboard. Виберіть кнопку, перейдіть до інспектора ідентифікаційних даних та додайте таку пару ключ-значення у розділі «Визначені користувачем атрибути виконання»:

введіть тут опис зображення

Використовуючи наш веб-сайт, ви визнаєте, що прочитали та зрозуміли наші Політику щодо файлів cookie та Політику конфіденційності.
Licensed under cc by-sa 3.0 with attribution required.