iOS 7 UIDatePicker height inconsistency?

Question

I'm running into something weird when using UIDatePicker elements with Storyboards in iOS 7. In the Storyboard, the date picker has a fixed height of 162. In reality, however, the element takes up more space than that. So this

turns into this:

so I have to move everything below it down, guessing and eyeballing how much space the date picker will actually use. Is this a bug? Am I doing something wrong? To be clear, the date picker is totally transparent - can't figure out a way around that. The white background at the top is the main UIView, and the gray background is the background of the UITableView embedded inside the container view.

Answer 1

I can confirm that using UI(Date)Picker in storyboards has a different height (162.0) than in "reality" (216.0). Therefore you have to adjust the space to container view to fit that "real" date picker height or try to solve it using auto-layout.

Answer 2

Here is a funny trick I just found: put the UIDatePicker inside a dedicated view with a constraint of 162 points in height (add 0 point vertical constraints from top and bottom of the picker to this new superview). This seems to have the effect of forcing the picker to keep the size of 162 points.

You can add the option of clipping the subviews to be sure that the UIDatePicker will not escape from its new prison.

EDIT: after some more tests, it seems that by just adding a height constraint of 162 points to the UIDatePicker, it will keep its "IB size". And, to answer @Andrew's comment, here is what it will look like:

Answer 3

You can change the width and height by simply giving it width and height constraints. Without doing that, the UIDatePicker just acts weird, I've found.