Juliana Chahoud!@jchahoud
Juliana Chahoud
Aplicações com mapas
• Essenciais nos dispositivos móveis
• MapKit: Framework que permite trabalhar com mapas em iOS
• Alguns apps que usam o MapKit:
Quem fornece dados nos mapas da Apple?
!
• http://gspa21.ls.apple.com/html/attribution.html
• TomTom
• DigitalGlobe
• Waze
• Yelp
• Diversos outros…
Suporte para: Annotations
• Marcações no mapa
Overlays
• "Desenhar" camadas no mapa
3D e visão de satélite
• Tipos podem ser padrão, satélite ou híbridos
Rotas
• Suporta rotas por automóveis ou a pé
Buscas baseadas em mapa
• Buscas por endereços, pontos de interesse…
• Veremos como montar um app que faz busca por pontos de interesse
O que preciso para começar?
• Habilitar MapKit Framework
• Importar o framework para utilização: import MapKit
Xcode 6
Habilitando o MapKit
• Em target -> Capabilities: habilitar Maps
MKMapView
• Exibe os mapas e permite manipulação dos mesmos
Outlet e delegate
Tipos de mapa
!
!
!
• Pode ser alterado via código: !! self.mapView.mapType = MKMapType.Standard ! self.mapView.mapType = MKMapType.Satellite ! self.mapView.mapType = MKMapType.Hybrid
Elementos do Mapa
• Coordenadas: latitude e longitude de um local no mapa
!let tdcLocation:CLLocationCoordinate2D = CLLocationCoordinate2DMake(-23.600463,-46.674605)
• Região: área do mapa !self.mapView.region = MKCoordinateRegionMakeWithDistance(tdcLocation, 1000, 1000)
Mostrar localização do usuário
• Passo 1: Adicionar a chave NSLocationWhenInUseUsageDescription no plist
• Permite descrever o motivo pelo qual a localização do usuário é necessária
Mostrar localização do usuário
• Passo 2: É preciso solicitar autorização:
! self.locationManager.requestWhenInUseAuthorization()
User Location: Onde é dada a permissão
Simulando a localização do usuário
Demo: Localização do usuário e região do mapa
Annotations
• Marcações no Mapa, tipicamente feitas com:
• algum tipo de imagem (ex: pin) e
• um “callout bubble” (balão com informações)
Anotações padrão: MKPointAnnotation
• Classe que cria uma marcação padrão (pin) !let ibiraAnnotation:MKPointAnnotation = MKPointAnnotation() !ibiraAnnotation.coordinate = CLLocationCoordinate2DMake(-23.587416, -46.657634) !ibiraAnnotation.title = "Parque do Ibirapuera”
• Depois de criadas, basta adicionar anotações no mapa com o método addAnnotations
! self.mapView.addAnnotations([ibiraAnnotation])
Como adicionar annotations no mapa
Anotações customizadas
!
!
!
• Para criar uma anotação customizada é necessário basicamente seguir 3 passos… ->
Passo 1: MKAnnotation
• Criar uma classe que implemente o protocolo MKAnnotation
!!!!!class TDCAnnotation: NSObject, MKAnnotation { var coordinate: CLLocationCoordinate2D var title: String var subtitle: String ! init(coordinate: CLLocationCoordinate2D, title: String, subtitle: String) { self.coordinate = coordinate self.title = title self.subtitle = subtitle } } !
Passo 2: como representar essa nova annotation
• Definir uma nova View para representar essa nova classe de annotations no mapa (MKAnnotationView)
!!!func viewForTDCAnnotation //... !!var anView:MKAnnotationView = MKAnnotationView(annotation: annotation, reuseIdentifier: reuseIdentifier) anView.image = UIImage(named:"TDCLogo") !anView.canShowCallout = true
Passo 3: Implementar mapView: viewForAnnotation:
• Nesse método, primeiro verificar se a view já existe antes de criá-la
!!!if annotation is TDCAnnotation{ //se a view ja existir reutilize... var anView = mapView.dequeueReusableAnnotationViewWithIdentifier ! //senao... anView = self.viewForTDCAnnotation(annotation, reuseIdentifier: reuseId)
Demo: Annotation customizada
Ação de toque no “balão" (callout)
!
!
• Quando ocorre um toque no ‘callout’ é disparado o método:
!mapView:, annotationView:, calloutAccessoryControlTapped: !
• Portanto, ações no toque do callout devem ser implementadas nesse método
calloutAccessoryControlTapped
• Quando o callout do TDC for selecionado, vamos abrir o site da conferência
!!func mapView(mapView: MKMapView!, annotationView view: MKAnnotationView!, calloutAccessoryControlTapped control: UIControl!) { ! if view.annotation is TDCAnnotation { let url:NSURL = NSURL(string: “http://www.thedevelopersconference.com.br") UIApplication.sharedApplication().openURL(url) } }
Demo: Toque no callout
MKLocalSearch
• Permite encontrar pontos de interesse tomando como referência uma região geográfica (map.region). Basicamente dividido entre:
• MKLocalSearchRequest: o que deve ser buscado e em que região
• MKLocalSearchResponse: itens encontrados (MKMapItems)
MKLocalSearchRequest
!!!var request:MKLocalSearchRequest = MKLocalSearchRequest() !request.naturalLanguageQuery = “Restaurantes" !request.region = self.mapView.region
MKLocalSearchResponse
• Retorna um array com 10 itens encontrados (MKMapItem)
• MKMapItem: contem informações como nome, telefone e URL do item
• Possui uma propriedade do tipo placemark, que contem as coordenadas e endereço do item
Adicionar itens no mapa
search.startWithCompletionHandler { (response:MKLocalSearchResponse!, error:NSError!) in if !error { var placemarks:NSMutableArray = NSMutableArray() for item in response.mapItems { let place:MKPointAnnotation = MKPointAnnotation() place.coordinate = (item as MKMapItem).placemark.coordinate place.title = (item as MKMapItem).name placemarks.addObject(place) } ! self.mapView.addAnnotations(placemarks)
Demo: Busca por POIs
Gostou da idéia de POIs? Algumas outras APIs• Com limitações de uso
• https://developers.google.com/places/documentation/
• https://developer.foursquare.com/
• http://www.yelp.com/developers
• http://developer.factual.com/
http://www.factual.com/
Mais InformaçõesDocumentação
Location and Maps Programming Guide https://developer.apple.com/library/ios/documentation/UserExperience/Conceptual/LocationAwarenessPG/Introduction/Introduction.html !
Vídeos
WWDC 2013 - What’s New in Map Kit https://developer.apple.com/videos/wwdc/2013/#304 !
Sample Code https://developer.apple.com/library/ios/samplecode/MapCallouts/Introduction/Intro.html#//apple_ref/doc/uid/DTS40009746
Material da palestra
• Apresentação:
• http://www.slideshare.net/julianachahoud
!
• Projeto exemplo:
• https://github.com/jchahoud/TDC-POIs-Swift