web-dev-qa-db-fra.com

Utilisez Storyboard pour masquer UIView et créer des angles arrondis?

Beaucoup de questions comme celle-ci expliquent comment créer un masque par programme et fournir des angles arrondis à une vue UIV.

Existe-t-il un moyen de tout faire dans Storyboard? Demander simplement, car il semble que créer des angles arrondis dans Storyboard permet de distinguer plus clairement entre présentation et logique.

iosxcodeswiftstoryboardautolayout
89
Crashalot

Oui, je m'en sers beaucoup, mais on a déjà répondu à de nombreuses questions comme celle-ci.

Mais de toute façon dans Interface Builder. Vous devez ajouter des attributs d'exécution définis par l'utilisateur comme ceci:

layer.masksToBounds Boolean YES
layer.cornerRadius Number {View's Width/2}

enter image description here

et permettre

Clips subviews

enter image description here

Résultats:

enter image description here

241
Woraphot Chokratanasombat

Vous pouvez le faire dans un scénario en utilisant des propriétés définies par l'utilisateur. Sélectionnez la vue que vous souhaitez arrondir et ouvrez son inspecteur d'identité. Dans la section attributs d'exécution définis par l'utilisateur, ajoutez les deux entrées suivantes:

  • Chemin de la clé: layer.cornerRadius, Type: Nombre, Valeur: (quel que soit le rayon souhaité)
  • Chemin de clé: layer.masksToBounds, Type: Booléen, Valeur: vérifié

Vous devrez peut-être importer QuartzKit dans le fichier de classe correspondant à votre vue (le cas échéant), mais je jure que je l'ai obtenu pour qu'il fonctionne sans le faire. Vos résultats peuvent varier.

EDIT: Exemple de rayon dynamique

extension UIView {

    /// The ratio (from 0.0 to 1.0, inclusive) of the view's corner radius
    /// to its width. For example, a 50% radius would be specified with
    /// `cornerRadiusRatio = 0.5`.
    @IBDesignable public var cornerRadiusRatio: CGFloat {
        get {
            return layer.cornerRadius / frame.width
        }

        set {
            // Make sure that it's between 0.0 and 1.0. If not, restrict it
            // to that range.
            let normalizedRatio = max(0.0, min(1.0, newValue))
            layer.cornerRadius = frame.width * normalizedRatio
        }
    }

}

J'ai vérifié que cela fonctionne dans une aire de jeux.

21
NRitH

Sélectionnez une vue you changed Corner Rediuse , Border Widthe and Border Color also Using StoryBord 

extension UIView {

    @IBInspectable var cornerRadiusV: CGFloat {
        get {
            return layer.cornerRadius
        }
        set {
            layer.cornerRadius = newValue
            layer.masksToBounds = newValue > 0
        }
    }

    @IBInspectable var borderWidthV: CGFloat {
        get {
            return layer.borderWidth
        }
        set {
            layer.borderWidth = newValue
        }
    }

    @IBInspectable var borderColorV: UIColor? {
        get {
            return UIColor(cgColor: layer.borderColor!)
        }
        set {
            layer.borderColor = newValue?.cgColor
        }
    }
}
8
Ananda Aiwale

Même après avoir effectué tous les changements dans le scénarimage, réponse de Woraphot ne fonctionne pas pour moi.

Cela a fonctionné pour moi:

layer.cornerRadius = 10
layer.borderWidth = 1
layer.borderColor = UIColor.blue.cgColor

Réponse longue:

Coins arrondis de UIView/UIButton, etc.

customUIView.layer.cornerRadius = 10

Épaisseur de la frontière

pcustomUIView.layer.borderWidth = 1

Couleur de la bordure

customUIView.layer.borderColor = UIColor.blue.cgColor
0
swiftBoy