Nello sviluppo di applicazioni iOS sempre più spesso ci si trova a dover inserire all’interno delle proprie app mappe geografiche utili, ad esempio, per mostrare eventuali punti d’interesse all’interno della propria app. In genere, per far ciò, si tende ad utilizzare MapKit, il framework Apple che integra tutte le funzionalità necessarie alla loro implementazione, che offre tutto ciò che occorre a garantire un’ottima esperienza d’uso, coma la navigazione tramite gesture per la gestione di pan e zoom e via dicendo.

Tra le varie funzioni offerte c’è la possibilità di inserire dei POI (definiti come MKAnnotationPin) che alla pressione mostrano un callout. Le API, però, sono piuttosto restrittive sull’uso di questi oggetti e non permettono la personalizzazione se non in qualche piccolo dettaglio, come gli accessori alla destra e alla sinistra del testo.

In molti casi, però, è necessario personalizzare il callout senza però snaturare del tutto la sua funzione. In questi casi può essere utile la classe SMCalloutView che permette di replicare un perfetto callout Apple ma con un contenuto deciso da noi.

Per utilizzarlo sarà sufficiente scaricare dalla repo ufficiale su github i file SMCalloutView.m e SMCalloutView.h ed inserirli nel nostro progetto. A questo punto si deve istanziare un oggetto SMCalloutView con il metodo +platformCalloutView. Fatto questo si dovrà implementare il metodo del delegate di MKMapView – mapView:didSelectAnnotationView: per mostrare questo callout invece di quello standard Apple:

- (void)mapView:(MKMapView *)mapView didSelectAnnotationView:(MKAnnotationView *)annotationView {
// Settaggi di base per il callout
self.calloutView.title = annotationView.annotation.title;
self.calloutView.subtitle = annotationView.annotation.subtitle;
// Ereditare l'offeset da MKAnnotationView
self.calloutView.calloutOffset = annotationView.calloutOffset;
// E infine mostrare il callout
[self.calloutView presentCalloutFromRect:annotationView.bounds inView:annotationView constrainedToView:self.view animated:YES];
}

e ricordarsi di nascondere al momento giusto il callout:

- (void)mapView:(MKMapView *)mapView didDeselectAnnotationView:(MKAnnotationView *)view {
[self.calloutView dismissCalloutAnimated:YES];
}

Questo controllo a differenza di quello ufficiale Apple permette un’ampia personalizzazione consentendo di impostare il contenuto della view con un oggetto UIView qualsiasi semplicemente settando la proprietà contentView.

Nota: nel caso in cui si volesse utilizzare alcune gesture o il semplice tap sull’oggetto, sarà necessario implementare una classe custom di MKMapKit che effettui il forward delle gesture e dei tocchi. Trovate un semplice esempio nell’ultima parte di questa classe fornita nel progetto di esempio.