如何在iOS7中正確定位後退按鈕

Question

我使用此代碼將自定義圖像用作整個應用程序中的後退按鈕。

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

所述的圖像尺寸爲30×30

的代碼添加圖像作爲後退按鈕但位置不正確的，因爲可以在以下圖像中看到：

關於如何正確定位圖像而不修改其尺寸（至少是圖像的視覺部分（圓形+箭頭））的任何想法？

編輯：

我不想使用自定義的返回按鈕，因爲這迫使我禁用iOS7

Answer 1

輕掃/後退手勢請看下面的編輯！

我不久前在iOS7中創建了一個自定義後退按鈕。我的箭頭和單詞背靠它。我認爲帕萬的建議是一個好的開始。要創建自定義映像後退按鈕就可以使用，

UIBarButtonItem *backButton = [[UIBarButtonItem alloc] initWithTitle:@"Back" style:UIBarButtonItemStylePlain target:self action:@selector(backButtonClicked)]; 
[backButton setBackgroundImage:finalImage forState:UIControlStateNormal barMetrics:UIBarMetricsDefault]; 
[backButton setTitlePositionAdjustment:UIOffsetMake(-20, 0) forBarMetrics:UIBarMetricsDefault]; 

self.navigationItem.leftBarButtonItem = backButton; 

我的形象finalImage是兩個不同圖像的合成，但是你可以用你的「回」的形象。但我認爲這是問題所在。我的圖像是一個複合圖像，您可能也想製作複合圖像，但在背部圖標上方放置一個清晰的空間。我在我的圖標右側放置了一個清晰的空間來調整它的間距。下面是代碼，

UIImage *arrow = [UIImage imageNamed:@"back.png"]; 
UIImage *wordSpace = [UIImage imageNamed:@"whiteSpace.png"]; 
CGSize size = CGSizeMake(arrow.size.width + wordSpace.size.width, arrow.size.height); 
UIGraphicsBeginImageContext(size); 
[arrow drawInRect:CGRectMake(0, 0, arrow.size.width, size.height)]; 
[wordSpace drawInRect:CGRectMake(arrow.size.width, 0, wordSpace.size.width, wordSpace.size.height)]; 
UIImage *finalImage = UIGraphicsGetImageFromCurrentImageContext(); 
UIGraphicsEndImageContext(); 

的圖像wordSpace是一個明確的PNG，我在Photoshop做，所以我的新的後退按鈕圖像不拉伸。您可能想要在頂部放置一個清晰的png，將圖標向下推一點。使用photoshop中的大小，高度爲你認爲的調整應該是什麼。你可能需要付出一點努力。並確保更改CGSize，使其適合您的圖標和清晰的空間。

我的背單詞是有點過了，所以我看着

[backButton setTitlePositionAdjustment:UIOffsetMake(-20, 0) forBarMetrics:UIBarMetricsDefault]; 

我不得不玩的是線位，使它看起來儘可能好，但它終於給了我什麼，我想與-20。我甚至調整了我的第二個變量0，這實際上移動了圖標。 -5將圖標向下放到遠處，但是它從清晰的PNG中選擇另一個選項。

現在要處理的事實，你希望它是一個實際的後退按鈕。看看我發佈的第一行代碼。按鈕上的動作是@selector（backButtonClicked）。所以你所要做的就是制定這個方法，你應該很好去！

- (void)backButtonClicked 
{ 
    NSLog(@"going back"); 
    [self.navigationController popViewControllerAnimated:YES]; 
} 

希望這會有所幫助。

編輯*****

我玩弄我的代碼一點點，找到了一個更好的辦法來移動回圖標。我只是用了一個輪子，因爲我沒有和你一樣的輪子，但它的工作原理是一樣的。

既然你真的不希望你可以用這個代碼創建按鈕標題，

UIImage *image = [UIImage imageNamed:@"781-ships-wheel.png"]; 

UIBarButtonItem *backButton = [[UIBarButtonItem alloc] initWithImage:image style:UIBarButtonItemStylePlain target:self action:@selector(backButtonClicked)]; 

只要改變781東西你圖標的名稱。然後你可以用下面的方式移動它，

[backButton setImageInsets:UIEdgeInsetsMake(20, 0, -20, 0)]; 

看看這張圖片。

這顯示圖標下來很大，但是我想告訴你的想法。邊緣插圖的編號是「頂」，「左」，「底」和「右」。如果您不需要這樣移動它，請勿觸摸左側和右側，更改頂部和底部。不過要注意的是，如果你需要像我一樣將它向下移動20點，（太多），你需要抵消底部的負值，否則圖標會被壓縮。這就是所有零的情況。

所以你幾乎可以將它無論你想去的地方，但你仍然要建立@selector（backButtonClicked），使它象真正的後退按鈕的工作。

Answer 2

你可以試試這個

self.navigationItem.leftBarButtonItem.imageInsets = UIEdgeInsetsMake(0, 0, 10, 0); 

Answer 3

編輯
我想我可能已經找到了竅門（iOS中7的設計資源 - UIKit的用戶界面目錄）
在欄按鈕項目

請注意，條形圖按鈕圖像將自動呈現爲導航欄中的模板圖像，unl您可以明確地將其渲染模式設置爲UIImageRenderingModeAlwaysOriginal。有關更多信息，請參閱模板圖像。

在模板圖像他們有一些代碼來指定UIImageRenderingMode。

UIImage *myImage = [UIImage imageNamed:@"back"]; 
UIImage *backButtonImage = [myImage imageWithRenderingMode:UIImageRenderingModeAlwaysOriginal]; 
// now use the new backButtomImage 
[[UINavigationBar appearance] setBackIndicatorImage:backButtonImage]; 
[[UINavigationBar appearance] setBackIndicatorTransitionMaskImage:backButtonImage]; 

嘗試建立與排列插圖的UIImage的，然後設置回指示符圖像。

UIEdgeInsets insets = UIEdgeInsetsMake(10, 0, 0, 0); // or (0, 0, -10.0, 0) 
UIImage *alignedImage = [[UIImage imageNamed:@"back"] imageWithAlignmentRectInsets:insets]; 
[[UINavigationBar appearance] setBackIndicatorImage:alignedImage]; 
[[UINavigationBar appearance] setBackIndicatorTransitionMaskImage:alignedImage]; 

您也可以嘗試調整UINavigationBar的標題文字

[[UINavigationBar appearance] setTitleVerticalPositionAdjustment:(CGFloat)adjustment forBarMetrics:(UIBarMetrics)barMetrics]; 

Answer 4

也只是遵循的建議，以修復佈局，失去了iOS 7一個「回退姿勢的位置「，然後用UIScreenEdgePanGestureRecognizer修復它！

UIScreenEdgePanGestureRecognizer尋找在屏幕邊緣附近開始的平移（拖動）手勢。系統在某些情況下使用屏幕邊緣手勢來啓動視圖控制器轉換。您可以使用此類爲您自己的操作複製相同的手勢行爲。

Answer 5

問題是您的圖片太高。爲了證明這一點，首先嚐試下面的代碼：

UIGraphicsBeginImageContextWithOptions(CGSizeMake(10,20), NO, 0); 
CGContextFillRect(UIGraphicsGetCurrentContext(), CGRectMake(6,0,4,20)); 
UIImage* im = UIGraphicsGetImageFromCurrentImageContext(); 
UIGraphicsEndImageContext(); 
self.navbar.backIndicatorImage = im; 
UIGraphicsBeginImageContextWithOptions(CGSizeMake(10,20), NO, 0); 
UIImage* im2 = UIGraphicsGetImageFromCurrentImageContext(); 
UIGraphicsEndImageContext(); 
self.navbar.backIndicatorTransitionMaskImage = im2; 

看起來不錯。現在改變20到30兩個CGSizeMake電話：

UIGraphicsBeginImageContextWithOptions(CGSizeMake(10,30), NO, 0); 
CGContextFillRect(UIGraphicsGetCurrentContext(), CGRectMake(6,0,4,20)); 
UIImage* im = UIGraphicsGetImageFromCurrentImageContext(); 
UIGraphicsEndImageContext(); 
self.navbar.backIndicatorImage = im; 
UIGraphicsBeginImageContextWithOptions(CGSizeMake(10,30), NO, 0); 
UIImage* im2 = UIGraphicsGetImageFromCurrentImageContext(); 
UIGraphicsEndImageContext(); 
self.navbar.backIndicatorTransitionMaskImage = im2; 

圖標現在是太高。

所以，只要讓你的圖像高20像素，一切都會好起來的。

Answer 6

UIEdgeInsets insets = UIEdgeInsetsMake(0, 0, -2, 0); // or (2,0,0,0) 
UIImage *backArrowImage = [[UIImage imageNamed:@"back"] imageWithAlignmentRectInsets:insets]; 

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

Answer 7

這是斯威夫特2版本。 最簡單的方法就是這樣。把這段代碼放在AppDelegate。'

func application(application: UIApplication, didFinishLaunchingWithOptions launchOptions: [NSObject: AnyObject]?) -> Bool { 
     let navigationBarAppearace = UINavigationBar.appearance() 
     let image = UIImage(named: "back-btn") 
     navigationBarAppearace.backIndicatorImage = image 
     navigationBarAppearace.backIndicatorTransitionMaskImage = image 

     return true 
    } 

如果你的背部按鈕有背景顏色，它可能將無法正常工作。

添加您的圖標asset folder每個分辨率是這樣的：