SlideShare une entreprise Scribd logo
1  sur  28
Map&GPS http://MobileDev.TW
iOS APP Development
Map&Location
in Swift
地圖與定位
Ryan Chung
1
MapGPS http://MobileDev.TW
大綱
• 定位
• 拿到經緯度
• 將定位轉換成地址
• 地圖應用
• 將定位位置秀在地圖上
• 地圖形態:一般、衛星、混合
• 加入自定圖標
• 區分各別自定圖標
• 客製化圖標影像
• 導航 (Apple Map)
2
MapGPS http://MobileDev.TW
定位
•  拿到自己的經緯度
3
MapGPS http://MobileDev.TW
定位
1.  點選target -- Build Phases -- Link Binary With
Libraries,加入CoreLocation.framework
2.  在需要定位的.h檔中import,並且遵
循CLLocationManagerDelegate,並加入一
個iVar,資料形態為CLLocationManager
4
MapGPS http://MobileDev.TW
定位
3.  在viewDidLoad中加入
5
MapGPS http://MobileDev.TW
定位
4.  實作didUpdateLocations方法,取得目前經緯度
6
MapGPS http://MobileDev.TW
定位
5.  修改Info.plist,設定索取地理位置出現的資訊
7
MapGPS http://MobileDev.TW
將定位轉換成地址
8
MapGPS http://MobileDev.TW
將定位轉換成地址
定位完成後,使用CLGeocoder
的reverseGeocodeLocation來進行轉換
9
MapGPS http://MobileDev.TW
將定位位置秀在地圖上
10
MapGPS http://MobileDev.TW
將定位位置秀在地圖上
1.  加入MapKit.framework
2.  import Mapkit、加入delegate、拉MapView (勾
選Shows User Location,其他視需求勾選)
11
MapGPS http://MobileDev.TW
將定位位置秀在地圖上
3.  在取得經緯度時,設定mapView的中心位置與縮
放尺寸
12
MapGPS http://MobileDev.TW
3.Lab
•  MapView有三種呈現方式,透過mapType進行設定:
•  MKMapType.Standard
•  MKMapType.Satellite
•  MKMapType.Hybrid
•  請結合Segmented Control,讓使用者可以切換地圖
呈現方式
13
MapGPS http://MobileDev.TW
加入自定圖標
14
MapGPS http://MobileDev.TW
加入自定圖標
1.  建立新檔案(OS X-Source-Swift File),繼
承NSObject,命名為MyAnnotation,遵
循MKAnnotation協定
15
MapGPS http://MobileDev.TW
加入自定圖標
2.  MyAnnotation.swift
16
MapGPS http://MobileDev.TW
加入自定圖標
3.  回到ViewController, 製作一個方法來加入多個自定
圖標
17
MapGPS http://MobileDev.TW
加入自定圖標
4.  在畫面載入後,呼叫剛才建立的加入自定圖標方法
18
MapGPS http://MobileDev.TW
區分各別自定圖標
19
MapGPS http://MobileDev.TW
區分各別自定圖標
1.  利用annotation的標題或子標題來區分
20
MapGPS http://MobileDev.TW
區分各別自定圖標
2.  利用剛才設定的reuseIdentifier來區分是哪一個圖
標被按下
21
MapGPS http://MobileDev.TW
小圖示
•  在彈出視窗中加入小圖示
22
MapGPS http://MobileDev.TW
小圖示
在viewForAnnotation方法中的MKPinAnnotationView中
設定leftCalloutAccessoryView屬性
23
MapGPS http://MobileDev.TW
客製化圖標影像
24
MapGPS http://MobileDev.TW
客製化圖標影像
直接使用MKAnnotationView
25
MapGPS http://MobileDev.TW
導航
26
MapGPS http://MobileDev.TW
從目前的位置導航到特定位置
•  設定目的地位置相關資訊,開啟Apple Map,從目前
位置導航至該位置
27
MapGPS http://MobileDev.TW
Thank you
28

Contenu connexe

Plus de Ryan Chung

Plus de Ryan Chung (20)

Voice-First Games for Alexa
Voice-First Games for AlexaVoice-First Games for Alexa
Voice-First Games for Alexa
 
AI Service Integration - Education
AI Service Integration - EducationAI Service Integration - Education
AI Service Integration - Education
 
AI Service Integration
AI Service IntegrationAI Service Integration
AI Service Integration
 
AI Adoption in the Enterprise
AI Adoption in the EnterpriseAI Adoption in the Enterprise
AI Adoption in the Enterprise
 
Intro to Dialogflow Chatbot Development
Intro to Dialogflow Chatbot DevelopmentIntro to Dialogflow Chatbot Development
Intro to Dialogflow Chatbot Development
 
AI in Classroom
AI in ClassroomAI in Classroom
AI in Classroom
 
AWS re:Invent 2018 Recap
AWS re:Invent 2018 RecapAWS re:Invent 2018 Recap
AWS re:Invent 2018 Recap
 
MovieBot
MovieBotMovieBot
MovieBot
 
Service Integration Workshop
Service Integration WorkshopService Integration Workshop
Service Integration Workshop
 
MPP AI
MPP AIMPP AI
MPP AI
 
Smart Home Intro Lab
Smart Home Intro LabSmart Home Intro Lab
Smart Home Intro Lab
 
Introduction to DialogFlow
Introduction to DialogFlow Introduction to DialogFlow
Introduction to DialogFlow
 
Conversational AI Orientation
Conversational AI OrientationConversational AI Orientation
Conversational AI Orientation
 
Udacity Meet Up - 0413
Udacity Meet Up - 0413Udacity Meet Up - 0413
Udacity Meet Up - 0413
 
Amazon Alexa Development Part II
Amazon Alexa Development Part IIAmazon Alexa Development Part II
Amazon Alexa Development Part II
 
Amazon Alexa Development
Amazon Alexa DevelopmentAmazon Alexa Development
Amazon Alexa Development
 
Microsoft Professional Program - AI
Microsoft Professional Program - AIMicrosoft Professional Program - AI
Microsoft Professional Program - AI
 
AI Service Integration
AI Service IntegrationAI Service Integration
AI Service Integration
 
Intro to AI
Intro to AIIntro to AI
Intro to AI
 
Hour of Code - Amazon Alexa
Hour of Code - Amazon AlexaHour of Code - Amazon Alexa
Hour of Code - Amazon Alexa
 

Map&Location-Swift