SwiftUI에서 전자 나침반의 값 가져 오기

개요

iOS 앱에서 전자 나침반을 사용하고 싶기 때문에
SwiftUI에서 나침반 정보를 얻고 지도를 돌리는 것만으로 간단한 샘플을 만들어 보았다.

CoreLocation 서비스 사용을 위한 준비

앱의 info.plistInformation Property ListPrivacy - Location When In Use Usage Description추가,
"지도, 전자 나침반 정보를 얻는 데 사용합니다"
같은 적절한 문자열을 설정합니다.

소스 코드

LocationManager.swift 파일을 추가하고 북쪽으로 각도 정보(heading)를 @PublishedContentView.swift 내에서 Map(...)을 사용하여 지도를 표시하고 각도 정보(heading)를 받아 지도를 회전합니다.

LocationManager.swift

import MapKit

class LocationManager: NSObject, ObservableObject, CLLocationManagerDelegate {

    @Published var heading:CLLocationDirection = 0.0
    let manager = CLLocationManager()

    override init() {
        super.init()

        manager.delegate = self
        manager.requestWhenInUseAuthorization()

        //電子コンパス設定
        manager.headingFilter      = kCLHeadingFilterNone
        manager.headingOrientation = .portrait
        manager.startUpdatingHeading()
    }

    //電子コンパス値取得
    func locationManager(_ manager: CLLocationManager, didUpdateHeading newHeading: CLHeading) {
        self.heading = newHeading.magneticHeading
    }

}

LocationManager 클래스가 발행한 region을 꺼내 Map에서 지도를 표시하고, heading을 꺼내 rotationEffect()로 지도를 회전시킨다.

ContentView.swift

import SwiftUI
import MapKit

struct ContentView: View {

    @ObservedObject var manager = LocationManager()
    @State var region = MKCoordinateRegion()
    @State var trackingMode = MapUserTrackingMode.follow

    var body: some View {
        let heading   = $manager.heading.wrappedValue
        let latitude  = $region.center.latitude.wrappedValue
        let longitude = $region.center.longitude.wrappedValue

        VStack{
            Text("緯度：\(latitude) 経度： \(longitude)")
            Text("北方向: \(heading)")

            Map(coordinateRegion: $region,
                showsUserLocation: true,
                userTrackingMode: $trackingMode)
                .clipShape(Circle())
                .overlay(Circle().stroke(Color.white, lineWidth: 4))
                .shadow(radius: 10)
                .padding(40)
                .edgesIgnoringSafeArea(.bottom)
                .rotationEffect(Angle(degrees: -heading))
        }
    }
}

struct ContentView_Previews: PreviewProvider {
    static var previews: some View {
        ContentView()
    }
}

화면 표시

상단에 위도 경도, 북쪽 방향을 표시하고 중심으로 둥글게 자른 지도를 표시합니다.
iPhone을 움직이면 지도가 회전합니다.

감상

R03/06/04

상상 이상으로 쉽게 할 수 있었다

R03/06/10

소스 간소화