如何调整UIToolBar左右填充

Ton*_*shi 60 iphone objective-c

我用代码创建一个UIToolbar,用界面构建器创建另一个UIToolbar.但是,发现两个工具栏有不同的左右填充,如下所示:

来自Interface Builder:

在此输入图像描述

来自代码:

在此输入图像描述

UIImage *buttonImage = [[UIImage imageNamed:@"button.png"] stretchableImageWithLeftCapWidth:10 topCapHeight:0];
UIButton *btnTest = [UIButton buttonWithType:UIButtonTypeCustom];
[btnTest setBackgroundImage:buttonImage forState:UIControlStateNormal];
[btnTest setTitle:@"Back" forState:UIControlStateNormal];   
[btnTest.titleLabel setFont:[UIFont boldSystemFontOfSize:13]];  
[btnTest setBackgroundImage:[imgToolbarButton stretchableImageWithLeftCapWidth:5 topCapHeight:0]  forState:UIControlStateNormal];
[btnTest addTarget:self action:@selector(clearDateEdit:) forControlEvents:UIControlEventTouchUpInside];
btnTest.frame = CGRectMake(0.0, 0.0, 50, 30);
UIBarButtonItem *btnTestItem = [[UIBarButtonItem alloc] initWithCustomView:btnTest];
[self.toolbar setItems:[NSArray arrayWithObjects:btnTestItem,nil]];
[btnTestItem release];
Run Code Online (Sandbox Code Playgroud)

我的问题是如何通过代码调整UIToolbar的左右填充?

更新

我发现这个对齐问题只发生在带有UIButton的customView的UIBarButtonItem上,UIBarButtonItem对齐很好.知道是什么导致这个或解决这个问题.

我现在能想到的唯一解决方案是手动设置框架.

Cra*_*lon 149

我有同样的问题,你可以使用UIBarButtonSystemItemFixedSpace做一个巧妙的技巧,在第一个按钮之前和最后一个按钮之后添加一个负宽度,然后将按钮移动到边缘.

例如,要删除右边距,请将以下FixedSpace条形项添加为最后一项:

UIBarButtonItem *negativeSeparator = [[UIBarButtonItem alloc] initWithBarButtonSystemItem:UIBarButtonSystemItemFixedSpace target:nil action:nil];
negativeSeparator.width = -12;
Run Code Online (Sandbox Code Playgroud)

左右边距为12px.

iOS7的更新 - iPhone的利润率为16px,iPad的利润率为20px!

  • Kevin Elliott和其他任何感兴趣的人,你之前和之后都不需要分隔符.我正在使用的代码是`[[self.navigationBar topItem] setRightBarButtonItems:@ [negativeSeparator,customButton]];`带有-5 pt宽的negativeSeparator.以这种方式添加时,数组中的第一个是最右边的,第二个放在它的左边.将正确的条形按钮项目视为堆栈,这种"反向"排序是有意义的. (7认同)
  • 我不得不使用-5的宽度,但这很好用.对于正确的条形按钮,我必须在它之前和之后添加一个negativeSeperator才能工作. (4认同)
  • 使用`self.navigationController.view.layoutMargins.right`获取实际保证金.iOS8上+ (2认同)

Ske*_*chK 24

在iOS 11之前

您有三种可能的解决方案:

  • 第一个是使用具有负宽度的固定空间项UIBarButtonItem(barButtonSystemItem:.fixedSpace ...)
  • 另一种是覆盖自定义视图上的alignmentRectInsets
  • 最后一个,如果你使用UIButton作为项目的自定义视图,你可以覆盖contentEdgeInsets和hitTest(_:with :)

当然,第一个解决方案似乎比其他解决方案更好

UIBarButtonItem *negativeSeparator = [[UIBarButtonItem alloc] initWithBarButtonSystemItem:UIBarButtonSystemItemFixedSpace target:nil action:nil];
negativeSeparator.width = -12;
Run Code Online (Sandbox Code Playgroud)

如果你使用swift,代码将是这样的

var negativeSeparator = UIBarButtonItem(barButtonSystemItem: .fixedSpace, target: nil, action: nil)
negativeSeparator.width = -12
Run Code Online (Sandbox Code Playgroud)

iOS 11之后(包含iOS 11)

不幸的是,所有解决方案都无法在iOS 11中使用

  • 第一个解决方案:设置负宽度不再有效
  • 第二个解决方案:覆盖alignmentRectInsets将导致部分项目不再接收触摸
  • 最后一个解决方案:我认为覆盖hitTest(_:with :)不是一个好主意,请不要这样做!

您还可以在开发人员论坛上看到一些建议,但在查看完所有评论之后,您会发现有关此主题的建议是创建自定义UINavigationBar子类并执行一些复杂操作.

哦,天哪,我想做的就是改变填充,而不是导航栏!

幸运的是,我们可以通过iOS 11中的技巧实现这一目标!

开始了:

1.创建一个自定义按钮

  • 将translatesAutoresizingMaskIntoConstraints设置为false
  • override alignmentRectInsets
    • 右侧的项目使用UIEdgeInsets(顶部:0,左:-8,底部:0,右:8)
    • 左侧的项目使用UIEdgeInsets(顶部:0,左:8,底部:0,右:-8)

      如果你不知道alignmentRectInsets,你可以阅读这篇博客第一

快速版

var customButton = UIButton(type: .custom)
customButton.overrideAlignmentRectInsets = UIEdgeInsets(top: 0, left: x, bottom: 0, right: -x) // you should do this in your own custom class
customButton.translatesAutoresizingMaskIntoConstraints = false;
Run Code Online (Sandbox Code Playgroud)

objective-c版本

UIButton *customButton = [UIButton buttonWithType:UIButtonTypeCustom];
customButton.overrideAlignmentRectInsets = UIEdgeInsetsMake(0, x, 0, -x); // you should do this in your own custom class
customButton.translatesAutoresizingMaskIntoConstraints = NO;
Run Code Online (Sandbox Code Playgroud)

2.使用自定义按钮创建项目

快速版

var item = UIBarButtonItem(customView: customButton)
Run Code Online (Sandbox Code Playgroud)

objective-c版本

UIBarButtonItem *item = [[UIBarButtonItem alloc] initWithCustomView:customButton]
Run Code Online (Sandbox Code Playgroud)

3.创建一个具有宽度的fixedSpace类型UIBarButtonItem

设置正值,而不是负值

快速版

var positiveSeparator = UIBarButtonItem(barButtonSystemItem:.fixedSpace, target: nil, action: nil)
positiveSeparator.width = 8
Run Code Online (Sandbox Code Playgroud)

objective-c版本

UIBarButtonItem *positiveSeparator = [[UIBarButtonItem alloc] initWithBarButtonSystemItem:UIBarButtonSystemItemFixedSpace target:nil action:nil];
positiveSeparator.width = 8;
Run Code Online (Sandbox Code Playgroud)

4.将数组设置为leftitems或rightitems

fixedSpace类型UIBarButton项必须是数组中的第一个元素.

快速版

self.navigationItem.leftBarButtonItems = [positiveSeparator, item, ...]
Run Code Online (Sandbox Code Playgroud)

objective-c版本

self.navigationItem.leftBarButtonItems = @{positiveSeparator, item, ...}
Run Code Online (Sandbox Code Playgroud)

做得好

完成所有步骤后,您将看到填充变小,类型区域似乎正确!

如果您发现错误,请告诉我!我会尽力回答你的问题!

注意

在iOS 11之前,你应该关心设备的屏幕宽度; 如果屏幕是5.5英寸,负片是-12磅,其他屏幕是-8pt.

如果你在iOS 11上使用我的解决方案,你不需要关心设备屏幕,只需设置8pt,你应该关心项目在导航栏,左侧或右侧的位置,这将影响你的自定义视图的alignmentRectInsets

想要更多的点击区域

如果您想保证您的拍子区域大于44*44,您可以覆盖以下方法

- (BOOL)pointInside:(CGPoint)point withEvent:(UIEvent *)event{
    CGSize acturalSize = self.frame.size;
    CGSize minimumSize = kBarButtonMinimumTapAreaSize;
    CGFloat verticalMargin = acturalSize.height - minimumSize.height >= 0 ? 0 : ((minimumSize.height - acturalSize.height ) / 2);
    CGFloat horizontalMargin = acturalSize.width - minimumSize.width >= 0 ? 0 : ((minimumSize.width - acturalSize.width ) / 2);
    CGRect newArea = CGRectMake(self.bounds.origin.x - horizontalMargin, self.bounds.origin.y - verticalMargin, self.bounds.size.width + 2 * horizontalMargin, self.bounds.size.height + 2 * verticalMargin);
    return CGRectContainsPoint(newArea, point);
}
Run Code Online (Sandbox Code Playgroud)


Ric*_*ppz 7

这是一个很好的问题,即使提供了解决方案 - 它也无法解决iOS11上的问题.

工作解决方案

如果您创建新的扩展名UIButton:

class BarButton: UIButton {

    override var alignmentRectInsets: UIEdgeInsets {
        return UIEdgeInsetsMake(0, 16, 0, 16)
    }

}
Run Code Online (Sandbox Code Playgroud)

然后,当您在布局中使用它时:

lazy var btnLogin: BarButton = {
    let btn = BarButton(type: .custom)
    // Add your button settings

    btn.widthAnchor.constraint(equalToConstant: self.frame.size.width).isActive = true
    btn.heightAnchor.constraint(equalToConstant: 50).isActive = true
    btn.translatesAutoresizingMaskIntoConstraints = false
    return btn
}()
Run Code Online (Sandbox Code Playgroud)

这解决了一个非常恼人的问题,如果你有什么问题可以给我一个大喊大叫.