Monday, July 4, 2011

Change The Color of the Pin Annotation in Map and make it draggable

In this post we will see how to change the Annotation color of  the Pin that we display in the map also we will learn on how to drag and drop that pin to a new location in the map.

Design Phase: For the design phase I would ask you to create a map with annotation please refer this post in case you need any help with maps.





In order to change the color of the annotation all you have to do is use a delegate method of the MKMapView that’s MKMapViewDelegate and use the following  method to display an annotation.

-   (MKAnnotationView *)mapView:(MKMapView *)mapView viewForAnnotation:(id <MKAnnotation>)annotation

so now here’s a view at the body of this function

- (MKAnnotationView *)mapView:(MKMapView *)mapView viewForAnnotation:(id<MKAnnotation>)annotation
{
           MKPinAnnotationView *pinView = (MKPinAnnotationView*)[mapView dequeueReusableAnnotationViewWithIdentifier:@"Pin"];
           if (pinView ==nil) {
           
            pinView = [[MKPinAnnotationViewalloc]initWithAnnotation:annotation reuseIdentifier:@"Pin"];
            pinView.pinColor = MKPinAnnotationColorGreen;
            pinView.animatesDrop = YES;

           } 
           return pinView;
}


Code Explanation: In the above code I have created a reference of the MKPinAnnotationView class since this class is used to configure the type of pin that we want to drop on the map.  And by looking at the code I think you should know that what I am trying to do here and that’s if the pinView is nil means if it is not in the memory then allocate memory and set the pin annotation color and animation. So now if you run your code what you will see here is your Pin drops into the map view.

Similarly you can even drag the pin annotation and drop it anywhere in the map and to do that all you need to do in the above code is to set a property called as draggable and set it to YES. Here’s the revised code


- (MKAnnotationView *)mapView:(MKMapView *)mapView viewForAnnotation:(id <MKAnnotation>)annotation

{

    MKPinAnnotationView *pinView = (MKPinAnnotationView*)[mapView dequeueReusableAnnotationViewWithIdentifier:@"Pin"];

    if (pinView ==nil) {

       

        pinView = [[MKPinAnnotationView alloc]initWithAnnotation:annotation reuseIdentifier:@"Pin"];

        pinView.pinColor = MKPinAnnotationColorGreen;

        pinView.animatesDrop = YES; 

        pinView.draggable = YES;

    }

    return pinView;

}


Also it is said in the documentation that if you are using the dragaable property then in that case you have to use a new function in the subclass of NSObject so that the annotation is set as per the new coordinates and the name of the function is given below

- (void)setCoordinate:(CLLocationCoordinate2D)newCoordinate

and heres the view at the function in the NSObject subclass file

- (void)setCoordinate:(CLLocationCoordinate2D)newCoordinate
{
     latitude = newCoordinate.latitude;
     longitude = newCoordinate.longitude;
}

where latitude and longitude are the members of double type.

Here’s a view at the final output. Run the application and see that the Pin drops this time onto the map and when you press the pin annotation then you can easily drag the pin toa new location inside the map and drop it to a new location.




You can download the source code from here.


I Hope that this post was helpful to you in making you learn how to drop the Pin with the changed color onto the map and making it drag-gable. Happy iCoding and have a great Day.

1 comment: