This chapter is from the book
This chapter is from the book
This chapter is from the book
Intrinsic Content Size
Under Auto Layout, a view’s content plays as important a role in its layout as its constraints. This is expressed through each view’s intrinsicContentSize. This size describes the minimum space needed to express the full view content without squeezing or clipping that data. It derives from the natural properties of the content each view presents.
For an image view, for example, this corresponds to the size of the image it presents. A larger image requires a larger intrinsic content size. Consider the following code snippet. It loads a standard Icon.png image into an image view and reports the view’s intrinsic content size. As you’d expect, this size is 57 by 57 points, the size of the image supplied to the view (see Figure 1-9, top):
UIImageView *iv = [[UIImageView alloc]
initWithImage:[UIImage imageNamed:@"Icon.png"]];
NSLog(@"%@", NSStringFromCGSize(iv.intrinsicContentSize));
)
Figure 1-9. A view’s intrinsic content size relates the natural size that its contents occupy.
For a button, this varies with its title (see the three button images in Figure 1-9). As a title grows or shrinks, the button’s intrinsic content size adjusts to match. This snippet creates a button and assigns it a pair of titles, reporting the intrinsic content size after each assignment:
UIButton *button =
[UIButton buttonWithType:UIButtonTypeRoundedRect];
// Longer title, Figure 1-9, bottom-left image
[button setTitle:@"Hello World" forState:UIControlStateNormal];
NSLog(@"%@: %@", [button titleForState:UIControlStateNormal],
NSStringFromCGSize(button.intrinsicContentSize));
// Shorter title, Figure 1-9, bottom-right image
[button setTitle:@"On" forState:UIControlStateNormal];
NSLog(@"%@: %@", [button titleForState:UIControlStateNormal],
NSStringFromCGSize(button.intrinsicContentSize));
When run, this snippet outputs the following sizes. The Hello World version of the button expresses a wider intrinsic content size than the On version, and both use the same height. These values can vary further as you customize a font face and font size and title text:
2013-01-11 12:16:46.616 HelloWorld[47516:c07] Hello World: {107, 43}
2013-01-11 12:16:46.616 HelloWorld[47516:c07] On: {45, 43}
A view’s intrinsic size allows Auto Layout to best match a view’s frame to its natural content. Earlier, you read that unambiguous layout generally requires setting two attributes in each axis. When a view has an intrinsic content size, that size accounts for one of the two attributes. You can, for example, place a text-based control or an image view in the center of its parent and its layout will not be ambiguous. The intrinsic content size plus the location combine for a fully specified placement.
When you change a view’s intrinsic contents, call invalidateIntrinsicContentSize to let Auto Layout know to recalculate at its next layout pass.