web-dev-qa-db-fra.com

iOS 7: Position de l'image de l'indicateur de dos personnalisé

Je ne parviens pas à définir correctement une image d'indicateur de dos personnalisée. L'indicateur n'est pas centré! 

Voici une photo:

Screenshot showing non-centered custom back indicator image

Je règle l'image de l'indicateur dans la méthode didFinishLaunchingWithOptions: ...

- (BOOL)application:(UIApplication *)application didFinishLaunchingWithOptions:(NSDictionary *)launchOptions {

   UIImage *image = [UIImage imageNamed:@"Back"];
   [UINavigationBar appearance].backIndicatorImage = image;
   [UINavigationBar appearance].backIndicatorTransitionMaskImage = image;

   return YES;
}

Comment puis-je le centrer? 

p.s j'ai déjà lu ceci L'image de l'indicateur de dos personnalisé dans iOS 7 n'est pas centrée verticalement , mais en réalité cela ne fonctionnait pas pour moi. 

iosios7uinavigationbar
16
Manfredi

Cela se produit car vous ne faites que modifier la source de l'image de l'indicateur de dos dans votre UINavigationView, mais pas aussi le cadre. image par défaut du bouton retour iOS 7. L'image du bouton Précédent par défaut est plus grande que la votre et c'est pourquoi elle ne semble pas alignée.

Pour résoudre ce problème, vous devez réinitialiser le cadre de l'indicateur de dos afin qu'il puisse contenir la taille de votre image. Une autre option consiste à créer un UIButton avec la bonne taille d'image et l'image et à l'attribuer à un UIBarButtonItem. Ensuite, vous pouvez remplacer le backBarButtonItem de votre UINavigationItem par le nouveau UIBarButtonItem que vous avez créé.

9
marcopaivaf
 UIEdgeInsets insets = UIEdgeInsetsMake(0, 0, 2, 0);
 UIImage *backArrowImage = [[UIImage imageNamed:@"Back"] imageWithAlignmentRectInsets:insets];

 [[UINavigationBar appearance] setBackIndicatorImage:backArrowImage];
 [[UINavigationBar appearance] setBackIndicatorTransitionMaskImage:backArrowImage];
12
carmen_munich

Cette solution a fonctionné pour moi dans Swift 2.1. iOS 9.2.1. (XCode 7.2) sur iPhone en mode portrait. Je l'ai testé sur les simulateurs iPhone 5 et 6+ et cela a également fonctionné.

import UIKit

class EVEMainNaviVC: UINavigationController
{
    override func viewWillAppear(animated: Bool)
    {
        super.viewWillAppear(animated)
    }

override func viewDidLoad()
{
    super.viewDidLoad()
    self.view.backgroundColor = APP_BACKGROUND_COLOR
    self.setupAppNaviagtionBar()
}


private func setupAppNaviagtionBar()
{
    dispatch_async(dispatch_get_main_queue())
    { () -> Void in
        self.navigationBar.setHeight(55.0)
        self.navigationBar.translucent        = false
        self.navigationBar.alpha              = 1.0
        self.navigationBar.barTintColor       = UIColor.whiteColor()
        let newBackButtonImageInset                         = UIEdgeInsetsMake(0, 0, -6, 0)
        let newBackButtonImage                              = UIImage(named: "back")?.imageWithAlignmentRectInsets(newBackButtonImageInset)
        self.navigationBar.backIndicatorImage               = newBackButtonImage
        self.navigationBar.backIndicatorTransitionMaskImage = newBackButtonImage
        self.navigationBar.tintColor = CUSTOM_BUTTON_COLOR
    }
}
}
1
MB_iOSDeveloper

C’est ainsi que j’ai traité le problème à l’aide de l’API Apparence et que j’ai très bien travaillé. Lorsque vous modifiez l’image backButtonBackgroundImage, elle s’étire automatiquement sur barButtonItem. Nous devons donc la redimensionner à l’original en utilisant resizableImageWithCapInsets: . Pour la positionner à l’intérieur de barButtonItem, nous utilisons ensuite imageWithAlignmentRectInsets to casquettes autour Ensuite, assignez-le simplement avec setBackButtonBackgroundImage: forState: barMetrics .

Il suffit de jouer avec les chiffres et vous trouverez la bonne position.

int imageSize = 24;
UIImage *barBackBtnImg = [[[UIImage imageNamed:@"backButton"] resizableImageWithCapInsets:UIEdgeInsetsMake(0, imageSize, 0, 0)] imageWithAlignmentRectInsets:UIEdgeInsetsMake(0, -10, 0, -10)];
[[UIBarButtonItem appearance] setBackButtonBackgroundImage:barBackBtnImg forState:UIControlStateNormal barMetrics:UIBarMetricsDefault];
1
Borbea

J'ai trouvé la solution la plus simple que j'ai jamais vue. Juste trois choses. 

  1. Remplacez UINavigationBar et utilisez-le dans votre UINavigationController

    let navigationController = UINavigationController(navigationBarClass: NavigationBar.self, toolbarClass: nil)
navigationController.viewControllers = [viewController]

  2. Configurez vos images d'indicateur:

    backIndicatorImage = #imageLiteral(resourceName: "back")
backIndicatorTransitionMaskImage = #imageLiteral(resourceName: "back")

  3. Implémentez layoutSubviews dans votre classe UINavigationBar personnalisée.

    override func layoutSubviews() {
    super.layoutSubviews()

    subviews.forEach { (view) in
        if let imageView = view as? UIImageView {
            if imageView.image == backIndicatorImage || imageView.image == backIndicatorTransitionMaskImage {
                view.frame.Origin.y = floor((frame.height - view.frame.height) / 2.0)
            }
        }
    }
}

C'est tout. :)

0
Kamil Harasimowicz