2017-02-16 17 views
1

У меня есть пользовательский UIButton, который я создал. Внутри кнопки у меня есть две метки, одна над другой. Верхний - это заголовок, поэтому он немного больше, а нижний немного меньше. Моя цель состоит в том, чтобы обе эти метки полностью покрывали всю кнопку: Верхняя этикетка будет охватывать верхнюю часть 2/3 кнопки, а нижняя часть будет закрывать остальные 1/3 кнопки. Моя цель находится недалеко от достижения, но я получаю странное поведение - ярлыки немного выходят из кнопки, и в некоторых случаях они исчезают (я могу щелкнуть по кнопке, но не вижу метки). Это мой обычай UIButton для справки, я надеюсь, что этот код будет помогать людям, независимо от отношения к моему вопросу:Программно установлен размер рамки меток внутри UIButton

class ButtonWithStats: UIButton { 

var num: Int 
var name: String 
var nameLabel: UILabel? 
var numLabel: UILabel? 
required init?(coder aDecoder: NSCoder) { 
    // fatalError("init(coder:) has not been implemented") 
    self.num = 0 
    self.name = "" 

    self.numLabel = UILabel(frame: CGRect(x: 0, y: 0, width: 0, height: 0)) //just to init the labels. 
    self.nameLabel = UILabel(frame: CGRect(x: 0, y: 0, width: 0, height: 0)) 
    self.numLabel?.textAlignment = .center 
    self.nameLabel?.textAlignment = .center 
    self.numLabel?.textColor = UIColor.purple 
    self.nameLabel?.textColor = UIColor.black 
    self.numLabel?.font = UIFont.init(name: "Helvetica", size: 11) 
    self.nameLabel?.font = UIFont.init(name: "Helvetica", size: 13) 
    super.init(coder: aDecoder) 
} 

func setButton(numInput: Int, nameInput: String){ 
    self.num = numInput 
    self.name = nameInput 
    self.setLabels() 
} 

private func setLabels(){ 

    numLabel?.text = String(self.num) 
    nameLabel?.text = self.name 
    let widthForName = self.frame.width 
    let heightForName = self.frame.height * 2/3 
    nameLabel?.center = self.center 
    nameLabel?.frame = CGRect(origin: self.frame.origin, size: CGSize(width: widthForName, height: heightForName)) 
    let widthForNum = self.frame.width 
    let heightForNum = self.frame.height * 1/3 
    let yForNum = (self.frame.height * 2/3) //+ self.frame.origin.y 
    numLabel?.frame = CGRect(x: self.frame.origin.x, y: yForNum, width: widthForNum, height: heightForNum) 
    self.addSubview(nameLabel!) 
    self.addSubview(numLabel!) 
    print("@@@@@@@@@@@@@@@@@@@@@@@@@") 
    print("Button \(self.nameLabel?.text) frame is: \(self.frame)") 
    print("Label frame is: \(self.nameLabel?.frame)") 
    print("Num frame is: \(self.numLabel?.frame)") 
    print("@@@@@@@@@@@@@@@@@@@@@@@@@") 
} 
} 

моих консоли печатают эти данные:

@@@@@@@@@@@@@@@@@@@@@@@@@ 
Button Optional("button one") frame is: (257.5, 0.0, 64.5, 33.0) 
Label frame is: Optional((257.5, 0.0, 64.5, 22.0)) 
Num frame is: Optional((257.5, 22.0, 64.5, 11.0)) 
@@@@@@@@@@@@@@@@@@@@@@@@@ 
@@@@@@@@@@@@@@@@@@@@@@@@@ 
Button Optional("Button two") frame is: (129.0, 0.0, 64.0, 33.0) 
Label frame is: Optional((129.0, 0.0, 64.0, 22.0)) 
Num frame is: Optional((129.0, 22.0, 64.0, 11.0)) 
@@@@@@@@@@@@@@@@@@@@@@@@@ 
@@@@@@@@@@@@@@@@@@@@@@@@@ 
Button Optional("Button three") frame is: (0.0, 0.0, 64.5, 33.0) 
Label frame is: Optional((0.0, 0.0, 64.5, 22.0)) 
Num frame is: Optional((0.0, 22.0, 64.5, 11.0)) 
@@@@@@@@@@@@@@@@@@@@@@@@@ 

ответ

1

Вместо добавления 2 этикетки, как о настройке numberOfLines на UIButtonstextLabel?

button.titleLabel?.numberOfLines = 2 

Или же, добавить вертикальную UIStackView, с 2-лейблов подвидов и установить stackView.frame = button.bounds

let stackView = UIStackView(arrangedSubviews: [numLabel, nameLabel]) 
stackView.frame = buttonView.bounds 
addSubview(stackView) 

Вы можете настроить stackView.spacing/layoutMargins и т.д., чтобы расположить метки в соответствии с требованиями

Чтобы сделать numLabel вдвое больше высоты nameLabel, вы можете использовать заданные ограничения, используя ...

numLabel.heightAnchor.constraint(equalTo: nameLabel.heightAnchor, multiplier: 2) 

Я бы рекомендовал вам сделать это в раскадровке/xib, но если вам нужно сделать это программно, вам может быть полезно создать xib, чтобы поэкспериментировать с настройками UIStackView.

+0

Мне нравится идея стека, будет обновляться! – Sharonica

+0

Как вы можете установить размеры 2/3 и 1/3 с помощью представления стека? – Sharonica

+0

большое спасибо! @Ashley Mills – Sharonica