2015-02-24 5 views
1

Прежде всего, я использую kingpin для отображения массива аннотаций. Все работает так, как ожидалось.iOS Пользовательские аннотации для MKMapView

Мой вопрос: Как я могу создать собственное представление для аннотации? И я не имею в виду замену изображения MKPinAnnotationView.

  if (annotationView == nil) { 
      annotationView = [[MKPinAnnotationView alloc]initWithAnnotation:annotation reuseIdentifier:@"cluster"]; 
      annotationView.canShowCallout = YES; 
      annotationView.image = [UIImage imageNamed:@"map_cluster"]; 
     } 

С этим я могу заменить штифт по умолчанию на изображение. Но это еще не все, что мне нужно.

http://imgur.com/nhUIvdx

Я родом из Android фона, где я решил эту проблему путем надувания раскладки как кластер (так называемые аннотации в IOS). В этом XML-макете я помещаю контейнер (белый кадр), изображение и счетчик. Результат может пчелу виден на рисунке:

http://imgur.com/QoAQQES

Как я могу это сделать в прошивке? Заранее благодарим за любые предложения!

ответ

0

довольно поздно ответ, но я предполагаю, что другие люди будут по-прежнему будут заинтересованные

В MKAnnotationView подкласса:

Во-первых, определяют некоторые размеры:

#define ckImageHeight 65 
#define ckImageWidth 55 
#define kBorder 5 

Затем определяют аннотацию Просмотр в кадр:

self.frame = CGRectMake(0, 0, ckImageWidth, ckImageHeight); 

Если вы хотите, чтобы фон быть изображение, а не только цвет:

self.backgroundColor = [UIColor colorWithPatternImage:[UIImage imageNamed:@"map_checkin"]]; 

Затем сделать заполнитель для изображения

CGRect checkInPictureRect = CGRectMake(kBorder, kBorder, ckImageWidth - 9 , ckImageWidth - 9); 
UIView *checkInPictureView = [[UIView alloc]initWithFrame:checkInPictureRect]; 

Затем начинается забава:

// Crop image 
UIImage *croppedImage = [ImageHelper centerCropImage:image]; 

// Resize image 
CGSize checkInPictureSize = CGSizeMake(checkInPictureRect.size.width*1.5, checkInPictureRect.size.height*1.5); 
UIGraphicsBeginImageContext(checkInPictureSize); 
[croppedImage drawInRect:CGRectMake(0, 0, checkInPictureRect.size.width*1.5, checkInPictureRect.size.height*1.5)]; 
UIImage* resizedImage = UIGraphicsGetImageFromCurrentImageContext(); 
UIGraphicsEndImageContext(); 

UIImageView *imageView = [[UIImageView alloc] initWithImage:resizedImage]; 
          imageView.frame = checkInPictureView.bounds; 
          [checkInPictureView addSubview:imageView]; 
          [self addSubview:checkInPictureView]; 

// Counter 
UIView *counterView = [[UIView alloc]initWithFrame:CGRectMake(45, -2, 15, 15)]; 
counterView.opaque = YES; 
(checkIn.isNow) ? [counterView setBackgroundColor:[UIColor enloopBlue]] : [counterView setBackgroundColor:[UIColor enloopGreen]]; 
counterView.layer.cornerRadius = 8; 

self.counterLabel = [[UILabel alloc] init]; 
self.counterLabel.frame = CGRectMake(4, 2, 10, 10); 

if (self.count >= 10) { 
    counterView.frame = CGRectMake(45, -2, 18, 18); 
    self.counterLabel.frame = CGRectMake(3, 3, 12, 12); 
} 

[self.counterLabel setTextColor:[UIColor whiteColor]]; 
[self.counterLabel setFont:[UIFont fontWithName: @"Trebuchet MS" size: 11.0f]]; 
[self.counterLabel setText:[[NSString alloc] initWithFormat:@"%lu", (unsigned long)self.count]]; 
[counterView addSubview:self.counterLabel]; 
[counterView bringSubviewToFront:self.counterLabel]; 
[self addSubview:counterView]; 

Что касается centerCropImage помощника, ничего особенного:

+ (UIImage *)centerCropImage:(UIImage *)image { 
    // Use smallest side length as crop square length 
    CGFloat squareLength = MIN(image.size.width, image.size.height); 
    // Center the crop area 
    CGRect clippedRect = CGRectMake((image.size.width - squareLength)/2, (image.size.height - squareLength)/2, squareLength, squareLength); 

    CGImageRef imageRef = CGImageCreateWithImageInRect([image CGImage], clippedRect); 
    UIImage * croppedImage = [UIImage imageWithCGImage:imageRef]; 
    CGImageRelease(imageRef); 
    return croppedImage; 
} 

Я знаю, что есть довольно много вещей, чтобы улучшить, но до тех пор пока я надеюсь, что это поможет другим. :)

2

Здесь вы можете найти, как создать пользовательскую аннотацию: custom annotation for maps

Если у вас есть какие-либо вопросы, вы можете спросить меня :)

+0

Спасибо Адела за предложение, определенно помогло! –

+0

Вы приветствуете :) @ emn.mun – Adela

Смежные вопросы