web-dev-qa-db-ja.com

Swift-2行のテキストを含むUIButton

2行のテキストでUIButtonを作成できるかどうか疑問に思っていました。各行のフォントサイズを変える必要があります。 1行目は17ポイントで、2行目は11ポイントです。 UIButton内に2つのラベルを配置することをいじりましたが、それらをボタンの境界内に留めることはできません。

プログラムではなく、UIビルダーでこのすべてを実行しようとしています。

ありがとう

iosswiftuibutton
82
Scott

2つの質問があります。

2行のテキストでUIButtonを作成することが可能かどうか疑問に思っていました

これは、ストーリーボードを使用して、またはプログラムで可能です。

ストーリーボード：

「改行モード」を文字の折り返しまたは単語の折り返しに変更し、Alt/Option + Enterキーを使用してUIButtonに新しい行を入力しますタイトルフィールド。

enter image description here

プログラムで：

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

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

各行に異なるフォントサイズが必要です1

最悪の場合、カスタムUIButtonクラスを使用して、その中に2つのラベルを追加できます。

より良い方法は、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

198
Shamsudheen TK

2つの異なるフォントサイズを必要としないことを除いて、ほぼ同じトピックを探していました。誰かが簡単な解決策を探している場合：

    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)
17
Nico S.

ほとんどのソリューションで、改行モードを「文字の折り返し」にすると、2行目が最初の行に揃えられたままになるという問題に気付きました。

すべての線を中央に配置します。タイトルを「プレーン」から「属性」に変更すると、各行を中央に配置できます

attributed centered title

11
Musa almatri

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)
6
Maksim Kniazev

改行を文字の折り返しに変更し、ボタンを選択し、属性インスペクターで改行に移動して文字の折り返しに変更します

enter image description here

5
Sabhay Sardana

私はこれを修正し、私のソリューションはストーリーボードのみにありました。

変更：

Identity Inspector-> User Defined Runtime Attributes（これらのKeyPaths）に追加しました：

  • numberOfLines = 2
  • titleLabel.textAlignment = 1

ユーザー定義のランタイム属性

これを属性インスペクターに追加しました：

  • 改行=ワードラップ

ワードラップ

3
A. Trejo

それを行う1つの方法は、ラベルを使用することです。私はこれをしましたが、うまくいくようです。これを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)
1
Scott

これのいくつかをコードで行う必要があります。 IBで2つの異なるフォントを設定することはできません。改行モードを文字の折り返しに変更することに加えて、タイトルを設定するには次のようなものが必要です。

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)

    }
1
rdelmar