Comment créer une ombre portée de UINavigationBar

Question

Voudrais savoir créer de l'ombre portée pour UINavigationbar. J'ai essayé de créer de la barre de navigation personnalisée d'arrière-plan avec ombre portée, mais l'ombre portée couvrir l'arrière-plan de la vue.

@implementation UINavigationBar (CustomImage)
- (void)drawRect:(CGRect)rect {
   UIImage *image = [[UIImage imageNamed:@"titleBar.png"] retain];;
   [image drawInRect:rect];
   [image release];
}

- (CGSize)sizeThatFits:(CGSize)size {
   CGSize newSize = CGSizeMake(320,50);
   return newSize;
}
@end

I also tried on following solution: http://www.travisboudreaux.com/adding-a-drop-shadow-to-a-uinavigationbar: 

@interface UINavigationBar (dropshadow)

-(void) applyDefaultStyle;

@end

@implementation UINavigationBar (dropshadow)

-(void)willMoveToWindow:(UIWindow *)newWindow{
   [self applyDefaultStyle];
}

- (void)applyDefaultStyle {
  // add the drop shadow
  self.layer.shadowColor = [[UIColor blackColor] CGColor];
  self.layer.shadowOffset = CGSizeMake(0.0, 3.0);
  self.layer.shadowOpacity = 0.25;
}
@end

Il montre une baisse de l'ombre pour mon navigationbar bouton, mais pas la barre de navigation lui-même.

Solution Finale: Voici comment j'ai créer de l'ombre portée pour UINavigationBar. Un grand merci pour MusiGenesis pour souligner le chaînon manquant de mon code:

#import <QuartzCore/QuartzCore.h>

@interface UINavigationBar (CustomImage)

-(void) applyDefaultStyle;

@end

//Override For Custom Navigation Bar
@implementation UINavigationBar (CustomImage)
- (void)drawRect:(CGRect)rect {
    UIImage *image = [UIImage imageNamed: @"titleBar.png"];
    [image drawInRect:CGRectMake(0, 0, 320, 44)];   
}

-(void)willMoveToWindow:(UIWindow *)newWindow{
    [super willMoveToWindow:newWindow];
    [self applyDefaultStyle];
}

- (void)applyDefaultStyle {
    // add the drop shadow
    self.layer.shadowColor = [[UIColor blackColor] CGColor];
    self.layer.shadowOffset = CGSizeMake(0.0, 3);
    self.layer.shadowOpacity = 0.25;
    self.layer.masksToBounds = NO;
    self.layer.shouldRasterize = YES;
}

@end

** N'oubliez pas d'importer quartzcore ou jeté de l'erreur.

Answer 1

Si vous appliquez une ombre portée à UINavigationBar , l’ombre est coupée en dessous des coins:

C’est comme ça que les ombres se comportent sur des rectangles. Je crée généralement un chemin pour l'ombre un peu plus large que la barre de navigation réelle, ce qui crée un effet qui ressemble davantage à ce à quoi vous vous attendiez généralement:

 @implementation UINavigationBar (DropShadow)

-(void)willMoveToWindow:(UIWindow *)newWindow {
    [super willMoveToWindow:newWindow];
    self.layer.shadowColor = [UIColor blackColor].CGColor;
    self.layer.shadowOpacity = 1;
    self.layer.shadowOffset = CGSizeMake(0,4);
    CGRect shadowPath = CGRectMake(self.layer.bounds.origin.x - 10, self.layer.bounds.size.height - 6, self.layer.bounds.size.width + 20, 5);
    self.layer.shadowPath = [UIBezierPath bezierPathWithRect:shadowPath].CGPath;
    self.layer.shouldRasterize = YES;
}
 

Answer 2

En applyDefaultStyle , essayez d'ajouter cette ligne:

 self.layer.masksToBounds = NO;
 

La valeur par défaut de cette propriété est YES , ce qui signifie que même si l'ombre est restituée, elle ne sera pas rendue en dehors des limites de la vue, ce qui signifie que vous ne la verrez pas du tout. .

Si vous animez cette vue de quelque manière que ce soit, vous devez également ajouter cette ligne:

 self.layer.shouldRasterize = YES;
 

... sauf si vous souhaitez que l'animation soit lente et saccadée.

Answer 3

Depuis iOS 6.0, UINavigationBar a une propriété shadowImage:

 @property(nonatomic,retain) UIImage *shadowImage NS_AVAILABLE_IOS(6_0) UI_APPEARANCE_SELECTOR;
 

ce qui bien sûr simplifie grandement cette tâche très courante: D

Answer 4

Je colle le code de dessin ombre dans une fonction pour garder loadView propre. Vous pouvez passer dans l'objet sur lequel vous souhaitez dessiner l'ombre si vous voulez que toutes vos ombres soient cohérentes.

 - (void)loadView
{
    self.view = [[UIView alloc] init];
    self.view.backgroundColor = [UIColor whiteColor];

    [self drawShadow];
}


- (void)drawShadow
{
    self.navigationController.navigationBar.backgroundColor = [UIColor clearColor];
    self.navigationController.navigationBar.layer.shadowOpacity = 0.3;
    self.navigationController.navigationBar.layer.shadowOffset = CGSizeMake(0, 0);
    self.navigationController.navigationBar.layer.shadowRadius = 15;
    self.navigationController.navigationBar.layer.masksToBounds = NO;
}