iOS：将 UIImageView 对齐到顶部

Posted 2023-03-12

【中文标题】iOS：将 UIImageView 对齐到顶部

【英文标题】：iOS: Align UIImageView to top

【发布时间】：2013-06-20 16:54:08

【问题描述】：

我有一个视图控制器，用于从网络加载图像。图像通常会比视口大得多，因此我将其缩小并将其放置在 UIImageView 中。问题是它不想与视口的顶部对齐。我将如何解决这个问题。代码如下：

- (void)viewDidLoad

NSURL *imageURL = [NSURL URLWithString:[[self exhibit] image]];

NSData *imageData = [NSData dataWithContentsOfURL:imageURL];
UIImage *image = [UIImage imageWithData:imageData];

UIImageView *iv = [[UIImageView alloc] initWithImage:image];


[iv setContentMode:UIViewContentModeScaleAspectFit];
[iv setTranslatesAutoresizingMaskIntoConstraints:NO];
[[self view] addSubview:iv];
[self setImageView:iv];

NSDictionary *nameMap = @@"imageView" : [self imageView];

NSArray *horizontalConstraints = [NSLayoutConstraint constraintsWithVisualFormat:@"H:|-10-[imageView]-10-|"
                                                                         options:NSLayoutFormatAlignAllCenterX
                                                                         metrics:nil
                                                                           views:nameMap];
[[self view] addConstraints:horizontalConstraints];

NSArray *verticalConstraints = [NSLayoutConstraint constraintsWithVisualFormat:@"V:|-0-[imageView]"
                                                                         options:NSLayoutFormatAlignAllTop
                                                                         metrics:nil
                                                                           views:nameMap];
[[self view] addConstraints:verticalConstraints];

NSLog(@"%@", NSStringFromCGRect([[self imageView] frame]));

最后的log显示UIImageView是原图大小的大小，不是缩小版。我假设这是问题所在，但我不确定如何解决它。

【问题讨论】：

好吧，contentMode UIViewContentModeScaleAspectFit 是您的图像视图是原始图像大小的原因。您可以尝试切换到 UIViewContentModeScaleToFill（或者只是删除您设置 contentMode 的行，因为 UIViewContentModeScaleToFill 是默认设置）。

这不会忽略纵横比吗？

是的，你是对的。我想我不完全确定问题是什么。您希望您的图像视图距离您的超级视图的顶部边缘 0 像素？或者您希望图像视图的大小与图像的缩小版本一样大？

我希望缩小图像以适应视图并与视图顶部对齐。这有意义吗？

您的自动布局约束是否有任何作用？我认为您要么希望视觉格式语言字符串中的视图为 [iv] 或 [_imageView]。对不起所有的 cmets，但我不确定如何回答你的问题。

【参考方案1】：

我做了另一个解决方案。我修改了这个解决方案来为我工作： What's the easiest way to resize/optimize an image size with the iPhone SDK?

如果屏幕宽度小于600px，我只需要修改图像。我也提前知道了我将使用的图像的纵横比。

这是我的新 viewDidLoad

- (void)viewDidLoad

NSURL *imageURL = [NSURL URLWithString:[[self exhibit] image]];

NSData *imageData = [NSData dataWithContentsOfURL:imageURL];
UIImage *image = [UIImage imageWithData:imageData];

if ([[UIScreen mainScreen] bounds].size.width < 600 ) 
    CGSize newSize = CGSizeMake(300.0, 140.6);
    UIGraphicsBeginImageContext(newSize);
    [image drawInRect:CGRectMake(0.0, 0.0, newSize.width, newSize.height)];
    image = UIGraphicsGetImageFromCurrentImageContext();


NSLog(@"%@",NSStringFromCGSize([image size]));

CGRect frame = CGRectMake(0.0, 0.0,image.size.width,image.size.height);
UIImageView *iv = [[UIImageView alloc] initWithFrame:frame];
[iv setImage:image];
[iv setContentMode:UIViewContentModeScaleAspectFit];
[iv setTranslatesAutoresizingMaskIntoConstraints:NO];
[iv setBackgroundColor:[UIColor redColor]];
[[self view] addSubview:iv];
[self setImageView:iv];

[[self imageView] setFrame:CGRectMake(0.0, 0.0, 300.0, 140.6)];


NSDictionary *nameMap = @@"imageView" : [self imageView];

NSArray *horizontalConstraints = [NSLayoutConstraint constraintsWithVisualFormat:@"H:|-10-[imageView]-10-|"
                                                                         options:NSLayoutFormatAlignAllCenterX
                                                                         metrics:nil
                                                                           views:nameMap];
[[self view] addConstraints:horizontalConstraints];

NSArray *verticalConstraints = [NSLayoutConstraint constraintsWithVisualFormat:@"V:|-0-[imageView]"
                                                                         options:NSLayoutFormatAlignAllTop
                                                                         metrics:nil
                                                                           views:nameMap];
[[self view] addConstraints:verticalConstraints];