iOS 5自定義標簽欄圖像垂直對齊

Question

我的自定義標簽欄出現一些奇怪的行為。 圖像似乎未正確對齊。 這是屏幕截圖（我已經刪除了自己的標簽欄背景以突出顯示我的問題）：

這是我用來設置每種狀態的圖像的代碼：

self.tabBarController = [[[UITabBarController alloc] init] autorelease];
self.tabBarController.viewControllers = [NSArray arrayWithObjects:homeNavController, whatsOnNavController, mapNavController, infoNavController, nil];
self.tabBarController.delegate = self;

// For iOS 5 only - custom tabs
if ([self.tabBarController.tabBar respondsToSelector:@selector(selectedImageTintColor)]) 
{

    // Set the background images
    //[[UITabBar appearance] setBackgroundImage: [UIImage imageNamed:@"nav_bg.png"]];
    [[UITabBar appearance] setSelectionIndicatorImage:[UIImage imageNamed:@"nav_over.png"]];

    [homeNavController.tabBarItem setFinishedSelectedImage:[UIImage imageNamed:@"nav_home_over"] withFinishedUnselectedImage:[UIImage imageNamed:@"nav_home"]];
    [whatsOnNavController.tabBarItem setFinishedSelectedImage:[UIImage imageNamed:@"nav_whats_on_over"] withFinishedUnselectedImage:[UIImage imageNamed:@"nav_whats_on"]];
    [mapNavController.tabBarItem setFinishedSelectedImage:[UIImage imageNamed:@"nav_map_over"] withFinishedUnselectedImage:[UIImage imageNamed:@"nav_map"]];
    [infoNavController.tabBarItem setFinishedSelectedImage:[UIImage imageNamed:@"nav_info_over"] withFinishedUnselectedImage:[UIImage imageNamed:@"nav_info"]];

}

我所有的替換標簽圖像的尺寸均正確（非視網膜版本的高度為49像素，寬度為80像素）。

是什么導致這種奇怪的行為？

-更新-

這是帶有背景的更新屏幕截圖：

Answer 1

UIBarItem上有一個屬性（UIBarButton項從此類繼承） imageInsets 。

要使用全高的圖像（49px） finishedSelectedImage和finishedUnselectedImage你需要設置這些圖像插圖：

tabBarItem.imageInsets = UIEdgeInsetsMake(6, 0, -6, 0);

Answer 2

您現在可以在情節提要中修復此問題。 故事板大小檢查器圖像插圖調整

選擇要調整的選項卡欄項目，打開“尺寸檢查器”，然后調整“頂部和底部圖像插入”。 您需要將它們調整為相同的數量，否則它們只會擠壓/拉伸圖像（因此，頂部為+5，底部為-5）

Answer 3

這看似有點駭人聽聞，但我相信這是實現您想要的唯一方法：您只需要使用帶有透明11像素“頂部填充”（視網膜為22像素）的標簽欄完成圖像。 然后，您的圖片必須為60px（120px）高。

我的應用程序使用此技術將其發布到App Store，因此您應該放心使用它。

希望能幫助到你！

Answer 4

該API的文檔確實很少。

你finishedSelectedImage應該是一個圖標〜30×30像素。 這只是選項卡的圖標部分。 如果創建的finishedSelectedImage太高，系統將不會將其放置在屏幕底部。

從概念上講，您首先為tabBar使用全寬，49px高的backgroundImage ，添加一個具有單個Tab寬度，高49px的selectionIndicatorImage作為選定標簽的背景圖片，然后為每個標簽的圖標添加兩個版本〜30x30 px， finishedUnselectedImage和finishedSelectedImage 。

Answer 5

事實證明，您應該始終在Tabitem中包含文本。 該空格由空白文本創建。

Answer 6

如果將圖像添加為具有定義框架的子視圖，則可以為您提供幫助。 檢查一下

嘗試使用稍小的圖像，標簽欄將其稍微重新定位