iPad 工具栏图标：栏按钮图像未居中？

Question

看一下我正在开发的 iPad 应用程序的以下屏幕截图片段：

“聊天气泡”左侧的图标来自著名的Glyphish 图标集。请注意它如何具有正确的垂直定位（在中间），但比 InfoDark 按钮使用的灰度暗得多。制作该图标的代码如下：

UIImage* image = [UIImage imageNamed:@"02-chat.png"];
CGRect frame = CGRectMake(0, 0, image.size.width, image.size.height);
UIButton* button = [[UIButton alloc] initWithFrame:frame];
[button setBackgroundImage:image forState:UIControlStateNormal];
[button addTarget:nil action:NULL forControlEvents:UIControlEventTouchUpInside];
[button setShowsTouchWhenHighlighted:YES];
UIBarButtonItem* chatBarButtonItem = [[UIBarButtonItem alloc] initWithCustomView:button];

中间的“聊天气泡”图标是使用相同的图像，使用不同的代码创建的。请注意它如何具有正确的着色/透明度，但垂直定位不正确（太高）。：

UIImage* image = [UIImage imageNamed:@"02-chat.png"];
UIBarButtonItem* chatBarButtonItem = [[UIBarButtonItem alloc] initWithImage:image style:UIBarButtonItemStylePlain target:nil action:NULL];

How do I get a UIBarButtonItem 按钮，它具有正确的着色/透明度（所以我不必手动进行），以及正确的垂直定位？

其中之一是我的代码中的错误还是苹果代码中的错误？或者两者都有？或者两者都不是（即它是“设计的”）？

编辑：对答案的回复

看起来第一个版本是 使用图像作为掩模，而不是 作为常规图像。

看起来是这样，但事实并非如此。如果我用朋友用 Photoshop 手工打亮的图像替换该图像，并使用 UIButton，则定位和着色都是正确的。我只是想摆脱那个手动步骤。

请记住，将 UIResponder 对象（例如 UIButton）内 UIBarButtonItem 给出了不可预知的 结果，我发现最好 避免它。

你有消息来源吗？ （特别是苹果链接？）从来没有听说过。

将图像重新设计为您自己的。 这是最好也是唯一的方法 确保适当的尺寸、梯度和 所有工具栏图标的位置。

我不一定不同意。然而，这是我想消除的手动步骤。应该可以获得我想要的行为而不需要编辑。 （特别是因为我使用现有框架获得了所需行为的两半。只是不是同时）

工具栏的最佳尺寸是 25x25， 50x50@2x。有时你可能需要去 低至 23。

这是苹果官方的东西吗？也许来自 HIG？你能提供一个来源吗？

您可以尝试将 imageInsets 设置为 它把它推下来。

这也是一个不必要的手动过程。最糟糕的是，这需要对每个图像进行手动调整，如果图像发生任何变化，则必须进行双重检查。工作量太大了。我只想将其设置为图像，然后让底层框架确定如何使图像居中。

Answer 1

看起来第一个版本使用图像作为蒙版，而不是作为常规图像。请记住，将 UIResponder 对象（例如 UIButton）放入 UIBarButtonItem 中会产生不可预测的结果，我发现最好避免它。

第二个版本的填充看起来只是一个填充问题。因此，您可以更改图像的大小以包含额外的内容，使 UIImage 对象与其他按钮的大小相同（我认为是 24x24px？），或者您可以使用 UIBarItem 的 imageInsets 属性。

Answer 2

重新设计图像以使其成为您自己的图像。这是确保所有工具栏图标的大小、渐变和位置正确的最佳且唯一的方法。工具栏的最佳尺寸是 25x25 和 50x50@2x。有时您可能需要低至 23。

您可以做的另一件事是将顶部和底部图像插图更改 2 个像素，以获得您想要的结果。如果您只更改 1 个插图，则会挤压图像。

Answer 3

您可以尝试在其上设置 imageInsets 将其下推。

只需像中间的那样创建它并像这样设置：

chatBarButtonItem.imageInsets = UIEdgeInsetsMake(2.0f, 0.0f, -2.0f, 0.0f);

稍后我将尝试仔细查看这个特定案例。我不知道为什么它会这样做。

==编辑==

看起来迈克尔可能对这种行为有答案。