iOS 7 button encadré rond

Vous pouvez manipuler le CALayer de votre button pour le faire assez facilement.

 // assuming you have a UIButton or more generally a UIView called buyButton buyButton.layer.cornerRadius = 2; buyButton.layer.borderWidth = 1; buyButton.layer.borderColor = [UIColor blueColor].CGColor; // (note - may prefer to use the tintColor of the control) 

vous pouvez ajuster chacun d'entre eux pour get la couleur et l'effet de bordure que vous voulez.

Vous devrez également append une import dans n'importe quel file que vous souhaitez utiliser CALayers

 #import <QuartzCore/QuartzCore.h> 

Si vous êtes un grand fan de l'utilisation de storyboards pour votre design d'interface user avec iOS .. vous pouvez définir le rayon de coin (et d'autres parameters comme mentionné dans la réponse de dima – malheureusement pas la couleur, car c'est un CGColor et Apple actuellement avoir cette option dans le popup) dans l' identity inspector -> user defined runtime atsortingbutes dans le storyboard comme indiqué ici:

bonus: vous utilisez les attributes d'exécution pour la couleur du text de l'espace réservé UIButton (voir ici ) et pour changer les fonts de UILabel , UITextField et UIButton aussi (voir ici )

Pour les éléments de contrôle iOS standard tels que UIButton , UILabel , vous devez utiliser la propriété UIView tintColor :

 buyButton.layer.borderColor = buyButton.tintColor.CGColor; 

Pour une bordure simple comme celle que vous avez décrite, utilisez la réponse de Dima en utilisant CALAyer.

Si vous en voulez plus, par exemple un rectangle arrondi avec dégradé, utilisez cette approche comme base:

Créez une vue personnalisée qui dessine un rectangle arrondi et placez-le sur le button. Utilisez la fonction de search ici pour searchr un rectangle arrondi. Le dessin fonctionne en dessinant 4 arcs avec un rayon défini (coins) et 4 lignes droites.

FTR, voici comment vous faites un UIView avec les bons coins arrondis iOS7, par Alex et Brian.

Je suis assez sûr que CGPathCreateWithRoundedRect ne vous donne pas les "nouveaux" coins arrondis. Vous devez utiliser bezierPathWithRoundedRect pour les "nouveaux" coins.

 #import "UIViewWithIOS7RoundedCorners.h" @implementation UIViewWithIOS7RoundedCorners -(void)drawRect:(CGRect)rect { // for a filled shape... UIBezierPath* path = [UIBezierPath bezierPathWithRoundedRect:self.bounds cornerRadius:4]; [[UIColor blueColor] setFill]; [path fill]; // for just a border... int thickness=2; UIBezierPath* path = [UIBezierPath bezierPathWithRoundedRect: CGRectInset(self.bounds, thickness/2, thickness/2) cornerRadius: 4]; path.lineWidth = thickness; [[UIColor blueColor] setStroke]; [path stroke]; } @end // ps don't forget to set .backgroundColor=[UIColor clearColor] // perhaps in initWithCoder/initWithFrame 

J'espère que ça aide quelqu'un

J'ai mis en place le button de style AppStore ici pour votre reference: ASButton.m

et le projet est ici

J'espère aider:]

Pour étendre l'excellente réponse de @abbood, il est en fait possible de définir la couleur de la bordure et la couleur d'arrière-plan du calque d'une vue à partir de IB, mais cela nécessite un petit travail de préparation.

J'ai créé une catégorie personnalisée sur NSView, CALayer + setUIColor.h.

Le paramètre qui définit les colors de bordure n'a qu'une seule méthode, setBorderUIColor. Il prend une UIColor en input, récupère le NSColor sous-jacent de l'UIColor et applique cette couleur à la couche de la vue.

Ensuite, dans IB, vous ajoutez simplement un atsortingbut d'exécution défini par l'user comme ceci:

KeyPath layer.borderUIColor Type couleur Valeur La couleur souhaitée.

Au moment de l'exécution, le système appelle votre méthode en transmettant l'UIColor définie dans IB. La catégorie obtient la CGColor de l'UIColor et l'applique à la couche.

Vous pouvez le voir dans un projet de travail dans un projet github de la mienne appelé

RandomBlobs

J'ai également fait la même chose pour définir la propriété de couleur d'arrière-plan d'un calque, mais pas dans le projet ci-dessus.

Et pour la version rapide de l'extension de la réponse d'abbood de Duncan C:

 extension CALayer { var borderUIColor: UIColor? { get { if let borderColor = borderColor { return UIColor(CGColor: borderColor) } return nil } set { borderColor = newValue?.CGColor ?? nil } } } 

Avec Swift 3 / iOS 10, vous pouvez créer une sous-class de UIButton afin d'avoir un button personnalisé qui ressemblera au button bleu arrondi dans l'application iOS AppStore.

Le code suivant montre comment gérer correctement la couleur de la teinte (lorsque le button apparaît derrière la vue grisée d'un UIAlertController ), la couleur du titre, la couleur d'arrière-plan surlignée, le style de la bordure, la couleur de la bordure et les encarts de contenu.

CustomButton.swift:

 import UIKit class CustomButton: UIButton { override init(frame: CGRect) { super.init(frame: frame) setProperties() } required init?(coder aDecoder: NSCoder) { super.init(coder: aDecoder) // Make sure to set CustomButton as the class of the UIButton in Identity inspector of storyboard // Make sure to set Custom as the type of the UIButton in Atsortingbutes inspector of storyboard setProperties() } func setProperties() { // Set tintColor (only if you want to replace the system default tintColor) // tintColor = .red // Set the border's color layer.borderColor = tintColor?.cgColor // Set colors for title's states setTitleColor(tintColor, for: .normal) setTitleColor(.white, for: .highlighted) // Add some margins between the title (content) and the border contentEdgeInsets = UIEdgeInsets(top: 5, left: 10, bottom: 5, right: 10) } override var isHighlighted: Bool { didSet { // Toggle the background color according to button's highlighted state backgroundColor = super.isHighlighted ? tintColor : nil } } override func tintColorDidChange() { super.tintColorDidChange() // When the tint color is changed by the system (eg when the button appears below the dimmed view of a UIAlertController), we have to manually update border color and title's text color layer.borderColor = tintColor?.cgColor titleLabel?.textColor = tintColor } override func draw(_ rect: CGRect) { // Draw the border layer.borderWidth = 1 layer.cornerRadius = 4 layer.masksToBounds = true } } 

ViewController.swift (création de button personnalisé par programme):

 import UIKit class ViewController: UIViewController { override func viewDidLoad() { super.viewDidLoad() let button = CustomButton() button.setTitle("Normal", for: .normal) button.setTitle("Highlighted", for: .highlighted) button.addTarget(self, action: #selector(presentAlert(_:)), for: .touchUpInside) view.addSubview(button) // auto layout button.translatesAutoresizingMaskIntoConstraints = false button.centerXAnchor.constraint(equalTo: view.centerXAnchor).isActive = true button.topAnchor.constraint(equalTo: view.topAnchor, constant: 100).isActive = true } /// Present alert when button is tapped func presentAlert(_ sender: UIButton) { let alertController = UIAlertController(title: "Title", message: "Message", preferredStyle: .alert) let alertAction = UIAlertAction(title: "OK", style: .default) alertController.addAction(alertAction) present(alertController, animated: true, completion: nil) } } 

ViewController.swift (alternative pour créer un button personnalisé dans le storyboard):

 import UIKit class ViewController: UIViewController { @IBOutlet weak var button: CustomButton! override func viewDidLoad() { super.viewDidLoad() button.setTitle("Normal", for: .normal) button.setTitle("Highlighted", for: .highlighted) } /// Present alert when button is tapped @IBAction func presentAlert(_ sender: UIButton) { let alertController = UIAlertController(title: "Title", message: "Message", preferredStyle: .alert) let alertAction = UIAlertAction(title: "OK", style: .default) alertController.addAction(alertAction) present(alertController, animated: true, completion: nil) } } 

L'image ci-dessous montre comment le button personnalisé apparaîtra dans l'état normal, quand le système tinColor est changé (derrière la vue obscurcie d'un UIAlertController ) et dans l'état en highlighted .