0

I have a view that has an header. This header has 4 views that show images on the right. I call them icons since every of them shows or draw a glyph. Depending on data, icon 2, 3 or 4 may be hidden given me six possible combinations. Even when hidden, every invisible icon occupy its space, giving one or more "holes" in the visualization. This is what I'm using right now.

[header addSubview:_label];
[header addSubview:_icon1];
[header addSubview:_icon2];
[header addSubview:_icon3];
[header addSubview:_icon4];


NSDictionary *headerViewDict = NSDictionaryOfVariableBindings(_label, _icon1, _icon2, _icon3, _icon4);

[header addConstraints:[NSLayoutConstraint constraintsWithVisualFormat:@"|-2-[_label]-0-[_icon4(>=0,14)]-1-[_icon3(>=0,14)]-1-[_icon2(>=0,14)]-1-[_icon1(14)]-2-|" options:nil metrics:nil views:headerViewDict]];
[header addConstraints:[NSLayoutConstraint constraintsWithVisualFormat:@"V:|[_label]|" options:nil metrics:nil views:headerViewDict]];
[header addConstraints:[NSLayoutConstraint constraintsWithVisualFormat:@"V:|[_icon1]|" options:nil metrics:nil views:headerViewDict]];
[header addConstraints:[NSLayoutConstraint constraintsWithVisualFormat:@"V:|[_icon2]|" options:nil metrics:nil views:headerViewDict]];
[header addConstraints:[NSLayoutConstraint constraintsWithVisualFormat:@"V:|[_icon3]|" options:nil metrics:nil views:headerViewDict]];
[header addConstraints:[NSLayoutConstraint constraintsWithVisualFormat:@"V:|[_icon4]|" options:nil metrics:nil views:headerViewDict]];

I've just read (https://stackoverflow.com/a/18066138/1360888) that to solve this there are two possibilities over-constrain or change constant. I'm quite new to autolayout and I have used always Visual Format Language (since I build my view with code only) so I did not understood how to apply that solution to my case.

How can I create a fluid layout for my view?

Note: In my app I have a lot of views like the header visible at the same time, so performance is important.

Community
  • 1
  • 1
giampaolo
  • 6,906
  • 5
  • 45
  • 73
  • The question you linked is trying to get the icons to take up the space of the removed views, in your case, if you are simply hiding, I would think this would work. What behavior are you seeing? – Kevin DiTraglia Mar 24 '14 at 21:04
  • If I hide an icon, I will get only white space at icon place. – giampaolo Mar 24 '14 at 21:21

1 Answers1

0

What I would do is to create an array of icons(as you call them, UIImageViews?). Then update the contents of the array according to your data.

On ViewWillLayoutSubviews

  1. Check the array [1, 2, 3, 4]
  2. Remove all constraints
  3. Set new constraints according to your content array. The important thing here is to check the element of the array as nil. Autolayout does not process the nil elements correctly and fails.

Removing constraints:

//Clear the constraints
for (NSLayoutConstraint *constraint in [self.view constraints]) {
    [self.view removeConstraint:constraint];
}

Adding constraints:

if (myCustomView) {//constraintsWithVisualFormat does not support handling nil
    //Add constraints for myCustomView Here
}

ViewWillLayoutSubviews

/**
 * Update the constraints before laying subviews
 *
 */
- (void) viewWillLayoutSubviews
{
    [super viewWillLayoutSubviews];

    //Remove constraints

    //Set new constraints

}
EhTd
  • 3,260
  • 4
  • 19
  • 18