Rapide
// corner radius
blueView.layer.cornerRadius = 10
// border
blueView.layer.borderWidth = 1.0
blueView.layer.borderColor = UIColor.black.cgColor
// shadow
blueView.layer.shadowColor = UIColor.black.cgColor
blueView.layer.shadowOffset = CGSize(width: 3, height: 3)
blueView.layer.shadowOpacity = 0.7
blueView.layer.shadowRadius = 4.0
Explorer les options
Problème 1: l'ombre est coupée
Et s'il y a des sous-couches ou des sous-vues (comme une image) dont nous voulons couper le contenu aux limites de notre vue?
Nous pouvons accomplir cela avec
blueView.layer.masksToBounds = true
(Alternativement, blueView.clipsToBounds = true
donne le même résultat .)
Mais, oh non! L'ombre a également été coupée car elle est en dehors des limites! Que faire? Que faire?
Solution
Utilisez des vues distinctes pour l'ombre et la bordure. La vue de base est transparente et présente l'ombre. La vue de bordure découpe tout autre sous-contenu dont elle dispose sur ses bordures.
// add the shadow to the base view
baseView.backgroundColor = UIColor.clear
baseView.layer.shadowColor = UIColor.black.cgColor
baseView.layer.shadowOffset = CGSize(width: 3, height: 3)
baseView.layer.shadowOpacity = 0.7
baseView.layer.shadowRadius = 4.0
// add the border to subview
let borderView = UIView()
borderView.frame = baseView.bounds
borderView.layer.cornerRadius = 10
borderView.layer.borderColor = UIColor.black.cgColor
borderView.layer.borderWidth = 1.0
borderView.layer.masksToBounds = true
baseView.addSubview(borderView)
// add any other subcontent that you want clipped
let otherSubContent = UIImageView()
otherSubContent.image = UIImage(named: "lion")
otherSubContent.frame = borderView.bounds
borderView.addSubview(otherSubContent)
Cela donne le résultat suivant:
Problème 2: performances médiocres
Ajouter des coins arrondis et des ombres peut être un succès. Vous pouvez améliorer les performances en utilisant un chemin prédéfini pour l'ombre et en spécifiant également qu'il doit être pixellisé. Le code suivant peut être ajouté à l'exemple ci-dessus.
baseView.layer.shadowPath = UIBezierPath(roundedRect: baseView.bounds, cornerRadius: 10).cgPath
baseView.layer.shouldRasterize = true
baseView.layer.rasterizationScale = UIScreen.main.scale
Voir cet article pour plus de détails. Voir ici et ici aussi.
Cette réponse a été testée avec Swift 4 et Xcode 9.