масштабирование изображения в UIButton до AspectFit?


Я хочу добавить изображение в UIButton, а также хочу масштабировать свое изображение, чтобы соответствовать UIButton (сделать изображение меньше). Пожалуйста, покажите мне, как это сделать.

Это то, что я пробовал, но это не работает:

  • добавление изображения к кнопке и использование setContentMode:
[self.itemImageButton setImage:stretchImage forState:UIControlStateNormal];
[self.itemImageButton setContentMode:UIViewContentModeScaleAspectFit];
  • создание "растягивающего изображения":
UIImage *stretchImage = [updatedItem.thumbnail stretchableImageWithLeftCapWidth:0 topCapHeight:0];
14 79

14 ответов:

Если вы действительно хотите масштабировать изображение, сделайте это, но вы должны изменить его размер перед его использованием. Изменение размера во время выполнения просто потеряет циклы процессора.

Это категория, которую я использую для масштабирования изображения:

UIImage + Экстра.h

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

UIImage + Экстра.м

@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)]];

У меня была та же проблема. Просто установите ContentMode ImageView, который находится внутри UIButton.

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

надеюсь, что это помогает.

ни один из ответов здесь действительно не работал для меня, я решил проблему со следующим кодом:

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

вы также можете сделать это в Построителе интерфейса.

enter image description here

самый простой способ программно установить UIButton imageView в аспект fit режим :

Свифт

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

С

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

Примечание.: Ты можешь измениться .scaleAspectFit (UIViewContentModeScaleAspectFit) to .scaleAspectFill (UIViewContentModeScaleAspectFill) для установки аспект заполнить режим

У меня были проблемы с изображением, не изменяющимся пропорционально, поэтому я исправил его с помощью краевых вставок.

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

теперь это можно сделать через свойства UIButton IB. Ключ состоит в том, чтобы установить изображение в качестве фона, в противном случае он не будет работать.

enter image description here

расширяя ответ Дэйва, вы можете установить contentMode кнопки imageView все в IB, без какого-либо кода, используя атрибуты времени выполнения:

enter image description here

  • 1 означает UIViewContentModeScaleAspectFit,
  • 2 будет означать UIViewContentModeScaleAspectFill.

Если вы просто хотите уменьшить изображение кнопки:

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

самое чистое решение-использовать Автоматический Макет. Я опустил Приоритет Сопротивления Сжатию Содержимого моего UIButton и установить изображение (не Фоновое Изображение) через Interface Builder. После этого я добавил несколько ограничений, которые определяют размер моей кнопки (довольно сложный в моем случае), и это сработало как шарм.

У меня есть метод, который делает это для меня . метод принимает uibutton и делает изображение аспекта fit

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

убедитесь, что вы установили свойство image to Image, но не в фоновом режиме

фоновое изображение на самом деле может быть установлено для масштабирования заливки аспекта довольно легко. Просто нужно сделать что-то вроде этого в подклассе UIButton:

- (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;
}

Для Xamarin.iOS (C#):

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

вам просто нужно установить режим содержимого UIButton imageview для трех событий. -

[cell.button setImage:[UIImage imageWithData:data] forState:UIControlStateNormal];

[cell.button setImage:[UIImage imageWithData:data] forState:UIControlStateHighlighted];

[cell.imgIcon setImage:[UIImage imageWithData:data] forState:UIControlStateSelected];

У нас есть код для трех событий bcoz при выделении или выборе, если размер кнопки является квадратным, а размер изображения-прямоугольником, то он покажет квадратное изображение во время выделения или выбора.

Я уверен, что это будет работать для вас.