关于iOS:如何调整UIButton的imageSize?

How to adjust an UIButton's imageSize?

如何调整UIButton的图像大小? 我正在这样设置图像:

1
[myLikesButton setImage:[UIImage imageNamed:@"icon-heart.png"] forState:UIControlStateNormal];

但是,这会将图像填充到完整按钮,如何缩小图像?


如果我正确理解了您要执行的操作,则需要使用按钮图像边缘插图。就像是:

1
myLikesButton.imageEdgeInsets = UIEdgeInsetsMake(top, left, bottom, right);

蒂姆的答案是正确的,但是我想添加另一个建议,因为就我而言,这是一个更简单的解决方案。

我一直在尝试设置UIButton图像插入,因为我没有意识到我可以在按钮的UIImageView上设置内容模式,这样可以避免完全使用UIEdgeInsets和硬编码值。只需访问按钮上的基础imageview并设置内容模式:

1
myButton.imageView.contentMode = UIViewContentModeScaleAspectFit;

看到UIButton不听内容模式设置吗?

迅捷3

1
myButton.imageView?.contentMode = .scaleAspectFit


斯威夫特3:

1
2
3
4
button.setImage(UIImage(named:"checkmark_white"), for: .normal)
button.contentVerticalAlignment = .fill
button.contentHorizontalAlignment = .fill
button.imageEdgeInsets = UIEdgeInsetsMake(10, 10, 10, 10)


您也可以从这样的界面生成器中执行此操作。

enter image description here

我认为这很有帮助。


您可以使用imageEdgeInsets属性
按钮图片周围矩形的插入或起始边距。

1
 [self.btn setImageEdgeInsets:UIEdgeInsetsMake(6, 6, 6, 6)];

正值会缩小或插入该边缘(移动)。负值扩展或起始于该边缘。


如果您的图片太大(并且您不能/不希望只是缩小图片),那么将前两个答案结合起来效果很好。

1
2
addButton.imageView?.contentMode = .scaleAspectFit
addButton.imageEdgeInsets = UIEdgeInsetsMake(15.0, 15.0, 15.0, 5.0)

除非您获得恰好正确的图像插图,否则图像将歪斜而不会更改contentMode


这是Swift版本:

1
myButton.imageEdgeInsets = UIEdgeInsets(top: 10, left: 10, bottom: 10, right: 10)

斯威夫特4

您将需要按此特定顺序使用这两行代码。您所需要做的就是更改边缘插图的顶部和底部值。

1
2
addButton.imageView?.contentMode = .scaleAspectFit
addButton.imageEdgeInsets = UIEdgeInsetsMake(10.0, 0.0, 10.0, 0.0)


借助Tim C的答案,我能够使用Swift在UIButton上创建扩展名,该扩展名允许您通过将.setImage()函数与附加的frame参数一起使用来指定图像帧

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
extension UIButton{

    func setImage(image: UIImage?, inFrame frame: CGRect?, forState state: UIControlState){
        self.setImage(image, forState: state)

        if let frame = frame{
            self.imageEdgeInsets = UIEdgeInsets(
                top: frame.minY - self.frame.minY,
                left: frame.minX - self.frame.minX,
                bottom: self.frame.maxY - frame.maxY,
                right: self.frame.maxX - frame.maxX
            )
        }
    }

}

使用此方法,如果要将UIButton的框架设置为CGRectMake(0, 0, 64, 64),并使用CGRectMake(8, 8, 48, 48)的框架将其图像设置为myImage,则可以使用

1
2
3
4
5
6
let button: UIButton = UIButton(frame: CGRectMake(0, 0, 64, 64))
button.setImage(
    myImage,
    inFrame: CGRectMake(8, 8, 48, 48),
    forState: UIControlState.Normal
)


使用更改图标大小时
UIEdgeInsetsMake(top, left, bottom, right),请牢记按钮尺寸和UIEdgeInsetsMake可以将负值当作正值使用。

示例:两个高度为100且纵横比为1:1的按钮。

1
2
left.imageEdgeInsets = UIEdgeInsetsMake(40, 0, 40, 0)
right.imageEdgeInsets = UIEdgeInsetsMake(40, 0, 40, 0)

enter image description here

1
2
left.imageEdgeInsets = UIEdgeInsetsMake(40, 0, 40, 0)
right.imageEdgeInsets = UIEdgeInsetsMake(45, 0, 45, 0)

enter image description here

1
2
left.imageEdgeInsets = UIEdgeInsetsMake(40, 0, 40, 0)
right.imageEdgeInsets = UIEdgeInsetsMake(60, 0, 60, 0)

enter image description here

示例1和3相同,因为ABS(100-(40 + 40))= ABS(100-(60 + 60))


一种方法是使用以下代码来调整UIImage的大小。注意:此代码仅按高度缩放,但是您也可以轻松地将函数调整为按宽度缩放。

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
let targetHeight = CGFloat(28)
let newImage = resizeImage(image: UIImage(named:"Image.png")!, targetHeight: targetHeight)
button.setImage(newImage, for: .normal)

fileprivate func resizeImage(image: UIImage, targetHeight: CGFloat) -> UIImage {
    // Get current image size
    let size = image.size

    // Compute scaled, new size
    let heightRatio = targetHeight / size.height
    let newSize = CGSize(width: size.width * heightRatio, height: size.height * heightRatio)
    let rect = CGRect(x: 0, y: 0, width: newSize.width, height: newSize.height)

    // Create new image
    UIGraphicsBeginImageContextWithOptions(newSize, false, 0)
    image.draw(in: rect)
    let newImage = UIGraphicsGetImageFromCurrentImageContext()
    UIGraphicsEndImageContext()

    // Return new image
    return newImage!
}


迅捷3

我将myButton的宽度和高度设置为40,并且从EdgeInsetsMake填充的边数为15。我建议为您的按钮添加背景色以查看实际的填充。

1
2
3
myButton.backgroundColor = UIColor.gray // sample color to check padding
myButton.imageView?.contentMode = .scaleAspectFit
myButton.imageEdgeInsets = UIEdgeInsetsMake(15, 15, 15, 15)

这是缩放UIButton的imageView的另一种解决方案。

1
button.imageView?.layer.transform = CATransform3DMakeScale(0.8, 0.8, 0.8)

为Swift 3更新

1
yourButtonName.imageEdgeInsets = UIEdgeInsetsMake(10, 10, 10, 10)

我认为,您的图像大小也与按钮大小相同,然后将图像放在按钮的背景中,例如:

1
[myLikesButton setBackgroundImage:[UIImage imageNamed:@"icon-heart.png"] forState:UIControlStateNormal];

您的桅杆具有相同大小的图像和按钮。我希望您理解我的观点。