Подчеркивая текст в UIButton

Question

Кто-нибудь может подсказать, как подчеркнуть название UIButton? У меня есть пользовательский UIButton, и я хочу, чтобы заголовок был подчеркнут, но Интерфейсный Разработчик не предоставляет никакой возможности сделать это.

В Интерфейсном Разработчике, когда вы выбираете параметр «Шрифт» для кнопки, он предоставляет возможность выбрать «Нет», «Одиночный», «Двойной», «Цветной», но ни один из них не обеспечивает каких-либо изменений в заголовке на кнопке.

Любая помощь приветствуется.

Answer 1

Чтобы использовать конструктор интерфейса для подчеркивания, необходимо:

• Измените его на приписанный
• Выделите текст в инспекторе атрибутов
• Щелкните правой кнопкой мыши, выберите шрифт, а затем подчеркните

Видео, которое кто-то еще сделал https://www.youtube.com/watch?v=5-ZnV3jQd9I

Answer 2

В iOS6 теперь можно использовать NSAttributedString для выполнения подчеркивания (и любой другой поддержки атрибутных строк) гораздо более гибким способом:

NSMutableAttributedString *commentString = [[NSMutableAttributedString alloc] initWithString:@"The Quick Brown Fox"];

[commentString addAttribute:NSUnderlineStyleAttributeName value:[NSNumber numberWithInteger:NSUnderlineStyleSingle] range:NSMakeRange(0, [commentString length])];

[button setAttributedTitle:commentString forState:UIControlStateNormal];

Примечание: добавил это как еще один ответ - так как это совершенно другое решение по сравнению с моим предыдущим.

Edit: как ни странно (по крайней мере в iOS8) вы должны подчеркнуть первый символ, иначе он не работает!

В качестве обходного пути установите первый символ, подчеркнутый чистым цветом!

    // underline Terms and condidtions
    NSMutableAttributedString* tncString = [[NSMutableAttributedString alloc] initWithString:@"View Terms and Conditions"];

    // workaround for bug in UIButton - first char needs to be underlined for some reason!
    [tncString addAttribute:NSUnderlineStyleAttributeName
                      value:@(NSUnderlineStyleSingle)
                      range:(NSRange){0,1}];
    [tncString addAttribute:NSUnderlineColorAttributeName value:[UIColor clearColor] range:NSMakeRange(0, 1)];


    [tncString addAttribute:NSUnderlineStyleAttributeName
                      value:@(NSUnderlineStyleSingle)
                      range:(NSRange){5,[tncString length] - 5}];

    [tncBtn setAttributedTitle:tncString forState:UIControlStateNormal];

Answer 3

UIUnderlinedButton.h

@interface UIUnderlinedButton : UIButton {

}


+ (UIUnderlinedButton*) underlinedButton;
@end

UIUnderlinedButton.m

@implementation UIUnderlinedButton

+ (UIUnderlinedButton*) underlinedButton {
    UIUnderlinedButton* button = [[UIUnderlinedButton alloc] init];
    return [button autorelease];
}

- (void) drawRect:(CGRect)rect {
    CGRect textRect = self.titleLabel.frame;

    // need to put the line at top of descenders (negative value)
    CGFloat descender = self.titleLabel.font.descender;

    CGContextRef contextRef = UIGraphicsGetCurrentContext();

    // set to same colour as text
    CGContextSetStrokeColorWithColor(contextRef, self.titleLabel.textColor.CGColor);

    CGContextMoveToPoint(contextRef, textRect.origin.x, textRect.origin.y + textRect.size.height + descender);

    CGContextAddLineToPoint(contextRef, textRect.origin.x + textRect.size.width, textRect.origin.y + textRect.size.height + descender);

    CGContextClosePath(contextRef);

    CGContextDrawPath(contextRef, kCGPathStroke);
}


@end

Answer 4

Вы можете сделать это в самом конструкторе интерфейсов.

1. Выберите инспектор атрибутов
2. Измените тип заголовка с простого на присвоенный

Установить соответствующий размер шрифта и выравнивание текста

Затем выберите текст заголовка и установите шрифт как подчеркнутый

Answer 5

Это очень просто с приписанной строкой

Создает словарь с заданными атрибутами и применяется к приписанной строке. Затем вы можете установить атрибутивную строку как attibutedtitle в uibutton или attributext в uilabel.

NSDictionary *attrDict = @{NSFontAttributeName : [UIFont
 systemFontOfSize:14.0],NSForegroundColorAttributeName : [UIColor
 whiteColor]};
 NSMutableAttributedString *title =[[NSMutableAttributedString alloc] initWithString:@"mybutton" attributes: attrDict]; 
[title addAttribute:NSUnderlineStyleAttributeName value:[NSNumber numberWithInteger:NSUnderlineStyleSingle] range:NSMakeRange(0,[commentString length])]; [btnRegLater setAttributedTitle:title forState:UIControlStateNormal];

Answer 6

Вот моя функция, работает в Swift 1.2.

func underlineButton(button : UIButton, text: String) {

    var titleString : NSMutableAttributedString = NSMutableAttributedString(string: text)
    titleString.addAttribute(NSUnderlineStyleAttributeName, value: NSUnderlineStyle.StyleSingle.rawValue, range: NSMakeRange(0, count(text.utf8)))
    button.setAttributedTitle(titleString, forState: .Normal)
}

ОБНОВЛЕНИЕ Расширение Swift 3.0:

extension UIButton {
    func underlineButton(text: String) {
        let titleString = NSMutableAttributedString(string: text)
        titleString.addAttribute(NSUnderlineStyleAttributeName, value: NSUnderlineStyle.styleSingle.rawValue, range: NSMakeRange(0, text.characters.count))
        self.setAttributedTitle(titleString, for: .normal)
    }
}

Answer 7

Ответ Ника - отличный, быстрый способ сделать это.

Я добавил поддержку drawRect для теней.

Ответ Ника не учитывается, если под заголовком кнопки есть тень под текстом:

Но вы можете переместить подчеркивание на высоту тени следующим образом:

CGFloat descender = self.titleLabel.font.descender;
CGContextRef contextRef = UIGraphicsGetCurrentContext();
CGFloat shadowHeight = self.titleLabel.shadowOffset.height;
descender += shadowHeight;

Тогда вы получите что-то вроде этого:

Answer 8

Для Swift 3 может использоваться следующее расширение:

extension UIButton {
    func underlineButton(text: String) {
        let titleString = NSMutableAttributedString(string: text)
        titleString.addAttribute(NSUnderlineStyleAttributeName, value: NSUnderlineStyle.styleSingle.rawValue, range: NSMakeRange(0, text.characters.count))
        self.setAttributedTitle(titleString, for: .normal)
    }
}

Answer 9

// Only override drawRect: if you perform custom drawing.
// An empty implementation adversely affects performance during animation.
- (void)drawRect:(CGRect)rect {
CGRect textRect = self.titleLabel.frame;

// need to put the line at top of descenders (negative value)
CGFloat descender = self.titleLabel.font.descender;

CGContextRef contextRef = UIGraphicsGetCurrentContext();
UIColor *colr;
// set to same colour as text
if (self.isHighlighted || self.isSelected) {
    colr=self.titleLabel.highlightedTextColor;
}
else{
    colr= self.titleLabel.textColor;
}
CGContextSetStrokeColorWithColor(contextRef, colr.CGColor);

CGContextMoveToPoint(contextRef, textRect.origin.x, textRect.origin.y +        textRect.size.height + descender);

CGContextAddLineToPoint(contextRef, textRect.origin.x + textRect.size.width, textRect.origin.y + textRect.size.height + descender);

CGContextClosePath(contextRef);

CGContextDrawPath(contextRef, kCGPathStroke);
}
//Override this to change the underline color to highlighted color
-(void)setHighlighted:(BOOL)highlighted
{
[super setHighlighted:highlighted];
// [self setNeedsDisplay];
}

Answer 10

Вы можете использовать этот код для добавления подчеркивания с интервалом в кнопке.

• Когда я пытался нарисовать подчеркивание в конструкторе интерфейсов. Это похоже на изображение ниже.

1 - Справочник построителя интерфейса

• И после использования приведенного ниже кода я добился желаемого результата.

2 - с использованием описанного кода

public func setTextUnderline()
    {
        let dummyButton: UIButton = UIButton.init()
        dummyButton.setTitle(self.titleLabel?.text, for: .normal)
        dummyButton.titleLabel?.font = self.titleLabel?.font
        dummyButton.sizeToFit()

        let dummyHeight = dummyButton.frame.size.height + 3

        let bottomLine = CALayer()
        bottomLine.frame = CGRect.init(x: (self.frame.size.width - dummyButton.frame.size.width)/2, y: -(self.frame.size.height - dummyHeight), width: dummyButton.frame.size.width, height: 1.0)
        bottomLine.backgroundColor = self.titleLabel?.textColor.cgColor
        self.layer.addSublayer(bottomLine)
    }