異なるタイトルサイズの異なる2つのボタンのタイトルをどのように縦に並べますか？

Question

ユーザー名の横にあるフォローボタンは、縦に中央に表示されているように見えますが、両方のタイトルのベースラインを揃えたいと思っています。

私はこれをプログラムによって並べ替えることを検討しています。

Answer 1

あなたが一定の幅と高さ、あなたのラベルとボタンの両方を持っていないと仮定します。

あなたのコードはthis.Justと同じように見えますが、簡単にLayoutAnchorを使用しています。

func autolayoutTitle() { 
    let label = UILabel() 
    label.backgroundColor = UIColor.red 
    label.textColor = UIColor.white 
    label.text = "Nafeez Zawahir" 
    label.textAlignment = .right 
    view.addSubview(label) 
    label.translatesAutoresizingMaskIntoConstraints = false 
    //label.widthAnchor.constraint(equalToConstant: 150).isActive = true 
    // label.heightAnchor.constraint(equalToConstant: 40).isActive = true 
    label.leftAnchor.constraint(equalTo: view.leftAnchor, constant: 40).isActive = true 
    label.topAnchor.constraint(equalTo: view.topAnchor, constant: 100).isActive = true 

    let button = UIButton() 
    //button.titleLabel?.text = "Follow" 
    button.setTitle("Follow", for: .normal) 
    button.setTitleColor(UIColor.white, for: .normal) 
    button.backgroundColor = UIColor.darkGray 
    view.addSubview(button) 
    button.translatesAutoresizingMaskIntoConstraints = false 
    // button.widthAnchor.constraint(equalToConstant: 100).isActive = true 
    // button.heightAnchor.constraint(equalToConstant: 50).isActive = true 
    button.leftAnchor.constraint(equalTo: label.rightAnchor, constant: 2).isActive = true 


    button.lastBaselineAnchor.constraint(equalTo: label.lastBaselineAnchor).isActive = true 
    // button.lastBaselineAnchor.constraint(equalTo: label.lastBaselineAnchor, constant: -10).isActive = true 


} 

、出力は次のとおりです。

しかし、あなたはあまりにも幅とあなたのラベルの高さだけでなく、あなたのボタンを固定した場合、その後、あなたは調整する必要があり、あなたのボタンのベースライン固定ラベルのベースラインアンカーラベルの高さに依存します。

ラベルの高さがこのように40であるとします。

label.heightAnchor.constraint(equalToConstant: 40).isActive = true 

ボタンのベースラインアンカーは、次のようにする必要があります。以下は

button.lastBaselineAnchor.constraint(equalTo: label.lastBaselineAnchor, constant: -10).isActive = true 

コードです：

func autolayoutTitle() { 
     let label = UILabel() 
     label.backgroundColor = UIColor.red 
     label.textColor = UIColor.white 
     label.text = "Nafeez Zawahir" 
     label.textAlignment = .right 
     view.addSubview(label) 
     label.translatesAutoresizingMaskIntoConstraints = false 
     label.widthAnchor.constraint(equalToConstant: 150).isActive = true 
     label.heightAnchor.constraint(equalToConstant: 40).isActive = true 
     label.leftAnchor.constraint(equalTo: view.leftAnchor, constant: 40).isActive = true 
     label.topAnchor.constraint(equalTo: view.topAnchor, constant: 100).isActive = true 

     let button = UIButton() 
     //button.titleLabel?.text = "Follow" 
     button.setTitle("Follow", for: .normal) 
     button.setTitleColor(UIColor.white, for: .normal) 
     button.backgroundColor = UIColor.darkGray 
     view.addSubview(button) 
     button.translatesAutoresizingMaskIntoConstraints = false 
     button.widthAnchor.constraint(equalToConstant: 100).isActive = true 
     button.heightAnchor.constraint(equalToConstant: 50).isActive = true 
     button.leftAnchor.constraint(equalTo: label.rightAnchor, constant: 2).isActive = true 


     // button.lastBaselineAnchor.constraint(equalTo: label.lastBaselineAnchor).isActive = true 
     button.lastBaselineAnchor.constraint(equalTo: label.lastBaselineAnchor, constant: -10).isActive = true 


    } 

そして、これが出力されます。