UITabBar和UITabBarItem,iPhone 5和iPhone 6的特定图片@ 2x

Question

我正在开发一个新的应用程序,我正面临一些问题来定制UITabBar,并使用@ 2x图像在iPhone 5和6中使其工作(设计)很棒.

在AppDelegate.m中,在didFinishLaunchingWithOptions方法中,我为后台选择了图像,选择了项目:

//TABBAR
UITabBarController *tabBarController = (UITabBarController *)self.window.rootViewController;
UITabBar *tabBar = tabBarController.tabBar;
UITabBarItem *tabBarItem1 = [tabBar.items objectAtIndex:0];
UITabBarItem *tabBarItem2 = [tabBar.items objectAtIndex:1];
UITabBarItem *tabBarItem3 = [tabBar.items objectAtIndex:2];
UITabBarItem *tabBarItem4 = [tabBar.items objectAtIndex:3];
UITabBarItem *tabBarItem5 = [tabBar.items objectAtIndex:4];

[[UITabBar appearance] setBackgroundImage:[UIImage imageNamed:@"tab_bg"]];
[[UITabBar appearance] setSelectionIndicatorImage:[UIImage imageNamed:@"icone_home_selecionado"]];
[[UITabBar appearance] setShadowImage:[[UIImage alloc] init]];

然后,在相同的方法中,对于每个项目,我设置图像和插图:

tabBarItem1.title = nil;
tabBarItem1.imageInsets = UIEdgeInsetsMake(6, 0, -6, 0);
[tabBarItem1 setImage:[[UIImage imageNamed:@"icone_home_teste"] imageWithRenderingMode:UIImageRenderingModeAlwaysOriginal]];

tabBarItem2.title = nil;
tabBarItem2.imageInsets = UIEdgeInsetsMake(6, 0, -6, 0);
[tabBarItem2 setImage:[[UIImage imageNamed:@"icone_home_teste"] imageWithRenderingMode:UIImageRenderingModeAlwaysOriginal]];

tabBarItem3.title = nil;
tabBarItem3.imageInsets = UIEdgeInsetsMake(6, 0, -6, 0);
[tabBarItem3 setImage:[[UIImage imageNamed:@"icone_home_teste"] imageWithRenderingMode:UIImageRenderingModeAlwaysOriginal]];

tabBarItem4.title = nil;
tabBarItem4.imageInsets = UIEdgeInsetsMake(6, 0, -6, 0);
[tabBarItem4 setImage:[[UIImage imageNamed:@"icone_home_teste"] imageWithRenderingMode:UIImageRenderingModeAlwaysOriginal]];

tabBarItem5.title = nil;
tabBarItem5.imageInsets = UIEdgeInsetsMake(6, 0, -6, 0);
[tabBarItem5 setImage:[[UIImage imageNamed:@"icone_home_teste"] imageWithRenderingMode:UIImageRenderingModeAlwaysOriginal]];

我的问题是iPhone 5和6宽度使用相同的@ 2x图像,因为iPhone 5有640px(320pts)而iPhone 6有750px(375pts),所以我决定创建名为"icone_home_selecionado@2x.png"的selectedIndicatorImage宽度大小= 150px

因为我有5个UITabBarItem,所以750/5 = 150px(每个项目)

图片icone_home_selecionado@2x.png(150px x 96px):

在你可以看到的iPhone 6上运行它真的很棒:

但是当在iPhone 5上进行测试时,当选择项目时,UITabBarItem区域会扩展为相同的150px(与图像宽度相同),而不是缩小到128px(假设这个大小适合iPhone 5)可以看到:

(例如,注意从第一个项目到第二个项目的宽度差异,但它发生在所有它们上面,似乎所选图像覆盖了UITabBarItem)

我的@ 2x图像有150px,但由于我应该为iPhone 5和6使用@ 2x图像,我如何处理这种情况以适应UITabBarItem中的图像？它似乎只有当我有一个图像150px(6)和另一个图像128px(5)时才能工作

有没有使用相同的@ 2x图像的解决方案,或者我需要编码来识别该屏幕尺寸,然后选择哪个图像？

Answer 1

同样的问题：

UITabBar.appearance().backgroundImage =  UIImage(named: "bg_bottom_menu")

由于该图像适用于 4 英寸显示屏，因此在 iPhone 6 中无法正常显示。

我正在使用以下代码来修复它：

if Utilities.isIphone5() {
    UITabBar.appearance().backgroundImage =  UIImage(named: "bg_bottom_menu_4_inches")
} else {
    UITabBar.appearance().backgroundImage =  UIImage(named: "bg_bottom_menu")
}

在实用程序中：

class func isIphone5() -> Bool {
    return isIphone() && UIScreen.mainScreen().bounds.size.height == 568.0
}

编辑：

前面的代码有效，但最好的解决方案是以下代码。

进入 Images.xcssets -> 您的图像 -> 属性检查器 -> 在设备部分下选择特定于设备 -> 选择 Retina 4 英寸并拖放 4 英寸图像。