啥都不说先看效果图demo
先来说说如何自定义大头针以及点击大头针时弹出的泡泡view
一 : 自定义大头针
- 新建
CustomAnnotationView
继承自MAAnnotationView
- 添加属性
- 重写
- (id)initWithAnnotation:(id<MAAnnotation>)annotation reuseIdentifier:(NSString *)reuseIdentifier
- 重写
- (BOOL)pointInside:(CGPoint)point withEvent:(UIEvent *)event
解决泡泡view超出父控件事件响应问题 - 重写
- (void)setSelected:(BOOL)selected animated:(BOOL)animated
二 : 自定义泡泡View
- 新建自定义气泡类
CustomCalloutView
,继承UIView
。 - 在 CustomCalloutView.h 中定义数据属性,包含:图片、商户名和商户地址。(随便你怎么搞,在这里我就搞了一个xib)
- 在上面新建的CustomAnnotationView.h中定义自定义气泡属性
#import "CustomCalloutView.h"
@interface CustomAnnotationView : MAAnnotationView
@property (nonatomic, readonly) CustomCalloutView *calloutView;
@end
- 重写选中方法
- (void)setSelected:(BOOL)selected animated:(BOOL)animated
。选中时新建并添加calloutView,传入数据;非选中时删除calloutView。
- (void)setSelected:(BOOL)selected animated:(BOOL)animated
{
if (self.selected == selected)
{
return;
}
if (selected)
{
if (self.calloutView == nil)
{
/* Construct custom callout. */
self.calloutView = [CustomCalloutView calloutView];
self.calloutView.frame = CGRectMake(0, 0, kCalloutWidth, kCalloutHeight);
self.calloutView.center = CGPointMake(CGRectGetWidth(self.bounds) / 2.f + self.calloutOffset.x,
-CGRectGetHeight(self.calloutView.bounds) / 2.f + self.calloutOffset.y);
}
[self addSubview:self.calloutView];
}
else
{
[self.calloutView removeFromSuperview];
}
[super setSelected:selected animated:animated];
}
- 修改ViewController.m,在MAMapViewDelegate的回调方法mapView:viewForAnnotation中的修改annotationView的类型
#pragma mark - MAMapViewDelegate
- (MAAnnotationView *)mapView:(MAMapView *)mapView viewForAnnotation:(id<MAAnnotation>)annotation
{
if ([annotation isKindOfClass:[MAPointAnnotation class]])
{
static NSString *customReuseIndetifier = @"customReuseIndetifier";
CustomAnnotationView *annotationView = (CustomAnnotationView*)[mapView dequeueReusableAnnotationViewWithIdentifier:customReuseIndetifier];
if (annotationView == nil)
{
annotationView = [[CustomAnnotationView alloc] initWithAnnotation:annotation reuseIdentifier:customReuseIndetifier];
// must set to NO, so we can show the custom callout view.
annotationView.canShowCallout = NO;
annotationView.draggable = YES;
annotationView.calloutOffset = CGPointMake(0, -5);
}
return annotationView;
}
return nil;
}
- 用于调整泡泡view显示不全问题
- (void)mapView:(MAMapView *)mapView didSelectAnnotationView:(MAAnnotationView *)view
{
/* Adjust the map center in order to show the callout view completely. */
if ([view isKindOfClass:[CustomAnnotationView class]]) {
CustomAnnotationView *cusView = (CustomAnnotationView *)view;
CGRect frame = [cusView convertRect:cusView.calloutView.frame toView:self.mapView];
frame = UIEdgeInsetsInsetRect(frame, UIEdgeInsetsMake(kCalloutViewMargin, kCalloutViewMargin, kCalloutViewMargin, kCalloutViewMargin));
if (!CGRectContainsRect(self.mapView.frame, frame))
{
/* Calculate the offset to make the callout view show up. */
CGSize offset = [self offsetToContainRect:frame inRect:self.mapView.frame];
CGPoint theCenter = self.mapView.center;
theCenter = CGPointMake(theCenter.x - offset.width, theCenter.y - offset.height);
CLLocationCoordinate2D coordinate = [self.mapView convertPoint:theCenter toCoordinateFromView:self.mapView];
[self.mapView setCenterCoordinate:coordinate animated:YES];
}
}
}