外观怪异的 setBackButtonBackgroundImage答案

【问题标题】：setBackButtonBackgroundImage with weird appearance外观怪异的 setBackButtonBackgroundImage
【发布时间】：2013-04-20 11:45:58
【问题描述】：

在 AppDelegate.m 中为我的自定义 NavBar 使用它：

UIImage *NavigationPortraitBackground = [[UIImage imageNamed:@"gradient_main"] resizableImageWithCapInsets:UIEdgeInsetsMake(0, 0, 0, 0)];
[[UINavigationBar appearance] setBackgroundImage:NavigationPortraitBackground forBarMetrics:UIBarMetricsDefault];
UIImage *barBackBtnImg = [[UIImage imageNamed:@"btn_nav_default.png"] resizableImageWithCapInsets:UIEdgeInsetsMake(0, 0, 0, 0)];
[[UIBarButtonItem appearance] setBackButtonBackgroundImage:barBackBtnImg forState:UIControlStateNormal barMetrics:UIBarMetricsDefault];

结果：

如您所见，按钮似乎重复了。按钮尺寸为 61x30。并且文本没有居中。如果文本较短（例如菜单），则按钮图像被截断，如果文本较长，则按钮重复。具有较小图标 (30x30) 的按钮也存在类似问题。该按钮显示正常，但我可以单击图像外部的按钮:(

【问题讨论】：

标签： ios objective-c xcode uinavigationcontroller uibarbuttonitem

【解决方案1】：

您的问题的根源是您提供了一个没有 UIEdgeInsets 并且没有指定调整大小样式的可调整大小的图像。 UIBarButtonItem 上的文本实际上是居中的！如果你测量文本两边的距离，你会发现它是一样的。

如果您查看为 UIBarButtonItem 提供的图像：

[[UIImage imageNamed:@"btn_nav_default.png"] resizableImageWithCapInsets:UIEdgeInsetsMake(0, 0, 0, 0)];

你告诉 iOS @"btn_nav_default.png" 是一个可调整大小的图像，它应该平铺。它基本上是复制您的图像并将它们并排放置，直到覆盖整个宽度。如果您查看UIImage's Documentation，您会发现 resizableImageWithCapInsets 的默认行为是平铺。您需要调用 resizableImageWithCapInsets:resizingMode: 并传入 UIImageResizingModeStretch 以调整大小。

话虽如此，但这还不够。之后你会看到整个图像被拉伸，完全破坏了你漂亮的圆角。你需要提供 UIEdgeInsets 来告诉 UIImage “你不能拉伸这个部分”。在这种情况下，提供UIEdgeInsets 或UIEdgeInsetsMake(0.0f, 10.0f, 0.0f, 10.0f)（或类似的东西）将起作用。

如果您对冗长的解释不感兴趣，请复制粘贴此代码（但不保证会编译...）：

[[UIImage imageNamed:@"btn_nav_default.png"] resizableImageWithCapInsets:UIEdgeInsetsMake(0.0f, 10.0f, 0.0f, 10.0f) resizingMode:UIImageResizingModeStretch];

【讨论】：

太棒了 :) 现在我只需要在 iOS5 中替换 resizableImageWithCapInsets:resizingMode: :(

【解决方案2】：

你可以试试玩

[[UIBarButtonItem appearance] setBackButtonBackgroundVerticalPositionAdjustment:5 forBarMetrics:UIBarMetricsDefault];

在 ios 5 中放置插图后

【讨论】：