web-dev-qa-db-fra.com

IOS: Comment créer une ombre pour UIView sur 4 côtés (haut, droite, bas et gauche)

J'utilise le code ci-dessous pour créer l'ombre de ma ImageView

UIBezierPath *shadowPath = [UIBezierPath bezierPathWithRect:self.avatarImageView.bounds];
self.avatarImageView.layer.masksToBounds = NO;
self.avatarImageView.layer.shadowColor = [UIColor blackColor].CGColor;
self.avatarImageView.layer.shadowOffset = CGSizeMake(5.0f, 5.0f);
self.avatarImageView.layer.shadowOpacity = 0.8f;
self.avatarImageView.layer.shadowPath = shadowPath.CGPath;

Il va déposer une ombre à droite et en bas comme cette image. 

 enter image description here

Maintenant, je veux que ma ImageView ait également une ombre en haut et à gauche . Que dois-je changer dans le code? ou dois-je créer un autre mode de mise en page pour l'ombre? Toute aide serait grandement appréciée.

Voici ce que je veux réaliser
 enter image description here

Mettre à jour
Merci @ Dipen Panchasara pour une solution simple. Suivez @ Dipen Panchasara (avec la couleur de l'ombre en noir), j'aurai l'image de l'ombre comme ceci
 enter image description here

iosuiview
21
Linh

Comme ça:

float shadowSize = 10.0f;
UIBezierPath *shadowPath = [UIBezierPath bezierPathWithRect:CGRectMake(self.avatarImageView.frame.Origin.x - shadowSize / 2,
                                                                       self.avatarImageView.frame.Origin.y - shadowSize / 2,
                                                                       self.avatarImageView.frame.size.width + shadowSize,
                                                                       self.avatarImageView.frame.size.height + shadowSize)];
self.avatarImageView.layer.masksToBounds = NO;
self.avatarImageView.layer.shadowColor = [UIColor blackColor].CGColor;
self.avatarImageView.layer.shadowOffset = CGSizeMake(0.0f, 0.0f);
self.avatarImageView.layer.shadowOpacity = 0.8f;
self.avatarImageView.layer.shadowPath = shadowPath.CGPath;

Swift 3 version:

    let shadowSize : CGFloat = 5.0
    let shadowPath = UIBezierPath(rect: CGRect(x: -shadowSize / 2,
                                               y: -shadowSize / 2,
                                               width: self.avatarImageView.frame.size.width + shadowSize,
                                               height: self.avatarImageView.frame.size.height + shadowSize))
    self.avatarImageView.layer.masksToBounds = false
    self.avatarImageView.layer.shadowColor = UIColor.black.cgColor
    self.avatarImageView.layer.shadowOffset = CGSize(width: 0.0, height: 0.0)
    self.avatarImageView.layer.shadowOpacity = 0.5
    self.avatarImageView.layer.shadowPath = shadowPath.cgPath
29
gvuksic

Seul le code suivant fera l'affaire pour votre besoin. Vous n'avez pas besoin de créer UIBezierPath pour le chemin d'accès fantôme.

// *** Set masks bounds to NO to display shadow visible ***
self.avatarImageView.layer.masksToBounds = NO;
// *** Set light gray color as shown in sample ***
self.avatarImageView.layer.shadowColor = [UIColor lightGrayColor].CGColor;
// *** *** Use following to add Shadow top, left ***
self.avatarImageView.layer.shadowOffset = CGSizeMake(-5.0f, -5.0f);

// *** Use following to add Shadow bottom, right ***
//self.avatarImageView.layer.shadowOffset = CGSizeMake(5.0f, 5.0f);

// *** Use following to add Shadow top, left, bottom, right ***
// avatarImageView.layer.shadowOffset = CGSizeZero;
// avatarImageView.layer.shadowRadius = 5.0f;

// *** Set shadowOpacity to full (1) ***
self.avatarImageView.layer.shadowOpacity = 1.0f;
37
Dipen Panchasara

Petit moins code pour Swift 3:

    view.layer.shadowColor = UIColor.black.cgColor
    view.layer.shadowOpacity = 0.7
    view.layer.shadowOffset = CGSize.zero
    view.layer.shadowRadius = 4
    view.layer.shadowPath = UIBezierPath(rect: planView.bounds).cgPath
3
GIJOW

Pour UIView et Adding shadow, n'oubliez pas de définir la couleur d'arrière-plan sur UIView.

Si la couleur d'arrière-plan est clearColor, aucune ombre n'apparaît.

0
karim
**in Swift 4**

  yourView.clipsToBounds = true
    yourView.layer.cornerRadius = 20
    yourView.layer.shadowPath = UIBezierPath(roundedRect: self.yourView.bounds,
                     cornerRadius: self.DeletConversation.layer.cornerRadius).cgPath
    yourView.layer.shadowColor = UIColor(hexString: "color")?.cgColor
    DeletConversation.layer.shadowOpacity = 1
    DeletConversation.layer.shadowOffset = CGSize(width: 0, height: 1.0)
    DeletConversation.layer.shadowRadius = 1
    DeletConversation.layer.masksToBounds = false
0
BM LADVA

CGRectInset (self.avatarImageView.bounds, -10.0, -10.0)

0
Mysiaq

// Si vous avez déjà essayé cela, vous savez exactement ce qui se passe. Les coins seront arrondis, mais l'ombre manquera. Si vous définissez masksToBounds sur false, l'ombre apparaît, mais les coins ne seront pas arrondis . // pour obtenir une ombre avec un rayon de coin Ajoutez une super vue pour la vue conteneur avec une couleur claire et appliquez une ombre pour une super vue Appliquez un rayon de coin pour la vue conteneur. l'essayer.

   //view to apply shadow and corner radius
    containerView.layer.cornerRadius = 3
    containerView.clipsToBounds = true
    //superview of container View for to apply shadow 
    shadowView.layer.shadowOpacity = 0.1
    shadowView.layer.shadowRadius = 2.0
    shadowView.layer.masksToBounds = false
    shadowView.layer.shadowOffset = CGSize.zero

    shadowView.layer.shadowColor = UIColor.Black.cgColor

    shadowView.layer.shadowPath = UIBezierPath(roundedRect:containerView.bounds, cornerRadius: containerView.layer.cornerRadius).cgPath
    shadowView.layer.shouldRasterize = true
0
Konamki Bhubala