iOS9: UIDatePicker with datePickerMode of UIDatePickerModeTime only shows Hours, and no Minutes

Question

I\'m using Xcode beta 7 with the iOS9 simulator. Using a UIDatePicker with a datePickerMode of UIDatePickerModeTime only shows Hours, and not minutes.

See screenshot:

Answer 1

@LordParsley solution did the trick.

Just some additional details:

I notice it occurs on iPhone 5 series and not on iPhone 6/6 plus with leading and trailing constraints. Apparently the bug only appears when its frame width is 320. Probably its a miscalculation of picker subviews that causes the overlaps. This is quite funny because Apple is the one who set the default value and yet they've oversaw the issue.

Anyways I hope this gets resolved with iOS 9.1 which is now in beta.

Answer 2

I have same issue when running my app in iOS 9, my app using UIDatePicker in .xib file. I resolved this problem by add it in code behind:

UIDatePicker* picker = [[UIDatePicker alloc] initWithFrame:CGRectMake(0, 44, 320, 162)];
[self.view addSubview:picker];

I think, this's problem with new font San Francisco (the font is big than Helvetica) and .xib file. Hope this help. Thank!

Answer 3

Found a useful description of this problem in the iOS 9 release notes - seems I should be reading these more carefully.

UIPickerView and UIDatePicker are now resizable and adaptive—previously, these views would enforce a default size even if you attempted to resize them. These views also now default to a width of 320 points on all devices, instead of to the device width on iPhone. Interfaces that rely on the old enforcement of the default size will likely look wrong when compiled for iOS 9. Any problems encountered can be resolved by fully constraining or sizing picker views to the desired size instead of relying on implicit behavior.

iOS 9 Release Notes

In my case all I had to do was remove all constraints on the UIDatePicker and then "Reset to Suggested Constraints". Rebuild and now all is well.

Answer 4

I encountered this after the public release of iOS 9.0 with a UIDatePicker using UIDatePickerModeDate in my tableview.

I hacked around it by changing the UIDatePicker mode right before it was displayed, and then changing it back to the desired one:

[myDatePicker setDatePickerMode:UIDatePickerModeDateAndTime];
[myDatePicker setDatePickerMode:UIDatePickerModeDate];

I'm guessing redrawing it solves the issue. For interest's sake I don't think it's actually an issue of not displaying the minutes but rather a bug in the subviews because this is what mine looked like:

Inspecting using FLEX, this is part of the UIDatePicker that has a solid white background.

Answer 5

I had an issue when upgrading Xcode to 7.0.

When the UIDatePicker was displayed the middle portion was blank, as per LordParsley's answer.

The height of the UIDatePicker for iOS 9 is 216; whereas earlier versions the height is 162, and forcing the height to 162 resolved the issue.

Since my view is defined within a storyboard, I setup a height constraint on the UIDatePicker and set the height to 162 for iOS versions < 9.0, within the view's viewDidLoad.

- (void) viewDidLoad {
    [super viewDidLoad];

    if ([[[UIDevice currentDevice] systemVersion] floatValue] < 9.0) {
        //
        // NOTE: iOS 9, or Xcode 7, now sets UIDatePicker height at 216; whereas,
        // iOS 8, or Xcode 6.x, set it at 162.
        //
        // If the height is left at 216, then on iOS 7.1, the middle portion of the
        // UIDatePicker control is missing.  Setting the hieght to 162 fixes the issue
        // within this application.
        //
        // UIDatePicker frame cannot be used to adjust the size, therefore use a
        // height contraint to change the size.
        //
        self.dateHeightConstraint.constant = 162;
    }
}

Answer 6

On iPhone 5S iOS 9.1 my month names are truncated when I display the UIDatePicker. I fixed this problem by setting a local property as follows:

NSLocale *uk = [[NSLocale alloc] initWithLocaleIdentifier:@"en_US"];
NSCalendar *cal = [NSCalendar currentCalendar];
[cal setLocale:uk];
[_backdateDatePicker setCalendar:cal];