調整UIView的子視圖大小

Question

我正在嘗試在子視圖中調整子視圖（UIImageView）的大小，但是我可以處理。

我有一個UIView，其中並排包含五個UIImageViews作為子視圖：UIView的寬度為400 px，每個子視圖的寬度為80 px（它們的xOrigins為0、80、160等）。

如何將UIVIew的大小調整為800 px的寬度，並自動將其子視圖的大小調整為160 px的寬度，並將xOrigins的大小分別設置為0、160、320等？

UIViewAutoresizingFlexibleHeight，UIViewAutoresizingFlexibleWidth，UIViewAutoresizingFlexibleLeftMargin，UIViewAutoresizingFlexibleRightMargin，UIViewAutoresizingFlexibleTopMargin，UIViewAutoresizingFlexibleBottomMargin的不同組合無法解決我的問題。

有什么幫助嗎？

代碼：UIView * mainView = [[UIView分配] initWithFrame：CGRectMake（50，50，400，200）]; mainView.autoresizesSubviews = YES; [self.view addSubview：mainView];

UIImageView *view1 = [[UIImageView alloc] initWithFrame:CGRectMake(0, 0, 80, 200)];
view1.autoresizingMask = UIViewAutoresizingFlexibleHeight | UIViewAutoresizingFlexibleWidth | UIViewAutoresizingFlexibleLeftMargin | UIViewAutoresizingFlexibleRightMargin | UIViewAutoresizingFlexibleTopMargin | UIViewAutoresizingFlexibleBottomMargin;
view1.backgroundColor = [UIColor color1];
[mainView addSubview:view1];

UIImageView *view2 = [[UIImageView alloc] initWithFrame:CGRectMake(0, 80, 80, 200)];
view2.autoresizingMask = UIViewAutoresizingFlexibleHeight | UIViewAutoresizingFlexibleWidth | UIViewAutoresizingFlexibleLeftMargin | UIViewAutoresizingFlexibleRightMargin | UIViewAutoresizingFlexibleTopMargin | UIViewAutoresizingFlexibleBottomMargin;
view2.backgroundColor = [UIColor color2];
[mainView addSubview:view2];

UIImageView *view3 = [[UIImageView alloc] initWithFrame:CGRectMake(0, 160, 80, 200)];
view3.autoresizingMask = UIViewAutoresizingFlexibleHeight | UIViewAutoresizingFlexibleWidth | UIViewAutoresizingFlexibleLeftMargin | UIViewAutoresizingFlexibleRightMargin | UIViewAutoresizingFlexibleTopMargin | UIViewAutoresizingFlexibleBottomMargin;
view3.backgroundColor = [UIColor color3];
[mainView addSubview:view3];

UIImageView *view4 = [[UIImageView alloc] initWithFrame:CGRectMake(0, 240, 80, 200)];
view4.autoresizingMask = UIViewAutoresizingFlexibleHeight | UIViewAutoresizingFlexibleWidth | UIViewAutoresizingFlexibleLeftMargin | UIViewAutoresizingFlexibleRightMargin | UIViewAutoresizingFlexibleTopMargin | UIViewAutoresizingFlexibleBottomMargin;
view4.backgroundColor = [UIColor color4];
[mainView addSubview:view4];

UIImageView *view5 = [[UIImageView alloc] initWithFrame:CGRectMake(0, 320, 80, 200)];
view5.autoresizingMask = UIViewAutoresizingFlexibleHeight | UIViewAutoresizingFlexibleWidth | UIViewAutoresizingFlexibleLeftMargin | UIViewAutoresizingFlexibleRightMargin | UIViewAutoresizingFlexibleTopMargin | UIViewAutoresizingFlexibleBottomMargin;
view5.backgroundColor = [UIColor color5];
[mainView addSubview:view5];

Answer 1

當您使用CGRectMake時，您正在使用固定寬度，您應該像這樣使值相對於彼此：

@interface ViewController ()
{
    UIView *mainView;
}

@end

@implementation ViewController

- (void)viewDidLoad
{
    [super viewDidLoad];
    // Do any additional setup after loading the view, typically from a nib.

    mainView = [[UIView alloc] initWithFrame:CGRectMake(0, 0, 400, 200)];
    mainView.backgroundColor = [UIColor grayColor];

    UIImageView *view1 = [[UIImageView alloc] initWithFrame:CGRectMake(0, 0, 80, 200)];
    view1.autoresizingMask = UIViewAutoresizingFlexibleHeight | UIViewAutoresizingFlexibleWidth | UIViewAutoresizingFlexibleLeftMargin | UIViewAutoresizingFlexibleRightMargin | UIViewAutoresizingFlexibleTopMargin | UIViewAutoresizingFlexibleBottomMargin;
    view1.backgroundColor = [UIColor redColor];
    [mainView addSubview:view1];

    UIImageView *view2 = [[UIImageView alloc] initWithFrame:CGRectMake(view1.frame.origin.x + view1.frame.size.width, 0, view1.frame.size.width, view1.frame.size.height)];
    view2.autoresizingMask = UIViewAutoresizingFlexibleHeight | UIViewAutoresizingFlexibleWidth | UIViewAutoresizingFlexibleLeftMargin | UIViewAutoresizingFlexibleRightMargin | UIViewAutoresizingFlexibleTopMargin | UIViewAutoresizingFlexibleBottomMargin;
    view2.backgroundColor = [UIColor greenColor];
    [mainView addSubview:view2];

    UIImageView *view3 = [[UIImageView alloc] initWithFrame:CGRectMake(view2.frame.origin.x + view2.frame.origin.y, 0, view1.frame.size.width, view1.frame.size.height)];
    view3.autoresizingMask = UIViewAutoresizingFlexibleHeight | UIViewAutoresizingFlexibleWidth | UIViewAutoresizingFlexibleLeftMargin | UIViewAutoresizingFlexibleRightMargin | UIViewAutoresizingFlexibleTopMargin | UIViewAutoresizingFlexibleBottomMargin;
    view3.backgroundColor = [UIColor blueColor];
    [mainView addSubview:view3];

    UIImageView *view4 = [[UIImageView alloc] initWithFrame:CGRectMake(view3.frame.origin.x + view3.frame.size.width, 0, view1.frame.size.width, view1.frame.size.height)];
    view4.autoresizingMask = UIViewAutoresizingFlexibleHeight | UIViewAutoresizingFlexibleWidth | UIViewAutoresizingFlexibleLeftMargin | UIViewAutoresizingFlexibleRightMargin | UIViewAutoresizingFlexibleTopMargin | UIViewAutoresizingFlexibleBottomMargin;
    view4.backgroundColor = [UIColor yellowColor];
    [mainView addSubview:view4];

    UIImageView *view5 = [[UIImageView alloc] initWithFrame:CGRectMake(view4.frame.origin.x + view4.frame.size.width, 0, view1.frame.size.width, view1.frame.size.height)];
    view5.autoresizingMask = UIViewAutoresizingFlexibleHeight | UIViewAutoresizingFlexibleWidth | UIViewAutoresizingFlexibleLeftMargin | UIViewAutoresizingFlexibleRightMargin | UIViewAutoresizingFlexibleTopMargin | UIViewAutoresizingFlexibleBottomMargin;
    view5.backgroundColor = [UIColor purpleColor];
    [mainView addSubview:view5];

    [self.view addSubview:mainView];


    // update width of main view to 800 pixel after 2 seconds
    [self performSelector:@selector(updateWidth) withObject:nil afterDelay:2.0];
}

-(void)updateWidth
{
    CGRect newFrame = mainView.frame;

    newFrame.size.width = 800;

    mainView.frame = newFrame;

    NSLog(@"View updated");
}

這樣，視圖相對於彼此而不是靜態值。 這是我使用上面的代碼完成的結果：

之前

后

自動布局方法

如果您想知道，如果您想走那條路線，我還為您提供了一種自動布局方法：

@interface ViewController ()
{
    UIView *mainView;
    NSLayoutConstraint *mainViewWidthConstraint;
}

@end

@implementation ViewController

- (void)viewDidLoad
{
    [super viewDidLoad];
    // Do any additional setup after loading the view, typically from a nib.

    [self initView];

    // update width of main view to 800 pixel after 2 seconds
    [self performSelector:@selector(updateWidth) withObject:nil afterDelay:2.0];
}

-(void)initView
{
    mainView = [[UIView alloc] init];
    mainView.backgroundColor = [UIColor blackColor];
    mainView.clipsToBounds = YES;
    mainView.translatesAutoresizingMaskIntoConstraints = NO;

    UIImageView *view1 = [[UIImageView alloc] init];
    view1.backgroundColor = [UIColor redColor];
    view1.translatesAutoresizingMaskIntoConstraints = NO;


    UIImageView *view2 = [[UIImageView alloc] init];
    view2.backgroundColor = [UIColor blueColor];
    view2.translatesAutoresizingMaskIntoConstraints = NO;


    UIImageView *view3 = [[UIImageView alloc] init];
    view3.backgroundColor = [UIColor yellowColor];
    view3.translatesAutoresizingMaskIntoConstraints = NO;


    UIImageView *view4 = [[UIImageView alloc] init];
    view4.backgroundColor = [UIColor purpleColor];
    view4.translatesAutoresizingMaskIntoConstraints = NO;


    UIImageView *view5 = [[UIImageView alloc] init];
    view5.backgroundColor = [UIColor grayColor];
    view5.translatesAutoresizingMaskIntoConstraints = NO;


    [mainView addSubview:view1];
    [mainView addSubview:view2];
    [mainView addSubview:view3];
    [mainView addSubview:view4];
    [mainView addSubview:view5];

    [self.view addSubview:mainView];

    id views = @{
                 @"mainView": mainView,
                 @"view1": view1,
                 @"view2": view2,
                 @"view3": view3,
                 @"view4": view4,
                 @"view5": view5
                 };

    mainViewWidthConstraint = [NSLayoutConstraint constraintWithItem:mainView attribute:NSLayoutAttributeWidth relatedBy:NSLayoutRelationEqual toItem:nil attribute:NSLayoutAttributeWidth multiplier:1.0 constant:400];
    [self.view addConstraints:[NSLayoutConstraint constraintsWithVisualFormat:@"H:|[mainView]" options:0 metrics:nil views:views]];

    // main view constraint
    [self.view addConstraint:mainViewWidthConstraint];

    // subviews constraints
    [mainView addConstraint:[NSLayoutConstraint constraintWithItem:view1 attribute:NSLayoutAttributeWidth relatedBy:NSLayoutRelationEqual toItem:mainView attribute:NSLayoutAttributeWidth multiplier:1.0/5.0 constant:0.0]];

    [mainView addConstraints:[NSLayoutConstraint constraintsWithVisualFormat:@"H:|[view1][view2(==view1)][view3(==view1)][view4(==view1)][view5(==view1)]|" options:0 metrics:nil views:views]];

    [mainView addConstraints:[NSLayoutConstraint constraintsWithVisualFormat:@"V:|[view1(200)]|" options:0 metrics:nil views:views]];
    [mainView addConstraints:[NSLayoutConstraint constraintsWithVisualFormat:@"V:|[view2(==view1)]|" options:0 metrics:nil views:views]];
    [mainView addConstraints:[NSLayoutConstraint constraintsWithVisualFormat:@"V:|[view3(==view1)]|" options:0 metrics:nil views:views]];
    [mainView addConstraints:[NSLayoutConstraint constraintsWithVisualFormat:@"V:|[view4(==view1)]|" options:0 metrics:nil views:views]];
    [mainView addConstraints:[NSLayoutConstraint constraintsWithVisualFormat:@"V:|[view5(==view1)]|" options:0 metrics:nil views:views]];
}

-(void)updateWidth
{
    mainViewWidthConstraint.constant = 800;

    [self.view layoutIfNeeded];

    NSLog(@"View updated");
}

結果相同。