iOS 8 MKAnnotationView rightCalloutAccessoryView misaligned

Question

I'm still pretty new to the iOS stuff in general and found a problem while testing our App for iOS 8 compatibility. In iOS 7 everything worked fine but on iOS 8 the rightCalloutAccessoryView is misaligned under certain circumstances.

First Screenshot: Correctly aligned

Second Screenshot: Wrong alignment

As you can see, the problem takes place when the InfoWindow has a long title. But this was not the case on iOS 7 and I couldn't find anything mentioning this has changed?

I tried to understand why and find a way to resolve this, but couldn't find anything yet. Is this solvable on our own or do we have to file an issue for Apple?

Any help/ideas would be highly appreciated as I'm somehow overchallenged with this problem.

Code which adds the MKAnnotationViews

- (MKAnnotationView *)viewForStation:(id<MKAnnotation>)annotation {       static NSString *stationIdentifier = @"stao";       MKAnnotationView *annotationView = [self.mapView dequeueReusableAnnotationViewWithIdentifier:stationIdentifier];       if (annotationView == nil) {           annotationView = [[MKAnnotationView alloc] initWithAnnotation:annotation           reuseIdentifier:stationIdentifier];           annotationView.image = [UIImage bundleImageNamed:PIN_IMAGE];           annotationView.canShowCallout = YES;           annotationView.rightCalloutAccessoryView = [UIButton buttonWithType:UIButtonTypeDetailDisclosure];       }       return annotationView; } 

As you may be interested, I (just now) also added this question to the iOS 8 Beta section on apple.developer.com: https://devforums.apple.com/thread/242282?tstart=0

If I get an answer either here or on apple.developer.com I will reflect it so we can find it on both sites

Answer 1

I solved this by setting the autoresizingmask to fix the vertical bug and frame.size.width for the horizontal bug

UIButton* infoButton = [UIButton buttonWithType:UIButtonTypeDetailDisclosure]; [infoButton setFrame:CGRectMake(0, 0, CGRectGetWidth(infoButton.frame)+10, CGRectGetHeight(infoButton.frame))]; [infoButton setAutoresizingMask:UIViewAutoresizingFlexibleBottomMargin|UIViewAutoresizingFlexibleTopMargin]; [annotationView setRightCalloutAccessoryView:infoButton]; 

Answer 2

Ugly as heck, but I did manage to find a workaround to this issue.

Set the accessory view height to a value equal to the callout view height. I used hard-coded values:

• for iOS 7 targets: 45.0 px
• for iOS 8 targets: 54.0 px

(You probably noticed the height of the default annotation callout view is bigger in iOS 8 than in iOS 7).

In your code, that would be:

- (MKAnnotationView *)viewForStation:(id<MKAnnotation>)annotation {   static NSString *stationIdentifier = @"stao";   MKAnnotationView *annotationView = [self.mapView dequeueReusableAnnotationViewWithIdentifier:stationIdentifier];   if (annotationView == nil) {       annotationView = [[MKAnnotationView alloc] initWithAnnotation:annotation                                                      reuseIdentifier:stationIdentifier];       annotationView.image = [UIImage bundleImageNamed:PIN_IMAGE];       annotationView.canShowCallout = YES;        UIButton *detailButton = [UIButton buttonWithType:UIButtonTypeDetailDisclosure];        // N.B. In production code, you would need a more generic way to adjust        // height values instead of hard-coding values based on NSFoundationVersionNumber...        CGFloat height = (floor(NSFoundationVersionNumber) > NSFoundationVersionNumber_iOS_7_1) ? 55.f : 45.f;        detailButton.frame = CGRectMake(0.f, 0.f, 32.f, height);       annotationView.rightCalloutAccessoryView = detailButton;   }   return annotationView; } 

Also, from what I've seen so far, if you specify both left and right accessory views, you would have to set both their heights to the same value to get proper alignment. Hopefully this issue will be fixed in subsequent iOS releases to avoid writing this kind of code...