iT 邦幫忙鐵人賽 Day 20: 設定一個 Callout 面板!
使用 Call out 面板取代原有的大頭針吧!
2 min readNov 3, 2018
前言:
上一次教學我們在 App 新增了一張地圖,並且使用大頭針將我們好想工作室的位子給標記了。這次教學我們會使用 MKAnnotationView 來實作一個 Callout 面板,其中有圖片、說明以及一個按鈕,如此一來這個工作室的資訊就清楚的顯示在畫面上,之後也能透過右方的按鈕進行額外的操作。
設定 Callout 面板
首先我們要讓我們 mapView
的 delegate
設為 self
,並且我們讓我們 mapView
的 ViewController 遵循 MKMapViewDelegate 協定:
mapView.delegate = self
接著我們實作 mapView(:viewFor:)
方法,並且返回我們的 Callout 面板:
接著我們在 checkDetail
方法撰寫一個顯示 ActionSheet 的方法,讓我們點選這個 Callout 面板的時候能夠執行這個方法,讓我們實際運行看看:
後記:
希望透過這次教學之後,大家學會如何客製地圖上的 MKAnnotationView,也學到如何調整地圖上的縮放跟移動效果,之後我們也會透過我們這次實作的 Callout 面板來實作更多的功能。