如何在iOS按钮上显示带下划线的文本?

15

我想在视图中显示邮件ID,使得单击邮件ID会打开邮件撰写器视图。

我想将按钮文本显示为下划线以显示它是一个超链接,并且对于按钮单击事件调用邮件撰写器视图。目前,我无法显示带有下划线的按钮文本。

我考虑在按钮上方放置一个标签,并调整标签属性以获得带有下划线的文本,但这并没有起作用。

是否有不同的方法可以获得我想要的外观和行为?


以下是在Storyboard中实现相同效果的方法(XCode 6)。 - Satish
9个回答

42

为 @Haider 的回答添加了一张屏幕截图。

注意:只有你选中的文本会被下划线标记,所以如果需要,你可以只标记特定范围。

输入图像描述

最终,我还是在代码中加入了下划线,因为由于某些原因,我无法将粗体与下划线结合使用。可能是因为我所使用的字体,谁知道呢。

@IBOutlet weak var underlineButton: UIButton! {
    didSet {
        let attrs = [
            NSFontAttributeName : UIFont(name: "MyCustomFont-Bold", size: 19.0)!,
            NSUnderlineStyleAttributeName: NSUnderlineStyle.StyleSingle.rawValue,
            NSForegroundColorAttributeName : UIColor.orangeColor()
        ]
        let attrString = NSMutableAttributedString(string: "Button text", attributes:attrs)
        underlineButton.setAttributedTitle(attrString, forState: .Normal)
    }
}

9

在界面构建器中进行操作:

  1. 点击按钮/标签
  2. 在属性检查器中,将 标题/文本 从普通更改为富文本
  3. 选择要显示的文本。
  4. 右键单击它,转到字体->下划线

7

Swift 3.2

if let title = button.titleLabel?.text, title != "" {

    let attributeString = NSMutableAttributedString(string: title)

    attributeString.addAttribute(NSAttributedStringKey.underlineStyle, value: 1, range: NSMakeRange(0, title.count))

    button.titleLabel?.attributedText = attributeString
}

Objective C

NSString *tem = self.myButton.titleLabel.text;

if (tem != nil && ![tem isEqualToString:@""]) {
    NSMutableAttributedString *temString=[[NSMutableAttributedString alloc]initWithString:tem];
    [temString addAttribute:NSUnderlineStyleAttributeName
                      value:[NSNumber numberWithInt:1]
                      range:(NSRange){0,[temString length]}];

    self.myButton.titleLabel.attributedText = temString;
}

5

从iOS 6.0开始,您可以在UIButton中使用NSAttributedString

//create an underlined attributed string
NSAttributedString *titleString = [[NSAttributedString alloc] initWithString:@"Title" attributes:@{NSUnderlineStyleAttributeName : @(NSUnderlineStyleSingle | NSUnderlinePatternSolid)}];

//use the setAttributedTitle method
[yourButton setAttributedTitle:titleString forState:UIControlStateNormal];

3
要实现您想要的效果,您需要使用CGContextStrokePath()在UILabel的CGLayer上绘制下划线。
话虽如此,我建议您重新考虑设计选择。 在Windows桌面应用程序中使按钮文本看起来像超链接是有意义的(例如使用LinkLabel)。 但是,iPhone OS由于其较小的屏幕和需要更大的目标以适应触摸输入而具有不同的用户界面约定。
解决这个问题的“Cocoa Touch”方法是使用UITableView显示邮件ID列表。 为每行提供适当的辅助按钮。 例如,您可以使用UITableViewCellAccessoryDetailDisclosureButton或buttonType为UIButtonTypeContactAdd的UIButton。 然后,附件按钮事件处理程序将启动邮件编辑器。
祝好运,编码愉快!

2

另一个选择是为按钮设置图像。创建一个显示适当文本的图像,按钮将显示该图像而不是文本。

我同意Zack的观点,下划线文本是多余的并违反了界面语法。您首先会在链接中下划线文本,以表明它们具有类似按钮的行为。如果文本已经在按钮中,则无需下划线它以指示它的行为类似于按钮,因为用户已经期望点击后会有动作。


1
如果您有翻译,@TechZen,您需要为每种语言准备图像吗? - new2ios

1
感谢 @Robert Chen 的回答,更新至 Swift 4.1。
let btn = UIButton(type: .system)
btn.frame = CGRect(x: 100, y: 100, width: 100, height: 100)

let attrs = NSAttributedString(string: "➟ More",
               attributes:
[NSAttributedStringKey.foregroundColor: UIColor(red:0.20, green:1.00, blue:1.00, alpha:1.0),
 NSAttributedStringKey.font: UIFont.systemFont(ofSize: 19.0),
 NSAttributedStringKey.underlineColor: UIColor(red:0.20, green:1.00, blue:1.00, alpha:1.0),
 NSAttributedStringKey.underlineStyle: NSUnderlineStyle.styleSingle.rawValue])

btn.setAttributedTitle(attrs, for: .normal)

enter image description here


0

如果您想在文本块中提供指向网站的链接怎么办?用户需要一些视觉提示,以表明该文本是一个链接,并将他们带到某个地方。

蓝色下划线超链接外观是预期的规范,但请注意这是 PC 的方式。那么 iPhone 的方式是什么呢?

我过去使用过自定义按钮,没有背景等,蓝色文本,虽然没有下划线,但它确实允许可点击的文本。

很想知道其他人做什么....


0

简单易用,使用Webview并插入一块HTML代码块来显示iPhone无法完成但HTML可以的任何文本。


1
简单就是优秀的代名词,这有什么难理解的呢? - Luda

网页内容由stack overflow 提供, 点击上面的
可以查看英文原文,
原文链接