Respostas:
Você pode definir as propriedades da borda no CALayer acessando a propriedade da camada do botão.
Primeiro, adicione Quartzo
#import <QuartzCore/QuartzCore.h>
Definir propriedades:
myButton.layer.borderWidth = 2.0f;
myButton.layer.borderColor = [UIColor greenColor].CGColor;
Vejo:
https://developer.apple.com/documentation/quartzcore/calayer#//apple_ref/occ/cl/CALayer
O CALayer no link acima permite definir outras propriedades como raio do canto, maskToBounds etc ...
Além disso, um bom artigo sobre diversão com botões:
https://web.archive.org/web/20161221132308/http://www.apptite.be/tutorial_custom_uibuttons.php
CGColor
É muito simples, basta adicionar o cabeçalho quartzCore no seu arquivo (para isso você precisa adicionar a estrutura de quartzo ao seu projeto)
e depois faça isso
[[button layer] setCornerRadius:8.0f];
[[button layer] setMasksToBounds:YES];
[[button layer] setBorderWidth:1.0f];
você pode alterar os valores flutuantes, conforme necessário.
desfrutar.
Aqui estão alguns códigos modernos típicos ...
self.buttonTag.layer.borderWidth = 1.0f;
self.buttonCancel.layer.borderWidth = 1.0f;
self.buttonTag.layer.borderColor = [UIColor blueColor].CGColor;
self.buttonCancel.layer.borderColor = [UIColor blueColor].CGColor;
self.buttonTag.layer.cornerRadius = 4.0f;
self.buttonCancel.layer.cornerRadius = 4.0f;
essa é uma aparência semelhante aos controles segmentados.
ATUALIZAÇÃO para Swift:
Apenas faça:
button.layer.cornerRadius = 8.0
button.layer.borderWidth = 1.0
button.layer.borderColor = UIColor.black.cgColor
E rapidamente, você não precisa importar "QuartzCore / QuartzCore.h"
Apenas use:
button.layer.borderWidth = 0.8
button.layer.borderColor = (UIColor( red: 0.5, green: 0.5, blue:0, alpha: 1.0 )).cgColor
ou
button.layer.borderWidth = 0.8
button.layer.borderColor = UIColor.grayColor().cgColor
O problema ao definir a camada borderWidth
e borderColor
é que, quando você toca no botão, a borda não anima o efeito de destaque.
Obviamente, você pode observar os eventos do botão e alterar a cor da borda de acordo, mas isso parece desnecessário.
Outra opção é criar uma UIImage extensível e defini-la como imagem de fundo do botão. Você pode criar um conjunto de imagens em seus Images.xcassets assim:
Em seguida, defina-a como imagem de fundo do botão:
Se a sua imagem for uma imagem de modelo, você poderá definir a cor da tonalidade do botão e a borda mudará:
Agora a borda será destacada com o restante do botão quando tocada.
borderWidth
.
Aqui está uma versão atualizada ( Swift 3.0.1 ) da resposta de Ben Packard .
import UIKit
@IBDesignable class BorderedButton: UIButton {
@IBInspectable var borderColor: UIColor? {
didSet {
if let bColor = borderColor {
self.layer.borderColor = bColor.cgColor
}
}
}
@IBInspectable var borderWidth: CGFloat = 0 {
didSet {
self.layer.borderWidth = borderWidth
}
}
override var isHighlighted: Bool {
didSet {
guard let currentBorderColor = borderColor else {
return
}
let fadedColor = currentBorderColor.withAlphaComponent(0.2).cgColor
if isHighlighted {
layer.borderColor = fadedColor
} else {
self.layer.borderColor = currentBorderColor.cgColor
let animation = CABasicAnimation(keyPath: "borderColor")
animation.fromValue = fadedColor
animation.toValue = currentBorderColor.cgColor
animation.duration = 0.4
self.layer.add(animation, forKey: "")
}
}
}
}
O botão resultante pode ser usado dentro do seu StoryBoard, graças às tags @IBDesignable
e @IBInspectable
.
Além disso, as duas propriedades definidas permitem definir a largura e a cor da borda diretamente no construtor de interfaces e visualizar o resultado.
Outras propriedades podem ser adicionadas de maneira semelhante, para o raio da borda e destacar o tempo de desbotamento.
prepareForInterfaceBuilder
apenas é chamado do IB, não quando você executa o aplicativo. Portanto, defina também o UIEdgeInsets awakeFromNib
e ele também será exibido ao executar o aplicativo.
Você não precisa importar QuartzCore.h
agora. Tomando iOS 8 sdk e Xcode 6.1 em referência.
Use diretamente:
[[myButton layer] setBorderWidth:2.0f];
[[myButton layer] setBorderColor:[UIColor greenColor].CGColor];
Aqui está uma UIButton
subclasse que suporta a animação de estado destacada sem usar imagens. Também atualiza a cor da borda quando o modo de tonalidade da vista é alterado.
class BorderedButton: UIButton {
override init(frame: CGRect) {
super.init(frame: frame)
layer.borderColor = tintColor.CGColor
layer.borderWidth = 1
layer.cornerRadius = 5
contentEdgeInsets = UIEdgeInsets(top: 5, left: 10, bottom: 5, right: 10)
}
required init?(coder aDecoder: NSCoder) {
fatalError("NSCoding not supported")
}
override func tintColorDidChange() {
super.tintColorDidChange()
layer.borderColor = tintColor.CGColor
}
override var highlighted: Bool {
didSet {
let fadedColor = tintColor.colorWithAlphaComponent(0.2).CGColor
if highlighted {
layer.borderColor = fadedColor
} else {
layer.borderColor = tintColor.CGColor
let animation = CABasicAnimation(keyPath: "borderColor")
animation.fromValue = fadedColor
animation.toValue = tintColor.CGColor
animation.duration = 0.4
layer.addAnimation(animation, forKey: "")
}
}
}
}
Uso:
let button = BorderedButton(style: .System) //style .System is important
Aparência:
Isso pode ser alcançado em vários métodos no Swift 3.0. Worked on Latest version August - 2017
Opção 1:
Atribua diretamente os valores da propriedade borderWidth para o botão UI:
btnUserButtonName.layer.borderWidth = 1.0
Defina o título com os valores de cor padrão para o botão da interface do usuário:
btnUserButtonName.setTitleColor(UIColor.darkGray, for: .normal)
Defina Borda com cor padrão para os valores da propriedade de borda da interface do usuário Botão:
btnUserButtonName.layer.borderColor = UIColor.red
Defina Cor definida pelo usuário para os valores da propriedade da borda da interface do usuário Botão:
let myGrayColor = UIColor(red: 0.889415, green: 0.889436, blue:0.889424, alpha: 1.0 )
btnUserButtonName.layer.borderColor = myGrayColor.cgColor
Opção 2: [Recomendado]
Use o método Extension, para que o botão do aplicativo pareça consistente e sem necessidade de repetir várias linhas de código em todos os lugares.
//Create an extension class in any of the swift file
extension UIButton {
func setBordersSettings() {
let c1GreenColor = (UIColor(red: -0.108958, green: 0.714926, blue: 0.758113, alpha: 1.0))
self.layer.borderWidth = 1.0
self.layer.cornerRadius = 5.0
self.layer.borderColor = c1GreenColor.cgColor
self.setTitleColor(c1GreenColor, for: .normal)
self.layer.masksToBounds = true
}
}
Uso no código:
//use the method and call whever the border has to be applied
btnUserButtonName.setBordersSettings()
Saída do método de extensão Botão:
**** Em Swift 3 ****
Para criar borda
btnName.layer.borderWidth = 1
btnName.layer.borderColor = UIColor.black.cgColor
Para fazer o canto arredondado
btnName.layer.cornerRadius = 5
Swift 5
button.layer.borderWidth = 2
Para alterar a cor da borda, use
button.layer.borderColor = CGColor(srgbRed: 255/255, green: 126/255, blue: 121/255, alpha: 1)