将 UIButton 中的图像缩放为 AspectFit?

问题描述 投票:0回答:17

我想将图像添加到 UIButton,并且还想缩放图像以适合 UIButton(使图像变小)。请告诉我该怎么做。

这是我尝试过的,但它不起作用:

  • 将图像添加到按钮并使用
    setContentMode
    :
[self.itemImageButton setImage:stretchImage forState:UIControlStateNormal];
[self.itemImageButton setContentMode:UIViewContentModeScaleAspectFit];
  • 制作“拉伸图像”:
UIImage *stretchImage = [updatedItem.thumbnail stretchableImageWithLeftCapWidth:0 topCapHeight:0];
ios objective-c cocoa-touch uibutton uikit
17个回答
210
投票

我也有同样的问题。只需设置 UIButton 内的 ImageView 的 ContentMode 即可。

[[self.itemImageButton imageView] setContentMode: UIViewContentModeScaleAspectFit];
[self.itemImageButton setImage:[UIImage imageNamed:stretchImage] forState:UIControlStateNormal];

124
投票

这里的答案都不适合我,我用以下代码解决了问题:

button.contentMode = UIViewContentModeScaleToFill;
button.contentHorizontalAlignment = UIControlContentHorizontalAlignmentFill;
button.contentVerticalAlignment = UIControlContentVerticalAlignmentFill;

您也可以在 Interface Builder 中执行此操作。


63
投票

以编程方式在 aspect fit 模式下设置 UIButton imageView 的最简单方法:

斯威夫特

button.contentHorizontalAlignment = .fill
button.contentVerticalAlignment = .fill
button.imageView?.contentMode = .scaleAspectFit

Objective-C

button.contentHorizontalAlignment = UIControlContentHorizontalAlignmentFill;
button.contentVerticalAlignment = UIControlContentVerticalAlignmentFill;
button.imageView.contentMode = UIViewContentModeScaleAspectFit;

注意: 您可以将 .scaleAspectFit (UIViewContentModeScaleAspectFit) 更改为 .scaleAspectFill (UIViewContentModeScaleAspectFill) 以设置 aspect fill 模式


27
投票

如果您确实想缩放图像,请执行此操作,但应在使用之前调整其大小。在运行时调整它的大小只会损失 CPU 周期。

这是我用来缩放图像的类别:

UIImage+Extra.h

@interface UIImage (Extras)
- (UIImage *)imageByScalingProportionallyToSize:(CGSize)targetSize;
@end;

UIImage+Extra.m

@implementation UIImage (Extras)

- (UIImage *)imageByScalingProportionallyToSize:(CGSize)targetSize {

UIImage *sourceImage = self;
UIImage *newImage = nil;

CGSize imageSize = sourceImage.size;
CGFloat width = imageSize.width;
CGFloat height = imageSize.height;

CGFloat targetWidth = targetSize.width;
CGFloat targetHeight = targetSize.height;

CGFloat scaleFactor = 0.0;
CGFloat scaledWidth = targetWidth;
CGFloat scaledHeight = targetHeight;

CGPoint thumbnailPoint = CGPointMake(0.0,0.0);

if (!CGSizeEqualToSize(imageSize, targetSize)) {

        CGFloat widthFactor = targetWidth / width;
        CGFloat heightFactor = targetHeight / height;

        if (widthFactor < heightFactor) 
                scaleFactor = widthFactor;
        else
                scaleFactor = heightFactor;

        scaledWidth  = width * scaleFactor;
        scaledHeight = height * scaleFactor;

        // center the image

        if (widthFactor < heightFactor) {
                thumbnailPoint.y = (targetHeight - scaledHeight) * 0.5; 
        } else if (widthFactor > heightFactor) {
                thumbnailPoint.x = (targetWidth - scaledWidth) * 0.5;
        }
}


// this is actually the interesting part:

UIGraphicsBeginImageContextWithOptions(targetSize, NO, 0);

CGRect thumbnailRect = CGRectZero;
thumbnailRect.origin = thumbnailPoint;
thumbnailRect.size.width  = scaledWidth;
thumbnailRect.size.height = scaledHeight;

[sourceImage drawInRect:thumbnailRect];

newImage = UIGraphicsGetImageFromCurrentImageContext();
UIGraphicsEndImageContext();

if(newImage == nil) NSLog(@"could not scale image");


return newImage ;
}

@end

您可以根据需要使用它的尺寸。喜欢:

[self.itemImageButton setImage:[stretchImage imageByScalingProportionallyToSize:CGSizeMake(20,20)]];

22
投票

我遇到了图像大小未按比例调整大小的问题,因此我修复它的方法是使用边缘插入。

fooButton.contentEdgeInsets = UIEdgeInsetsMake(10, 15, 10, 15);

17
投票

现在可以通过 IB 的 UIButton 属性来完成此操作。关键是要把你的图片设置为背景,否则不起作用。

enter image description here


14
投票

扩展戴夫的答案,您可以使用运行时属性在IB中设置按钮的

contentMode
,无需任何代码:

    imageView
  • 表示
    1
    ,
  • UIViewContentModeScaleAspectFit
  • 的意思是
    2
    
        

13
投票

2 - 设置像图像一样的对齐方式

3 - 设置内容模式如图像


8
投票

UIViewContentModeScaleAspectFill



6
投票
yourButton.contentMode = UIViewContentModeScaleAspectFit; yourButton.imageEdgeInsets = UIEdgeInsetsMake(10, 10, 10, 10);

并使图像宽高比适合。


UIButton



5
投票

-(void)makeImageAspectFitForButton:(UIButton*)button{ button.imageView.contentMode=UIViewContentModeScaleAspectFit; button.contentHorizontalAlignment=UIControlContentHorizontalAlignmentFill; button.contentVerticalAlignment=UIControlContentVerticalAlignmentFill; }



4
投票
自动布局

。我降低了 myButton2.contentMode = .scaleAspectFit myButton2.contentHorizontalAlignment = .fill myButton2.contentVerticalAlignment = .fill 内容压缩阻力优先级,并通过

Interface Builder
设置图像(不是背景图像)。之后,我添加了几个定义按钮大小的约束(在我的例子中相当复杂),它的工作就像一个魅力。


4
投票
UIButton

配置为

Style
,将
Default
配置为
State Config


3
投票


2
投票

Default



1
投票

- (CGRect)backgroundRectForBounds:(CGRect)bounds { // you'll need the original size of the image, you // can save it from setBackgroundImage:forControlState return CGRectFitToFillRect(__original_image_frame_size__, bounds); } // Utility function, can be saved elsewhere CGRect CGRectFitToFillRect( CGRect inRect, CGRect maxRect ) { CGFloat origRes = inRect.size.width / inRect.size.height; CGFloat newRes = maxRect.size.width / maxRect.size.height; CGRect retRect = maxRect; if (newRes < origRes) { retRect.size.width = inRect.size.width * maxRect.size.height / inRect.size.height; retRect.origin.x = roundf((maxRect.size.width - retRect.size.width) / 2); } else { retRect.size.height = inRect.size.height * maxRect.size.width / inRect.size.width; retRect.origin.y = roundf((maxRect.size.height - retRect.size.height) / 2); } return retRect; }



-1
投票
您只需为三个事件设置UIButton imageview的内容模式即可。 -

myButton.VerticalAlignment = UIControlContentVerticalAlignment.Fill; myButton.HorizontalAlignment = UIControlContentHorizontalAlignment.Fill; myButton.ImageView.ContentMode = UIViewContentMode.ScaleAspectFit;

我们有三个事件 bcoz 的代码,同时突出显示或选择,如果按钮大小为正方形并且图像大小为矩形,那么它将在突出显示或选择时显示方形图像。

我相信它会对你有用。

© www.soinside.com 2019 - 2024. All rights reserved.