Customize Back Button on Navigation Bar in iOS7

原本以為只是單純的換張圖，就能達到下面的效果。

看到有 initWithImage 直接拿來用~~

UIBarButtonItem *barBtnItem = [[UIBarButtonItem alloc] initWithImage:[UIImage imageNamed:@"ico_back"] style:UIBarButtonItemStyleBordered target:nil action:nil];
self.navigationItem.backBarButtonItem = barBtnItem;

結果變成...

查了一下，發現 iOS7 後有新增 setBackIndicatorImage && setBackIndicatorTransitionMaskImage

[[UINavigationBar appearance] setBackIndicatorImage:[UIImage imageNamed:@"ico_back"];
[[UINavigationBar appearance] setBackIndicatorTransitionMaskImage:[UIImage imageNamed:@"ico_back"]];

更慘...

除了整張圖反白外，後面還帶了一串文字標題，用空字串，解決文字的問題。

UIBarButtonItem *barBtnItem = [[UIBarButtonItem alloc] initWithTitle:@""
                        style:UIBarButtonItemStyleBordered
                        target:self
                        action:@selector(navigationBackItemDidClicked:)];
self.navigationItem.backBarButtonItem = barBtnItem;

反白可以用 imageWithRenderingMode:UIImageRenderingModeAlwaysOriginal 解決。

加上UIEdgeInsetsMake解決位置偏移的問題，

完整 code 如下：

NSString *buf = @"Back";
if ([UINavigationBar instancesRespondToSelector:@selector(setBackIndicatorImage:)]) {
    UIImage *image = [[UIImage imageNamed:@"ico_back"] imageWithAlignmentRectInsets:UIEdgeInsetsMake(8, 0, 8, 0)];
    [[UINavigationBar appearance] setBackIndicatorImage:[image imageWithRenderingMode:UIImageRenderingModeAlwaysOriginal]];
    [[UINavigationBar appearance] setBackIndicatorTransitionMaskImage:image];
    buf = @"";
}
UIBarButtonItem *barBtnItem = [[UIBarButtonItem alloc] initWithTitle:buf
                         style:UIBarButtonItemStyleBordered
                         target:self
                         action:@selector(navigationBackItemDidClicked:)];
self.navigationItem.backBarButtonItem = barBtnItem;