Logo Questions Linux Laravel Mysql Ubuntu Git Menu
 

How to change UIPickerView height

It seems obvious that Apple doesn't particularly invite mucking with the default height of the UIPickerView, but I have found that you can achieve a change in the height of the view by taking complete control and passing a desired frame size at creation time, e.g:

smallerPicker = [[UIPickerView alloc] initWithFrame:CGRectMake(0.0, 0.0, 320.0, 120.0)];

You will discover that at various heights and widths, there are visual glitches. Obviously, these glitches would either need to be worked around somehow, or choose another size that doesn't exhibit them.


None of the above approaches work in iOS 4.0

The pickerView's height is no longer re-sizable. There is a message which gets dumped to console if you attempt to change the frame of a picker in 4.0:

-[UIPickerView setFrame:]: invalid height value 66.0 pinned to 162.0 

I ended up doing something quite radical to get the effect of a smaller picker which works in both OS 3.xx and OS 4.0. I left the picker to be whatever size the SDK decides it should be and instead made a cut-through transparent window on my background image through which the picker becomes visible. Then simply placed the picker behind (Z Order wise) my background UIImageView so that only a part of the picker is visible which is dictated by the transparent window in my background.


There are only three valid heights for UIPickerView (162.0, 180.0 and 216.0).

You can use the CGAffineTransformMakeTranslation and CGAffineTransformMakeScale functions to properly fit the picker to your convenience.

Example:

CGAffineTransform t0 = CGAffineTransformMakeTranslation (0, pickerview.bounds.size.height/2);
CGAffineTransform s0 = CGAffineTransformMakeScale       (1.0, 0.5);
CGAffineTransform t1 = CGAffineTransformMakeTranslation (0, -pickerview.bounds.size.height/2);
pickerview.transform = CGAffineTransformConcat          (t0, CGAffineTransformConcat(s0, t1));

The above code change the height of picker view to half and re-position it to the exact (Left-x1, Top-y1) position.


Try:

pickerview.transform = CGAffineTransformMakeScale(.5, 0.5);

In iOS 4.2 & 4.3 the following works:

UIDatePicker *datePicker = [[UIDatePicker alloc] init];
datePicker.frame = CGRectMake(0, 0, 320, 180);
[self addSubview:datePicker];

The following does not work:

UIDatePicker *datePicker = [[UIDatePicker alloc] initWithFrame:CGRectMake(0, 0, 320, 180)];
[self addSubview:datePicker];

I have an app that is in the app store with a 3 line date picker. I thought the height change may have been prevented because you see the text under the date picker's border, but this happens to the normal 216 height date picker too.

Which is the bug? Your guess is as good as mine.

Also there are 3 valid heights for UIDatePicker (and UIPickerView) 162.0, 180.0, and 216.0. If you set a UIPickerView height to anything else you will see the following in the console when debugging on an iOS device.

2011-09-14 10:06:56.180 DebugHarness[1717:707] -[UIPickerView setFrame:]: invalid height value 300.0 pinned to 216.0

As of iOS 9, you can freely change UIPickerView's width and height. No need to use the above mentioned transform hacks.