user198725878
user198725878

Reputation: 6386

Showing an image inside map annotation

Using the code below, I'm able to show the title and subtitle, and I want to show an image inside it. Is that possible? If so, please help me out.

MKPointAnnotation *aAnnotationPoint = [[MKPointAnnotation alloc] init];

aAnnotationPoint.title = @"Virginia";

aAnnotationPoint.subtitle = @"Test of sub title";

// Add the annotationPoint to the map
[myMapView addAnnotation:aAnnotationPoint];

Upvotes: 1

Views: 10436

Answers (1)

David Rönnqvist
David Rönnqvist

Reputation: 56635

I'm assuming that you are showing the title and subtitle in the callout for the annotation (the gray box that appears when you tap on the pin, if you are using a pin). If so, the callout has two views for you to customize (leftCalloutAccessoryView and rightCalloutAccessoryView (both are set on the annotation view))

SO if you want the image to appear in the gray box above your pin when you tap on the pin you can do so by customizing the annotation view by implementing a delegate method like this:

-(MKAnnotationView*)mapView:(MKMapView*)mapView viewForAnnotation:(id<MKAnnotation>)annotation {
  // If you are showing the users location on the map you don't want to change it
  MKAnnotationView *view = nil;
  if (annotation != mapView.userLocation) {
    // This is not the users location indicator (the blue dot)
    view = [mapView dequeueReusableAnnotationViewWithIdentifier:@"myAnnotationIdentifier"];
    if (!view) {
      // Could not reuse a view ...

      // Creating a new annotation view, in this case it still looks like a pin
      view = [[[MKPinAnnotationView alloc] initWithAnnotation:annotation reuseIdentifier:@"myAnnotationIdentifier"] autorelease];
      view.canShowCallOut = YES; // So that the callout can appear

      UIImageView *myImageView = [[UIImageView alloc] initWithImage:[UIImage imageNamed:@"someName"]];
      myImageView.frame = CGRectMake(0,0,31,31); // Change the size of the image to fit the callout

      // Change this to rightCallout... to move the image to the right side
      view.leftCalloutAccessoryView = myImageView;
      [myImageView release], myImageView = nil;
    }
  }
  return view;
}

However, if all you wanted was to show a lot of images directly on the map (not in the callouts) then you could, using the same delegate method, set the "image" property of the annotation view, like this:

-(MKAnnotationView*)mapView:(MKMapView)mapView viewForAnnotation:(id<MKAnnotation>)annotation {
      // If you are showing the users location on the map you don't want to change it
      MKAnnotationView *view = nil;
      if (annotation != mapView.userLocation) {
        // This is not the users location indicator (the blue dot)
        view = [mapView dequeueReusableAnnotationViewWithIdentifier:@"myAnnotationIdentifier"];
        if (!view) {
          // Could not reuse a view ...

          // Creating a new annotation view
          view = [[[MKAnnotationView alloc] initWithAnnotation:annotation reuseIdentifier:@"myAnnotationIdentifier"] autorelease];

          // This will rescale the annotation view to fit the image
          view.image = [UIImage imageNamed:@"someName"];
        }
      }
     return view;
}

I hope that answers your question

Upvotes: 17

Related Questions