如何在UIStackView中正确添加UIImageView

时间:2015-08-15 17:39:35

标签: ios uiimageview autolayout uistackview

我的UIImageView加载了高分辨率的图片。当我将UIImageView添加到UIStackView时,堆栈视图将增长到1900x1200维度。 UIImageView contentMode设置为Aspect Fill。

在将图像添加到堆叠视图后,我能做什么才能使图像保持当前尺寸(130x130)?

3 个答案:

答案 0 :(得分:17)

我希望你现在已经回答了你的问题,但如果不是,你就去了:

只需将高度和宽度约束添加到UIImageView,然后再将其放入堆栈视图中。让它们都是130,你应该很高兴。

答案 1 :(得分:3)

我能够通过图像视图的设置宽高比来克服这个问题。我的UIImageView未直接添加到UIStackView,而是包含在普通UIView中。这样我就可以避免直接干扰UIStackView为每个添加的子视图创建的任何约束。

使用PureLayout的示例:

#import <math.h>
#import <float.h>

@interface StackImageView : UIView

@property (nonatomic) UIImageView *imageView;
@property (nonatomic) NSLayoutConstraint *aspectFitConstraint;

@end

@implementation StackImageView

// skip initialization for sanity
// - (instancetype)initWithFrame:...

- (void)setup {
    self.imageView = [[UIImageView alloc] initForAutoLayout];
    self.imageView.contentMode = UIViewContentModeScaleAspectFit;

    [self addSubview:self.imageView];

    // pin image view to superview edges
    [self.imageView autoPinEdgesToSuperviewEdges];
}

- (void)setImage:(UIImage *)image {
    CGSize size = image.size;
    CGFloat aspectRatio = 0;

    // update image
    self.imageView.image = image;

    if(fabs(size.height) >= FLT_EPSILON) {
        aspectRatio = size.width / size.height;
    }

    // Remove previously set constraint
    if(self.aspectFitConstraint) {
        [self.imageView removeConstraint:self.aspectFitConstraint];
        self.aspectFitConstraint = nil;
    }

    // Using PureLayout library
    // you may achieve the same using NSLayoutConstraint
    // by setting width-to-height constraint with
    // calculated aspect ratio as multiplier value
    self.aspectFitConstraint =
    [self.imageView autoMatchDimension:ALDimensionWidth  
                           toDimension:ALDimensionHeight 
                                ofView:self.imageView
                        withMultiplier:aspectRatio 
                              relation:NSLayoutRelationEqual];
}

@end

答案 2 :(得分:0)

设置

clipToBounds = true

您可以通过“界面”构建器通过选择“图像”视图或 您可以将代码添加为

imageView.clipToBounds = true