Swift-UIButton с двумя строками текста

Мне было интересно, можно ли создать UIButton с двумя строками текста. Мне нужно, чтобы каждая строка имела другой размер шрифта. Первая линия будет 17 баллов, а вторая-11 баллов. Я пробовал возиться с помещением двух ярлыков внутри UIButton, но я не могу заставить их оставаться внутри границ кнопки.

Я пытаюсь сделать все это в UI builder, а не программно.

спасибо

8 59
ios swift uibutton

8 ответов:

есть два вопроса.

мне было интересно, можно ли создать UIButton с двумя линиями из текста

это возможно с помощью раскадровки или программно.

раскадровка:

измените "режим разрыва строки" на Перенос Символов и использовать Alt / Option + Enter клавиша для ввода новой строки в заголовке UIButton поле.

enter image description here

программно:

override func viewDidAppear(animated: Bool) {
        super.viewDidAppear(animated)

        btnTwoLine?.titleLabel?.lineBreakMode = NSLineBreakMode.ByWordWrapping;
}

мне нужно, чтобы каждая строка имела другой размер шрифта 1

в худшем случае, вы можете использовать пользовательские UIButton класс и добавьте в него две метки.

лучший способ-это использовать NSMutableAttributedString. Обратите внимание, что это может быть достигнуто только программно.

@IBOutlet weak var btnTwoLine: UIButton?

override func viewDidAppear(animated: Bool) {
        super.viewDidAppear(animated)

        //applying the line break mode
        btnTwoLine?.titleLabel?.lineBreakMode = NSLineBreakMode.ByWordWrapping;

        var buttonText: NSString = "hello\nthere"

        //getting the range to separate the button title strings
        var newlineRange: NSRange = buttonText.rangeOfString("\n")

        //getting both substrings
        var substring1: NSString = ""
        var substring2: NSString = ""

        if(newlineRange.location != NSNotFound) {
            substring1 = buttonText.substringToIndex(newlineRange.location)
            substring2 = buttonText.substringFromIndex(newlineRange.location)
        }

        //assigning diffrent fonts to both substrings
        let font:UIFont? = UIFont(name: "Arial", size: 17.0)
        let attrString = NSMutableAttributedString(
            string: substring1 as String,
            attributes: NSDictionary(
                object: font!,
                forKey: NSFontAttributeName) as [NSObject : AnyObject])

        let font1:UIFont? = UIFont(name: "Arial", size: 11.0)
        let attrString1 = NSMutableAttributedString(
            string: substring2 as String,
            attributes: NSDictionary(
                object: font1!,
                forKey: NSFontAttributeName) as [NSObject : AnyObject])

        //appending both attributed strings
        attrString.appendAttributedString(attrString1)

        //assigning the resultant attributed strings to the button
        btnTwoLine?.setAttributedTitle(attrString, forState: UIControlState.Normal)

    }

выход

enter image description here

139

Я искал почти ту же тему, за исключением того, что мне не нужны два разных размера шрифта. В случае, если кто-то ищет простое решение: 

    let button = UIButton()
    button.titleLabel?.numberOfLines = 0
    button.titleLabel?.lineBreakMode = .byWordWrapping
    button.setTitle("Foo\nBar", for: .normal)
    button.titleLabel?.textAlignment = .center
    button.sizeToFit()
    button.addTarget(self, action: #selector(rightBarButtonTapped), for: .allEvents)
    navigationItem.rightBarButtonItem = UIBarButtonItem(customView: button)
8

Я заметил проблему в большинстве решений, которая заключается в том, что при создании режима разрыва строки для "обертывания символов" вторая строка будет выровнена по первой строке

чтобы сделать все линии по центру. просто измените заголовок с простого на приписанный, а затем вы можете сделать каждую строку центрированной

attributed centered title

6

измените разрыв строки на перенос символов, выберите свою кнопку и в инспекторе атрибутов перейдите к разрыву строки и измените его на перенос символов

enter image description here

4

SWIFT 3 синтаксис

let str = NSMutableAttributedString(string: "First line\nSecond Line")
str.addAttribute(NSFontAttributeName, value: UIFont.systemFont(ofSize: 17), range: NSMakeRange(0, 10))
str.addAttribute(NSFontAttributeName, value: UIFont.systemFont(ofSize: 12), range: NSMakeRange(11, 11))
button.setAttributedTitle(str, for: .normal)
4

я исправил это, и мое решение было только в раскадровке.

изменения:

Он добавил Identity Inspector - > Пользовательские Атрибуты Времени Выполнения (эти ключевые пути):

  • numberOfLines = 2
  • titleLabel.textAlignment = 1

Пользовательские Атрибуты Времени Выполнения

Я добавил Это в Инспектор атрибутов:

  • линия перерыв = перенос слов

перенос строк

1

вам нужно сделать это в коде. вы не можете установить 2 разных шрифта в IB. В дополнение к изменению режима разрыва строки на перенос символов, вам нужно что-то вроде этого, чтобы установить заголовок,

override func viewDidLoad() {
        super.viewDidLoad()
        var str = NSMutableAttributedString(string: "First line\nSecond Line")
        str.addAttribute(NSFontAttributeName, value: UIFont.systemFontOfSize(17), range: NSMakeRange(0, 10))
        str.addAttribute(NSFontAttributeName, value: UIFont.systemFontOfSize(12), range: NSMakeRange(11, 11))
        button.setAttributedTitle(str, forState: .Normal)

    }
0

один из способов сделать это с этикетки, я думаю. Я сделал это, и это, кажется, работает нормально. Я мог бы создать это как UIButton, а затем выставить ярлыки, я думаю. Я не знаю, есть ли в этом какой-то смысл.

    let firstLabel = UILabel()

    firstLabel.backgroundColor = UIColor.lightGrayColor()
    firstLabel.text = "Hi"
    firstLabel.textColor = UIColor.blueColor()
    firstLabel.textAlignment = NSTextAlignment.Center
    firstLabel.frame = CGRectMake(0, testButton.frame.height * 0.25, testButton.frame.width, testButton.frame.height * 0.2)
    testButton.addSubview(firstLabel)

    let secondLabel = UILabel()

    secondLabel.backgroundColor = UIColor.lightGrayColor()
    secondLabel.textColor = UIColor.blueColor()
    secondLabel.font = UIFont(name: "Arial", size: 12)
    secondLabel.text = "There"
    secondLabel.textAlignment = NSTextAlignment.Center
    secondLabel.frame = CGRectMake(0, testButton.frame.height * 0.5, testButton.frame.width, testButton.frame.height * 0.2)
    testButton.addSubview(secondLabel)
0