iOS开发之地图

在iOS开发中，地图也是不少App都须要使用的功能。本文主要对iOS中的地图知识点进行介绍。须要说明的是地图看似很复杂，其实它仅仅是一个控件，就和UIButton、UITableView等同样。本文代码环境为：Xcode 10.2。

1、理论知识

• 地图既然是控件，就能够在StoryBoard和代码中使用

• 地图上若是想要显示用户的位置，必须与定位配合，那么就须要建立定位管理器、设置权限等，能够参考iOS开发之定位，同时须要设置地图的属性（代码设置也能够）以下图

  

2、准备工做

1. 拖拽一个地图到控制器View中

   

2. 拖拽IBOutlet
3. 声明CLLocationManager
4. 声明权限
5. 设置gpx数据

3、地图基本使用

• 实现功能：显示地图，而且显示用户所在的位置，点击用户的位置，显示一个气泡展现用户的位置信息
• 代码

@interface ViewController ()<MKMapViewDelegate>

//地图 不少属性都在SB中配置了
@property (weak, nonatomic) IBOutlet MKMapView *map;

@property (strong, nonatomic) CLLocationManager *manager;

@end

@implementation ViewController

- (void)viewDidLoad {
    [super viewDidLoad];
    
    [self showUserInfo];
    
}


// 若是想显示用户的位置 只须要下面三行代码
-(void)showUser{
    
    _manager = [[CLLocationManager alloc]init];
    
    [_manager requestAlwaysAuthorization];
    
    _map.userTrackingMode = MKUserTrackingModeFollowWithHeading;
    
}


// 改变用户蓝点点击后的气泡信息
-(void)showUserInfo{
    
    _map.delegate = self;
    
    [self showUser];
    
}


//经过代理改变userLocation的标题实现更改信息
- (void)mapView:(MKMapView *)mapView didUpdateUserLocation:(MKUserLocation *)userLocation{
    
   
    CLLocation *location =  userLocation.location;
    
    CLGeocoder *geocoder = [[CLGeocoder alloc]init];
    
    [geocoder reverseGeocodeLocation:location completionHandler:^(NSArray<CLPlacemark *> * _Nullable placemarks, NSError * _Nullable error) {
        
        CLPlacemark *mark = placemarks.firstObject;
        
        userLocation.title = mark.locality;
        
        userLocation.subtitle = mark.thoroughfare;
  
    }];
}
@end
复制代码

• 效果

  

4、地图缩放级别

• 实现功能：在以前功能的基础上实现地图的任意视角（“缩放级别”）
• 代码

@interface ViewController ()<MKMapViewDelegate>

@property(nonatomic, strong) CLLocationManager *manager;

@property (weak, nonatomic) IBOutlet MKMapView *map;

@end

@implementation ViewController


- (void)viewDidLoad {
    [super viewDidLoad];
   
    _manager = [[CLLocationManager alloc]init];
    
    [_manager requestAlwaysAuthorization];
    
    _map.showsUserLocation = YES;
    
    _map.delegate = self;
}

//如何经过定位到的位置 设置地图的“缩放级别”?
//经过设置地图的MKCoordinateRegion达到
-(void)mapView:(MKMapView *)mapView didUpdateUserLocation:(MKUserLocation *)userLocation{
    
    CLLocation *location = userLocation.location;
    
    //设置地图显示的“区域”
    
    //跨度，经过这个精细控制显示的地图视角
    MKCoordinateSpan span = MKCoordinateSpanMake(0.003, 0.003);
    
    //区域
    MKCoordinateRegion region = MKCoordinateRegionMake(location.coordinate, span);
    
    //让地图显示设置的区域
    [_map setRegion:region];
    
}

@end
复制代码

• 效果

  

5、添加标注

• 功能：点击屏幕，能够添加标注
• 说明：添加标注分三步
  • 建立标注模型
  • 重写地图的代理方法，返回标注的样式
  • 将标注添加到地图
• 代码
  • 标注模型

@interface MyAnnotation : NSObject <MKAnnotation>
/**
 *  大头针的位置
 */
@property (nonatomic, assign) CLLocationCoordinate2D coordinate;
/**
 *  主标题
 */
@property (nonatomic,  copy, nullable) NSString *title;
/**
 *  副标题
 */
@property (nonatomic,  copy, nullable) NSString *subtitle;
- (void)setCoordinate:(CLLocationCoordinate2D)newCoordinate;

@end
复制代码

• 控制器

@interface ViewController ()<CLLocationManagerDelegate, MKMapViewDelegate>

@property(nonatomic, strong) CLLocationManager *manager;

@property (weak, nonatomic) IBOutlet MKMapView *map;

@end

@implementation ViewController


- (void)viewDidLoad {
    [super viewDidLoad];
    
    _manager = [[CLLocationManager alloc]init];
    
    [_manager requestAlwaysAuthorization];
    
    _map.showsUserLocation = YES;
    
    _map.delegate = self;
}


//点击地图的任一位置 均可以插入一个标注，标注的标题和副标题显示的是具体位置
-(void)touchesBegan:(NSSet<UITouch *> *)touches withEvent:(UIEvent *)event{
    
    
    //点击屏幕产生的坐标如何与地图的经纬度进行转换？
    
    //1.获取点击的坐标
    CGPoint touchPoint = [touches.anyObject locationInView:self.map];
    
    //2.将点击的坐标转换成经纬度
    CLLocationCoordinate2D coordinate =  [self.map convertPoint:touchPoint toCoordinateFromView:self.map];

    //3.添加标注
    MyAnnotation *annotation = [[MyAnnotation alloc]init];
    
    annotation.coordinate = coordinate;

    [self.map addAnnotation:annotation];
}


-(MKAnnotationView *)mapView:(MKMapView *)mapView viewForAnnotation:(id<MKAnnotation>)annotation{
    
    
    //判断是否是用户的数据模型 让用户位置的标注不同
    if ([annotation isKindOfClass:[MKUserLocation class]]) {
        
       return  nil;
    }
    
    //1.从重用池取
    MKMarkerAnnotationView *annotationView = (MKMarkerAnnotationView *)[mapView dequeueReusableAnnotationViewWithIdentifier:@"abc"];
    
    //2.没有的时候建立
    if(annotationView == nil) {
        
        annotationView = [[MKMarkerAnnotationView alloc]initWithAnnotation:annotation reuseIdentifier:@"abc"];
        
    }
    
    return  annotationView;
}


-(void)mapView:(MKMapView *)mapView didUpdateUserLocation:(MKUserLocation *)userLocation{
    
    CLLocation *location = userLocation.location;
    
    //设置地图显示的“区域”
    
    //跨度
    MKCoordinateSpan span = MKCoordinateSpanMake(0.013, 0.013);
    
    //区域
    MKCoordinateRegion region = MKCoordinateRegionMake(location.coordinate, span);
    
    //让地图显示设置的区域
    [_map setRegion:region];
    
}

@end
复制代码

• 效果

  

6、添加自定义标注

• 实现功能：在前面的基础上，自定义标注的样式
• 代码：只须要更改上面的代理方法便可

-(MKAnnotationView *)mapView:(MKMapView *)mapView viewForAnnotation:(id<MKAnnotation>)annotation{
    
    //判断是否是用户的数据模型 让用户位置的标注不同
    if ([annotation isKindOfClass:[MKUserLocation class]]) {
        
        return  nil;
    }
    
    //1.从重用池取MKAnnotationView
    MKAnnotationView *annotationView = [mapView dequeueReusableAnnotationViewWithIdentifier:@"abc"];
    
    //2.没有的时候建立
    if(annotationView == nil) {
        
        annotationView = [[MKAnnotationView alloc]initWithAnnotation:annotation reuseIdentifier:@"abc"];
        
    }
     
    //设置标注的图片
    int i =  arc4random() % 11;
    
    NSString *imgName = [NSString stringWithFormat:@"icon_map_cateid_%d", i];
    
    annotationView.image = [UIImage imageNamed:imgName];
    
    //左边视图
    annotationView.leftCalloutAccessoryView = [[UIImageView alloc]initWithImage:[UIImage imageNamed:@"left"]];
    
    //右边视图
    annotationView.rightCalloutAccessoryView = [[UIImageView alloc]initWithImage:[UIImage imageNamed:@"right"]];
    
    annotationView.canShowCallout = YES;

    return  annotationView;
}
复制代码

• 效果

7、案例代码

GitHub地址