iOS7过多的导航栏按钮间距问题

Question

我在使用LeftBarItems和RightBarItems时遇到了过多的UIBarButtonItem填充/间距（请参见下面的图像）。 UIBarButtonItems上使用的图标不包含额外的填充。所以我想知道是什么导致了这种情况？

- Oliver Weichhold

---

我也看到了。对解决方案很感兴趣。 - Léo Natan

Answer 1

我使用它来删除第一个项目之前的空格。

然而，它在系统项（例如 UIBarButtonSystemItemAdd）之间不起作用，仅适用于具有图像的UIBarButtonItem。

@interface UIBarButtonItem (NegativeSpacer)
+(UIBarButtonItem*)negativeSpacerWithWidth:(NSInteger)width;
@end
@implementation UIBarButtonItem (NegativeSpacer)
+(UIBarButtonItem*)negativeSpacerWithWidth:(NSInteger)width {
    UIBarButtonItem *item = [[UIBarButtonItem alloc]
                             initWithBarButtonSystemItem:UIBarButtonSystemItemFixedSpace
                             target:nil
                             action:nil];
    item.width = (width >= 0 ? -width : width);
    return item;
}
@end

使用方法如下：

---

UIBarButtonItem *item0 = [UIBarButtonItem negativeSpacerWithWidth:13];
UIBarButtonItem *item1 = [[UIBarButtonItem alloc] initWithImage:[UIImage imageNamed:@"sidebar.png"]
                                                          style:UIBarButtonItemStylePlain
                                                         target:vc
                                                         action:@selector(sideMenuAction:)];
NSArray* items = @[item0, item1];
[vc.navigationItem setLeftBarButtonItems:items animated:NO];
[vc.navigationItem setLeftItemsSupplementBackButton:YES];

- neoneye

---

更改名称为-negativeSpacerWithWidth：并使其正确处理负值。 - Quinn Taylor

这对我不起作用... 最近有更改吗（例如iOS 7）？ - Stian Høiland

在 iOS 7 上的 UIToolbar 中对我有效。 - Danyal Aytekin

在iOS7的UINavigationBar上对我有效。[vc.navigationItem setLeftItemsSupplementBackButton:YES];是不必要的。 - jAckOdE

但是似乎不适用于正确的项目，这是我如何使用正确的项目：UIBarButtonItem *rightSpacer = [UIBarButtonItem negativeSpacerWithWidth:13];[self.navigationItem setRightBarButtonItems:[NSArray arrayWithObjects:rightItem,rightSpacer, nil]]; - jAckOdE

Answer 2

你可以移动这张图片

self.myBarButtonItem.imageInsets = UIEdgeInsetsMake(0, 25, 0, -25);

- Luda

---

不幸的是，这并没有移动按钮的点击区域，只有它的图像。但如果你只需要稍微移动一下按钮，这是一个不错的解决方案！ - andrrs

Answer 3

苹果公司默默地增加了UIBarButtonItems的水平间距限制，可悲的是，他们仍然没有添加任何UIAppearance方法来调整UIBarButtonItems的水平位置。

最好的解决方案（对我有效）是使用initWithCustomView:在UIView中包装您的UIBarButtonItems，并调整该自定义视图的边界以获得所需的定位。 这里有一个关于如何做到这一点的好答案。

如果您想更进一步，可以在UIBarButtonItem上创建一个类别，其中包含返回您在整个应用程序中使用的工具栏按钮的类方法。这样，当您需要工具栏按钮时，可以调用类似以下内容的东西：

self.navigationItem.leftBarButtonItem = [UIBarButtonItem mySearchBarButtonItemWithTarget:self selector:@selector(search)];

- Wes Dearborn

Answer 4

iOS 7导航栏中有两种按钮：带图像的按钮和带文本的按钮。我编写了一个类来实现这个功能。以下是具体步骤：

GlobalUICommon.h：

@interface UIBarButtonItem(CustomUIOfONE)

+ (UIBarButtonItem*)barItemWithImage:(UIImage*)image highlightedImage:(UIImage*)highlightedImage xOffset:(NSInteger)xOffset target:(id)target action:(SEL)action;

+ (UIBarButtonItem*)barItemWithTitle:(NSString*)title xOffset:(NSInteger)xOffset target:(id)target action:(SEL)action;

@end

GlobalUICommon.m:

@implementation UIBarButtonItem(CustomUIOfONE)

+ (UIBarButtonItem*)barItemWithImage:(UIImage*)image highlightedImage:(UIImage*)highlightedImage xOffset:(NSInteger)xOffset target:(id)target action:(SEL)action
{
    UIButton *button = [UIButton buttonWithType:UIButtonTypeCustom];
    [button setFrame:CGRectMake(0, 0, image.size.width, image.size.height)];
    [button addTarget:target action:action forControlEvents:UIControlEventTouchUpInside];
    [button setImage:image forState:UIControlStateNormal];
    [button setImage:highlightedImage forState:UIControlStateHighlighted];
    if ([[[UIDevice currentDevice] systemVersion] floatValue] >= 7) {
        [button setImageEdgeInsets:UIEdgeInsetsMake(0, xOffset, 0, -xOffset)];
    }

    UIBarButtonItem *customUIBarButtonItem = [[UIBarButtonItem alloc] initWithCustomView:button];
    return customUIBarButtonItem;
}

+ (UIBarButtonItem*)barItemWithTitle:(NSString*)title xOffset:(NSInteger)xOffset target:(id)target action:(SEL)action
{
    UIButton *button = [UIButton buttonWithType:UIButtonTypeCustom];
    [button setTitle:title forState:UIControlStateNormal];
    [button setTitleColor:[UIColor whiteColor] forState:UIControlStateNormal];
    [button setTitleColor:[UIColor redColor] forState:UIControlStateHighlighted];
    [button.titleLabel setFont:[UIFont systemFontOfSize:15]];
    [button setFrame:CGRectMake(0, 0, [button.titleLabel.text sizeWithFont:button.titleLabel.font].width + 3, 24)];
    [button addTarget:target action:action forControlEvents:UIControlEventTouchUpInside];
    if ([[[UIDevice currentDevice] systemVersion] floatValue] >= 7) {
        [button setContentEdgeInsets:UIEdgeInsetsMake(0, xOffset, 0, -xOffset)];
    }

    UIBarButtonItem *customUIBarButtonItem = [[UIBarButtonItem alloc] initWithCustomView:button];
    return customUIBarButtonItem;
}

@end

YourViewController.m：

带图片的按钮示例：

UIBarButtonItem* leftButtomItem = [UIBarButtonItem barItemWithImage:[UIImage imageNamed:@"yourImage"]
                                                   highlightedImage:[UIImage imageNamed:@"yourImage"]
                                                            xOffset:-11
                                                             target:self
                                                             action:@selector(yourHandler)];
self.navigationItem.leftBarButtonItem = leftButtomItem;
UIBarButtonItem* rightButtonItem = [UIBarButtonItem barItemWithImage:[UIImage imageNamed:@"yourImage"]
                                                   highlightedImage:[UIImage imageNamed:@"yourImage"]
                                                            xOffset:11
                                                             target:self
                                                             action:@selector(yourHandler)];
self.navigationItem.rightBarButtonItem = rightButtonItem;

带有文本的按钮示例:

self.navigationItem.leftBarButtonItem = [UIBarButtonItem barItemWithTitle:@"yourText" xOffset:-11 target:self action:@selector(yourHandler:)];
self.navigationItem.rightBarButtonItem = [UIBarButtonItem barItemWithTitle:@"yourText" xOffset:11 target:self action:@selector(yourHandler:)];

就是这样。

- itisalex

Answer 5

我使用故事板界面解决了这个问题。

1.选择“Bar item”。

2.选择“Size Inspector”。

在此处，您可以找到图像插入，使用“top”、“bottom”和“left”、“right”可以更改Bar Item的位置。

- jithin

Answer 6

正如@Luda所评论的那样，解决方案是

self.myBarButtonItem.imageInsets = UIEdgeInsetsMake(0, 25, 0, -25);

然而，@andrrs 在插入很大时也指出了一个问题：命中区域。在这种情况下，我们必须实现一种设置 setHitTestEdgeInsets 的方法。以下是一个类别方法：

@implementation UIButton (Extensions)

@dynamic hitTestEdgeInsets;

static const NSString *KEY_HIT_TEST_EDGE_INSETS = @"HitTestEdgeInsets";

-(void)setHitTestEdgeInsets:(UIEdgeInsets)hitTestEdgeInsets {
    NSValue *value = [NSValue value:&hitTestEdgeInsets withObjCType:@encode(UIEdgeInsets)];
    objc_setAssociatedObject(self, &KEY_HIT_TEST_EDGE_INSETS, value, OBJC_ASSOCIATION_RETAIN_NONATOMIC);
}

-(UIEdgeInsets)hitTestEdgeInsets {
    NSValue *value = objc_getAssociatedObject(self, &KEY_HIT_TEST_EDGE_INSETS);
    if(value) {
        UIEdgeInsets edgeInsets; [value getValue:&edgeInsets]; return edgeInsets;
    }else {
        return UIEdgeInsetsZero;
    }
}

- (BOOL)pointInside:(CGPoint)point withEvent:(UIEvent *)event {
    if(UIEdgeInsetsEqualToEdgeInsets(self.hitTestEdgeInsets, UIEdgeInsetsZero) ||       !self.enabled || self.hidden) {
        return [super pointInside:point withEvent:event];
    }

    CGRect relativeFrame = self.bounds;
    CGRect hitFrame = UIEdgeInsetsInsetRect(relativeFrame, self.hitTestEdgeInsets);

    return CGRectContainsPoint(hitFrame, point);
}

@end

- LiangWang