设置UIBarButtonItem的图像 - 图像拉伸

Question

当我尝试使用UIBarButtonItem的"initWithImage"来初始化导航栏自定义图像时,它会被冲洗并在黑色导航栏上拉伸.这是我创建它的方式:

UIBarButtonItem *button = [[UIBarButtonItem alloc] initWithImage:[UIImage imageNamed:@"gear.png"] style:UIBarButtonItemStyleBordered target:self action:@selector(showSetting:)];

这是它的样子:

不知道图像是否有问题？我是从我买的一套图标中得到的.

Answer 1

最好的方法是创建一个按钮,设置其背景图像,并设置其动作.然后可以使用此按钮作为自定义视图创建UIBarButtonItem.这是我的示例代码:

 UIButton *settingsView = [[UIButton alloc] initWithFrame:CGRectMake(0, 0, 61, 30)];
[settingsView addTarget:self action:@selector(SettingsClicked) forControlEvents:UIControlEventTouchUpInside];
[settingsView setBackgroundImage:[UIImage imageNamed:@"settings"] forState:UIControlStateNormal];
UIBarButtonItem *settingsButton = [[UIBarButtonItem alloc] initWithCustomView:settingsView];
[self.navigationItem setRightBarButtonItem:settingsButton];

Answer 2

条形图按钮项目上显示的图像是从源图像"派生"的(它在渲染时仅使用Alpha通道值,但在图像中看起来都很正常).它可能只是尺寸不合适 - 您可能需要打开图像文件并将其裁剪为正确的尺寸.

您还可以尝试查看是否可以使用设置imageInsets属性(由UIBarItem从UIBarButtonItem继承)来调整大小,以阻止它被拉伸.

酒吧项目图片上的Doco说明如下:

条形图上显示的图像来自此图像.如果此图像太大而无法放在条形图上,则会缩放以适合该图像.通常,工具栏和导航栏图像的大小为20 x 20磅.

Answer 3

我知道这个问题已经有一个勾选标记的anser.但是今天我参加了这个活动并认为无论如何我会提供我的答案.上面标记为上面的答案对我有帮助,但它还需要进行一些额外的实验来弄清楚究竟发生了什么.

按钮图像仅在x轴而不是y中收缩.这是因为按钮太高了,它缩小了以适应.但它并没有按比例缩小.只在纵向上.所以看起来很紧张.它实际上并没有拉伸 - 这意味着它的扩大.相反,高度缩小了.知道差异,我认为了解它为什么会发生以及如何解决它是很重要的.

OP做了同样的事情.想到我支持视网膜,我制作了40x40的图标.我是带有alpha通道的绿色复选标记.填充空白像素为40x40.应用程序将其调整大小以适应按钮的可用高度.但宽度保持不变.所以它变成了40x30或40x20的范围.我认为按钮可以处理高30的图标,但是对于盒子恕我直言,它有点太大了.

OP将按钮缩小到30x30,这使得它不会再挤压了.但那不是最好的解决方案.因为当你这样做时它实际上不是视网膜按钮.它缩小了,然后在视网膜上炸回来.

正确的答案是用@ 2x命名你的40像素高版本,然后制作一个半尺寸(20像素高)版本,并保存它没有@ 2x.宽度可以是任何.然后使用imageNamed加载:而不指定@ 2x.它将使用适当的png用于视网膜或非视网膜设备.

接下来发生在我身上的事情是按钮框架太小了.所以我在psd中增加了我的画布尺寸,将png填充到80宽,使按钮稍微宽一点,更加可点击.

Answer 4

当我为leftBarButtonItem设置背景图像时，我的 40x40 图像遇到了同样的拉伸问题

UIBarButtonItem *backButton = [UIBarButtonItem new];
[backButton setBackButtonBackgroundImage:[UIImage imageNamed:@"back_icon"] forState:UIControlStateNormal barMetrics:UIBarMetricsDefault];

self.navigationItem.leftBarButtonItem = backButton;

但是我的问题通过以下代码解决了

UIBarButtonItem *backButton = [[UIBarButtonItem alloc] initWithImage:[UIImage imageNamed:@"back_icon"] style:UIBarButtonItemStylePlain target:self action:@selector(handleBack:)];

self.navigationItem.leftBarButtonItem = backButton;

如果使用UIBarButtonItemStyleBordered，则结果相同。