如何为 iOS UIButton 对象实现这种 UI/UX 设计答案

【问题标题】：How to achieve this UI/UX design for an iOS UIButton object如何为 iOS UIButton 对象实现这种 UI/UX 设计
【发布时间】：2017-05-10 20:52:25
【问题描述】：

查看“忘记登录详细信息？获取登录帮助”的超酷 UI 技巧。按钮。他们如何将按钮分成可点击和不可点击的部分？如果不是单个按钮，而是一个标签和一个按钮，那么，他们是如何让按钮的第二行居中的呢？

【问题讨论】：

看起来像网页
试试TTTAttributedLabel或FRHyperLabel

标签： ios swift user-interface uibutton uistoryboard

【解决方案1】：

使用属性字符串设置按钮标题。请参阅下面的代码以供参考。

    func attributedText(){
            // create attributed string
        let attributedString = NSMutableAttributedString(string:"Don't have an account? ")
        let myString = "Sign Up"
        let myAttribute = [ NSForegroundColorAttributeName: UIColor(red: 194/255, green: 159/255, blue: 74/255, alpha: 1.0) ]
        let myAttrString = NSAttributedString(string: myString, attributes: myAttribute) 
        attributedString.append(myAttrString)    
        myCustomButton.setAttributedTitle(attributedString, for: .normal)

    }

【讨论】：

但它不会把整个字符串变成一个按钮而不是“注册”这个词吗？

【解决方案2】：

你也可以这样试试：

这里我使用了两个标签，并在另一个标签上放了一个按钮，我想让它可以点击。

【讨论】：

@Manan 这是公认的答案，但是当用户从 details? 一词中单击 ils? 时，将调用按钮单击事件。所以也许这不是正确的方法。
@ChintaN-Maddy-Ramani 是的，这是真的。但是我们只能做一件事，要么让 UI 保持原样。或者在小右手边制作包含“in”的第二行，这样它就不会覆盖“细节”。有没有其他办法？
我已经评论了按预期工作的库

【解决方案3】：

这是一个标签和一个在蓝色文本上方没有名称的按钮，因此将一个标签拖到您的故事板并将其连接到您的 swift 文件（我将其命名为 labelText）和您想要的文本上方的一个按钮。

然后在你的 viewDidLoad 函数里面放这行：

    // You can change the color as you want
    let color: UIColor = UIColor(red: 2/255.0, green: 202/255.0, blue: 246/255.0, alpha: 1.0)

    let string_to_color = "Get help signing in."

    let titleStr: String = labelText.text!

    let range: NSRange = (titleStr as NSString).rangeOfString(string_to_color)

    let str: NSMutableAttributedString = NSMutableAttributedString(string: titleStr)
    str.addAttribute(NSForegroundColorAttributeName, value: color, range: range)
    //Below line is if you want a line under your colored text
    //str.addAttribute(NSUnderlineStyleAttributeName, value: NSUnderlineStyle.StyleSingle.rawValue, range: range)

    labelText.attributedText = str

现在你准备好了。

编码愉快。

【讨论】：