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

【问题标题】：iPad toolbar icons: bar button images not centered?iPad工具栏图标：栏按钮图像未居中？
【发布时间】：2011-04-20 02:28:58
【问题描述】：

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

左侧的“聊天气泡”图标来自著名的Glyphish icon set。请注意它如何具有正确的垂直定位（在中间），但比用于 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];

如何获得具有正确着色/透明度（因此我不必手动执行）以及正确垂直定位的UIBarButtonItem 按钮？

其中一个是我的代码中的错误还是 Apple 的错误？或两者？或者两者都不是（即“按设计”）？

编辑：对答案的回应

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

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

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

你有消息来源吗？（尤其是 Apple 链接？）从未听说过。

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

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

最好的工具栏是 25x25 并且 50x50@2x。有时你可能需要去低至 23。

这是苹果官方的东西吗？也许来自HIG？能否提供出处？

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

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

【问题讨论】：

标签： image ipad button ios toolbar

【解决方案1】：

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

只需像中间一样创建它并设置如下：

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

稍后我将尝试仔细研究这个具体案例。我不确定它为什么会这样做。

==编辑==

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

【讨论】：

【解决方案2】：

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

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

【讨论】：

【解决方案3】：

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

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

【讨论】：