将自定义 BarButtonItem 添加到顶部导航栏

Posted 2023-03-22

【中文标题】将自定义 BarButtonItem 添加到顶部导航栏

【英文标题】：adding custom BarButtonItem to top navigation bar

【发布时间】：2012-06-28 15:18:06

【问题描述】：

使用故事板中的界面构建器，我在导航工具栏的左上角放置了一个栏按钮项，用于切换表格视图单元格的编辑视图。我目前有类似“编辑单元格”的文本

我的问题是，如何更改它以使用图像？我为编辑单元格状态和编辑单元格关闭状态创建了自己的自定义图像，但是当我在界面构建器中指定图像时，图像在条形按钮项中被拉伸。我是否需要通过代码以编程方式制作此条形按钮项以使其使用图像的框架？如何指定状态？

我觉得应该有一种方法可以在界面构建器中执行此操作，但我尝试以编程方式执行此操作：

UIImage *image = [UIImage imageNamed:@"edit-off.png"];
UIButton *showEditButton = [UIButton buttonWithType:UIButtonTypeCustom];
showEditButton.bounds = CGRectMake( 0, 0, image.size.width, image.size.height );
[showEditButton setImage:image forState:UIControlStateNormal];
UIBarButtonItem *showEditButtonItem = [[UIBarButtonItem alloc] initWithCustomView:showEditButton];

现在如何将 showEditButtonItem 添加到导航栏的左上角？

实际图片：

【问题讨论】：

你有截图吗？当我在 IB 中设置图像时，它不会拉伸它

查看编辑。它真的是我希望能够编辑的排序，所以我在那里有排序图标。请注意它在 IB 中被拉伸。图片是不是太大了？

嗯，看起来它只是被压扁了，而不是被拉伸了。尝试调整图标纹理的大小以匹配条形按钮项的预期。您可以在 ios here

中找到各种图标的所有尺寸

太棒了！，工作。现在是状态，如何在点击时换出图像？我有另一个状态的图像打开和关闭

【参考方案1】：

iOS 中的图标应具有一定的大小。您可以在iOS Human Interface Guidelines 中找到您想要的各种图标的所有尺寸。

至于为不同的状态设置不同的图标，我相信你需要在代码中做到这一点。

要为UIBarButtonItem 设置图像，您只需设置image 属性：

editButton.image = editActiveImage;

或

editButton.image = editInactiveImage;

【参考方案2】：

以编程方式添加按钮是这样的：

UIBarButtonItem *editButton = [[UIBarButtonItem alloc] initWithImage:[UIImage imageNamed:@"kyyL4.png"] style:UIBarButtonItemStylePlain target:self action:@selector(editObject:)];
self.navigationItem.rightBarButtonItem = editButton;

将此代码放入 ViewController.m 文件的 -viewDidLoad: 方法中。

（不幸的是图像也会以这种方式拉伸。）