Question

我正在尝试创建一个如下所示的按钮：

因此它有一个边框和一个右图像。

我将UIButton分类为：

class ButtonWithRightImage: UIButton {

    override func imageRectForContentRect(contentRect:CGRect) -> CGRect {
        var imageFrame = super.imageRectForContentRect(contentRect)
        imageFrame.origin.x = CGRectGetMaxX(super.titleRectForContentRect(contentRect)) - CGRectGetWidth(imageFrame)
        return imageFrame
    }

    override func titleRectForContentRect(contentRect:CGRect) -> CGRect {
        var titleFrame = super.titleRectForContentRect(contentRect)
        if (self.currentImage != nil) {
            titleFrame.origin.x = CGRectGetMinX(super.imageRectForContentRect(contentRect))
        }
        return titleFrame
    }
}

我创建了我的按钮，如下所示：

lazy var testButton: ButtonWithRightImage = {
   let button = ButtonWithRightImage(forAutoLayout: ())

    button.setTitle("Privacy", forState: .Normal)
    button.setTitleColor(UIColor.DarkBlue(), forState: .Normal)

    button.layer.borderWidth = 1
    button.layer.borderColor = UIColor.grey().CGColor

    button.setImage(UIImage(named: "arrow"), forState: .Normal)

    button.contentHorizontalAlignment = .Left
    button.contentEdgeInsets = UIEdgeInsetsMake(0, 20, 0, 0)

    return button
}()

现在我的按钮看起来像这样：

如您所见，图像未与右侧20个点对齐。我无法弄清楚如何做到这一点。我正在使用autolayout来显示按钮，所以我不能只修改帧。

Answer 1

由于您的ButtonWithRightImage类需要修改以根据您的要求实现输出。

class ButtonWithRightImage: UIButton {

    override func imageRectForContentRect(contentRect:CGRect) -> CGRect {
        var imageFrame = super.imageRectForContentRect(contentRect)
        imageFrame.origin.x = CGRectGetWidth(contentRect) - CGRectGetWidth(imageFrame)
        return imageFrame
    }

    override func titleRectForContentRect(contentRect:CGRect) -> CGRect {
        var titleFrame = super.titleRectForContentRect(contentRect)
        if (self.currentImage != nil) {
            titleFrame.origin.x = CGRectGetMinX(super.imageRectForContentRect(contentRect))
        }
        return titleFrame
    }
}

问题是您需要减去container width的图像宽度。而不是container maxX值。

如果您对此有任何评论，请与我们联系。

由于

Answer 2

为按钮设置imageEdgeInsets类似下面的代码： -

lazy var testButton: ButtonWithRightImage = 
{
   let button = ButtonWithRightImage(forAutoLayout: ())

    button.setTitle("Privacy", forState: .Normal)
    button.setTitleColor(UIColor.DarkBlue(), forState: .Normal)

    button.layer.borderWidth = 1
    button.layer.borderColor = UIColor.grey().CGColor

    button.setImage(UIImage(named: "arrow"), forState: .Normal)

    button.contentHorizontalAlignment = .Left
    button.imageEdgeInsets = UIEdgeInsetsMake(0, 280, 0, 0)

    return button
}()

Answer 3

基于MinuMaster's answer的Swift 3及以上解决方案。

此外，还添加了一项规定，即为故事板设置图像的右侧填充和左侧填充文本。

另外，已处理文本长度，因此不应与图像重叠。

class ButtonWithRightImage: UIButton {

    @IBInspectable var imagePaddingRight: CGFloat = 0.0
    @IBInspectable var textPaddingLeft: CGFloat = 0.0

    override func imageRect(forContentRect contentRect:CGRect) -> CGRect {
        var imageFrame = super.imageRect(forContentRect: contentRect)
        imageFrame.origin.x = contentRect.width - imageFrame.width - imagePaddingRight
        return imageFrame
    }

    override func titleRect(forContentRect contentRect:CGRect) -> CGRect {
        var titleFrame = super.titleRect(forContentRect: contentRect)
        if (self.currentImage != nil) {
            titleFrame.origin.x = super.imageRect(forContentRect: contentRect).minX + textPaddingLeft
            if titleFrame.size.width > frame.size.width - (imageView?.frame.size.width)! - imagePaddingRight {
                titleFrame.size.width = titleFrame.size.width - (imageView?.frame.size.width)! - imagePaddingRight
            }
        }
        return titleFrame
    }
}

带右图像的按钮从右侧

3 个答案: