UIImageViewアスペクトフィットと中央


183

プログラムで宣言された画像ビューがあり、その画像もプログラムで設定しています。

ただし、画像を縦横に合わせて中央に配置することはできません。

言い換えれば、私は画像に次のことを望んでいます:

  • 画像が大きい場合は、アスペクトに合わせて縮小します。
  • 画像が小さい場合、中央に配置しますが拡大しません。

どうすれば入手できますか?


19
[yourImageView setContentMode:UIViewContentModeCenter]; また、imageViewフレームがイメージフレームより大きいかどうかを確認してください。そうでない場合は、[yourImageView setContentMode:UIViewContentModeAspectToFit]を配置します。
Manohar Perepa 2013年

1
もし他に条件があれば@RyanPoolos
Manohar Perepa 2013年

回答:


205

ソリューションを貼り付けるだけ:

@manoharが言ったように

imageView.contentMode = UIViewContentModeCenter;
if (imageView.bounds.size.width > ((UIImage*)imagesArray[i]).size.width && imageView.bounds.size.height > ((UIImage*)imagesArray[i]).size.height) {
       imageView.contentMode = UIViewContentModeScaleAspectFit;
}

私の問題を解決しました


7
画像を見つけるためのより短い方法は小さいです:CGRectContainsRect(imageView.bounds, {CGPointZero, image.size})
Cfr

@Cfrおそらくもっと短いですが、それほど読みやすくはありません。同時に、私はこのようなif文で行を分割することを提案します:CGSize imageSize = ((UIImage*)imagesArray[i]).size;CGSize viewSize = imageView.bounds.sizeif (viewSize.width > imageSize.width && viewSize.height > imageSize.height) {
Timur Bernikovich

1
UIViewContentModeScaleAspectFit
NoelHunter

imageView.contentMode = UIViewContentModeScaleAspectFit;
Arjay Waran 2017年

75

Swift言語では、次のようにUIImageビューのコンテンツモードを設定できます。

let newImgThumb = UIImageView(frame: CGRect(x: 10, y: 10, width: 100, height: 100))
newImgThumb.contentMode = .scaleAspectFit

3
これは、OPが要求したものとは逆に、画像が画像ビューよりも小さい場合、画像を拡大します。
18

18

迅速

yourImageView.contentMode = .center

次のオプションを使用して、画像を配置できます。

  • scaleToFill
  • scaleAspectFit //コンテンツは固定アスペクトに合わせてスケーリングされます。残りは透明
  • redraw //境界の変更時に再描画します(-setNeedsDisplayを呼び出します)
  • center//内容は同じサイズのままです。調整された位置。
  • top
  • bottom
  • left
  • right
  • topLeft
  • topRight
  • bottomLeft
  • bottomRight

12

回答を更新しました

2014年にこの質問に最初に回答したとき、小さな画像の場合に画像を拡大しないという要件はありませんでした。(質問は2015年編集されました。)そのような要件がある場合は、実際に画像のサイズをimageViewのサイズと比較して、UIViewContentModeCenter(imageViewより小さい画像の場合)または使用する必要があります。UIViewContentModeScaleAspectFit他のすべての場合に。

元の答え

imageViewのcontentModeをUIViewContentModeScaleAspectFitに設定するだけで十分でした。画像も中央に配置されているようです。他の人が画像に基づいたロジックを使用している理由がわかりません。この質問も参照してください:iOSアスペクトフィットとセンター


1
これは、OPが要求したものとは逆に、画像が画像ビューよりも小さい場合、画像を拡大します。
18

1
@fishinear画像を拡大しないという要件は、回答してから1年後に質問に追加されました:stackoverflow.com/posts/15499376/revisions
Nate Cook

10

私はこの問題をこのように解決しました。

  1. setImage to UIImageView(with UIViewContentModeScaleAspectFit
  2. imageSizeを取得する (CGSize imageSize = imageView.image.size)
  3. UIImageView サイズ変更。 [imageView sizeThatFits:imageSize]
  4. 希望の位置に移動します。

UIViewをの上部中央に配置したかったのUICollectionViewCellです。なので、この機能を使いました。

- (void)setImageToCenter:(UIImageView *)imageView
{
    CGSize imageSize = imageView.image.size;
    [imageView sizeThatFits:imageSize];
    CGPoint imageViewCenter = imageView.center;
     imageViewCenter.x = CGRectGetMidX(self.contentView.frame);
    [imageView setCenter:imageViewCenter];
}

わたしにはできる。


8

このサブクラスは、イメージがビューよりも大きくない場合は中心を使用し、そうでない場合は縮小します。私はこれが役に立ちましたUIImageViewは、サイズを変更するに。

表示される画像は、大きいサイズのビューよりも小さく、小さいサイズのビューよりも大きくなります。スケールダウンだけでなく、スケールアップしたい。

class CenterScaleToFitImageView: UIImageView {
    override var bounds: CGRect {
        didSet {
            adjustContentMode()
        }
    }

    override var image: UIImage? {
        didSet {
            adjustContentMode()
        }
    }

    func adjustContentMode() {
        guard let image = image else {
            return
        }
        if image.size.width > bounds.size.width ||
            image.size.height > bounds.size.height {
            contentMode = .ScaleAspectFit
        } else {
            contentMode = .Center
        }
    }
}

8

これを実現するには、画像ビューのコンテンツモードをUIViewContentModeScaleAspectFillに設定します。

次に、次のメソッドmethodを使用して、サイズ変更されたuiimageオブジェクトを取得します。

- (UIImage*)setProfileImage:(UIImage *)imageToResize onImageView:(UIImageView *)imageView
{
    CGFloat width = imageToResize.size.width;
    CGFloat height = imageToResize.size.height;
    float scaleFactor;
    if(width > height)
    {
        scaleFactor = imageView.frame.size.height / height;
    }
    else
    {
        scaleFactor = imageView.frame.size.width / width;
    }

    UIGraphicsBeginImageContextWithOptions(CGSizeMake(width * scaleFactor, height * scaleFactor), NO, 0.0);
    [imageToResize drawInRect:CGRectMake(0, 0, width * scaleFactor, height * scaleFactor)];
    UIImage *resizedImage = UIGraphicsGetImageFromCurrentImageContext();
    UIGraphicsEndImageContext();

    return resizedImage;
}

Edited Here(Swiftバージョン)

func setProfileImage(imageToResize: UIImage, onImageView: UIImageView) -> UIImage
{
    let width = imageToResize.size.width
    let height = imageToResize.size.height

    var scaleFactor: CGFloat

    if(width > height)
    {
        scaleFactor = onImageView.frame.size.height / height;
    }
    else
    {
        scaleFactor = onImageView.frame.size.width / width;
    }

    UIGraphicsBeginImageContextWithOptions(CGSizeMake(width * scaleFactor, height * scaleFactor), false, 0.0)
    imageToResize.drawInRect(CGRectMake(0, 0, width * scaleFactor, height * scaleFactor))
    let resizedImage = UIGraphicsGetImageFromCurrentImageContext()
    UIGraphicsEndImageContext()

    return resizedImage;
}

7
[your_imageview setContentMode:UIViewContentModeCenter];

17
これはスケーリングを無視します
Skrew

2
このような解決策がなぜ多くの賛成票を得たのか、私にはわかりません。この人は明らかに質問をまったく読みませんでした。
遅い

7
let bannerImageView = UIImageView();
bannerImageView.contentMode = .ScaleAspectFit;
bannerImageView.frame = CGRectMake(cftX, cftY, ViewWidth, scrollHeight);

これは、OPが要求したものとは逆に、画像が画像ビューよりも小さい場合、画像を拡大します。
18

2

UIImageのサイズ変更をお探しの方は、

@implementation UIImage (Resize)

- (UIImage *)scaledToSize:(CGSize)size
{
    UIGraphicsBeginImageContextWithOptions(size, NO, 0.0f);
    [self drawInRect:CGRectMake(0.0f, 0.0f, size.width, size.height)];
    UIImage *image = UIGraphicsGetImageFromCurrentImageContext();
    UIGraphicsEndImageContext();
    return image;
}

- (UIImage *)aspectFitToSize:(CGSize)size
{
    CGFloat aspect = self.size.width / self.size.height;
    if (size.width / aspect <= size.height)
    {
        return [self scaledToSize:CGSizeMake(size.width, size.width / aspect)];
    } else {
        return [self scaledToSize:CGSizeMake(size.height * aspect, size.height)];
    }
}

- (UIImage *)aspectFillToSize:(CGSize)size
{
    CGFloat imgAspect = self.size.width / self.size.height;
    CGFloat sizeAspect = size.width/size.height;

    CGSize scaledSize;

        if (sizeAspect > imgAspect) { // increase width, crop height
            scaledSize = CGSizeMake(size.width, size.width / imgAspect);
        } else { // increase height, crop width
            scaledSize = CGSizeMake(size.height * imgAspect, size.height);
        }
    UIGraphicsBeginImageContextWithOptions(size, NO, 0.0f);
    CGContextRef context = UIGraphicsGetCurrentContext();
    CGContextClipToRect(context, CGRectMake(0, 0, size.width, size.height));
    [self drawInRect:CGRectMake(0.0f, 0.0f, scaledSize.width, scaledSize.height)];
    UIImage *image = UIGraphicsGetImageFromCurrentImageContext();
    UIGraphicsEndImageContext();
    return image;
}

@end
弊社のサイトを使用することにより、あなたは弊社のクッキーポリシーおよびプライバシーポリシーを読み、理解したものとみなされます。
Licensed under cc by-sa 3.0 with attribution required.