更改UINavigationBar中UIBarButtonItem的宽度

时间:2012-06-11 23:51:14

标签: ios uinavigationbar uibarbuttonitem uinavigationitem

我正在创建一个UIBarButtonItem并将其添加到我的导航栏中,如下所示:

(void)viewDidLoad { 

   ...

   // Add the refresh button to the navigation bar
   UIButton *refreshButton = [UIButton buttonWithType:UIButtonTypeCustom];
   [refreshButton setFrame:CGRectMake(0,0,30,30)];
   [refreshButton setImage:[UIImage imageNamed:@"G_refresh_icon.png"] forState:UIControlStateNormal];
   [refreshButton addTarget:self action:@selector(refreshData) forControlEvents:UIControlEventTouchUpInside];
   UIBarButtonItem *refreshBarButton = [[[UIBarButtonItem alloc] initWithCustomView:refreshButton] autorelease];
   self.navigationItem.leftBarButtonItem = refreshBarButton;
}

我跑步时看起来是正确的,但是我可以通过点击导航栏从x = 0到大约100来选择条形按钮项目。如何调整可选区域的宽度为30像素?

6 个答案:

答案 0 :(得分:15)

从iOS 11开始,仅设置customView而不是UIBarButtonItem的框架将无效(如accepted answer中所述)。似乎将Autolayout添加到UIBarButtonItem会覆盖设置的框架。 This post给了我这个想法:

navigationItem.leftBarButtonItem?.customView = yourCustomButtonView
let desiredWidth = 35.0
let desiredHeight = 35.0

let widthConstraint = NSLayoutConstraint(item: yourCustomButtonView, attribute: .width, relatedBy: .equal, toItem: nil, attribute: .notAnAttribute, multiplier: 1.0, constant: desiredWidth)
let heightConstraint = NSLayoutConstraint(item: yourCustomButtonView, attribute: .height, relatedBy: .equal, toItem: nil, attribute: .notAnAttribute, multiplier: 1.0, constant: desiredHeight)

yourCustomButtonView.addConstraints([widthConstraint, heightConstraint])

另请注意,您最好使用UIButton作为CustomView,因为您必须依赖它来触发操作。

答案 1 :(得分:12)

您可以考虑采用的一种方法是通过调用UIBarButtonItem来创建initWithCustomView:。这并不理想,因为你没有选择"选择"开箱即用的状态你必须用你的按钮图像合成你的边框背景(如果想看的话),但是你可以更直接地为你的工具栏项指定一个框架。如果您使用文字作为标题而非图片,则可能仍需要将背景图片添加为子视图。无论如何,我现在遇到同样的问题,这段代码对我有用:

UIImageView *imageView = [[UIImageView alloc] initWithImage:[UIImage imageNamed:@"button-image.png"]];
imageView.frame = CGRectMake(0, 0, 43, 30);

UIBarButtonItem *barButtonItem = [[UIBarButtonItem alloc] initWithCustomView:imageView];

self.navigationItem.leftBarButtonItem = barButtonItem;

现在,这是我知道限制自UIBarButtonItem添加到UINavigationController navigationItem {{1}}的自动调整大小的唯一方式。

try Maggie's solution, which is more thorough than mine

答案 2 :(得分:6)

您可以通过从接口构建器中将图像拖放到条形按钮项并使用以下代码更改自定义视图的宽度来执行此操作:

CGRect frame = self.navigationItem.leftBarButtonItem.customView.frame;
frame.size.width = 141;
self.navigationItem.leftBarButtonItem.customView.frame = frame;

答案 3 :(得分:5)

关键是要意识到您正在更改自定义视图的宽度,而不是UIBarButton本身。

因此代码是:

CGRect resizedFrame = myBarButtonItem.customView.frame;
resizedFrame.size.width = myNewWidth;
myBarButtonItem.customView.frame = resizedFrame;

您还需要触发布局更改:

[myNavigationBar setNeedsLayout];

所有这一切都不言而喻,布局是通过自动调整大小和帧来完成的。使用自动布局进入导航栏的过程没有成功。请参阅我的问题Auto Layout with UINavigationBar and UIBarButtonItem

很抱歉只是意识到我的代码几乎与@oscartzombie相同。不是故意的!我会留下这个答案,因为我认为值得添加布局和其他要点,除了解释之外没有参考Interface Bulder或图像。

答案 4 :(得分:5)

以下方法有效,请参阅更改按钮宽度和高度的代码以及添加操作项。

UIButton *imageButton = [[UIButton alloc]initWithFrame:CGRectMake(0, 0, 22, 22)];
[imageButton setBackgroundImage:[UIImage imageNamed:@"message_button"] forState:UIControlStateNormal];
[imageButton addTarget:self action:@selector(messageButtonTapped) forControlEvents:UIControlEventAllEvents];
UIBarButtonItem *leftBarButtonItem = [[UIBarButtonItem alloc] initWithCustomView:imageButton];
self.navigationItem.leftBarButtonItem = leftBarButtonItem;

注意:UIBarButtonItem的目标和操作不适用于图像视图

答案 5 :(得分:0)

这些解决方案都不适合我,我发现自动调整大小的内容会覆盖您在代码中编写的尺寸。

通过UIButton创建按钮后,编写以下代码块:

[self.navigationItem.rightBarButtonItem.customView.widthAnchor constraintEqualToConstant:mWidth].active = YES;
[self.navigationItem.rightBarButtonItem.customView.heightAnchor constraintEqualToConstant:mHeight].active = YES;