如何在 SwiftUI 中开发定制 MapKit 功能

介绍

在上一篇文章中，咱们探讨了 SwiftUI 中新的 MapKit API 的基础知识。现在，让咱们深化 MapKit API 的定制点，以便根据咱们的需求定制地图呈现。

地图款式

新的 MapKit API 引入了 mapStyle 视图修饰符，使咱们能够自界说地图上呈现的数据款式。

struct ContentView: View {
    var body: some View {
        Map {
            // ...
        }
        .mapStyle(.imagery(elevation: .realistic))
    }
}

在上面的示例中，咱们运用了 mapStyle 视图修饰符，并运用了 imagery 款式和逼真的高程。imagery 款式的高程参数的另一个选项是 flat。

imagery-map

SwiftUI 为咱们供给了一套预界说且可装备的地图款式。在前面的示例中，咱们运用了一个称为 imagery 的款式。默许情况下，SwiftUI 结构运用规范款式。规范款式答应咱们装备地图的高程、要包含或排除的爱好点，以及是否需求显现交通信息。

struct ContentView: View {
    var body: some View {
        Map {
            // ...
        }
        .mapStyle(
            .standard(
                elevation: .flat,
                pointsOfInterest: .excluding([.store]),
                showsTraffic: false
            )
        )
    }
}

另一个选项是混合款式，答应在地图上显现影像、路途和路途称号。混合款式还装备了高程、交通和爱好点。

struct ContentView: View {
    var body: some View {
        Map {
            // ...
        }
        .mapStyle(
            .hybrid(
                elevation: .flat,
                pointsOfInterest: .including([.airport]),
                showsTraffic: true
            )
        )
    }
}

地图交互

MapKit 支持与地图的不同类型交互，包含缩放、平移、倾斜和旋转地图上的内容。默许情况下，SwiftUI 激活一切可用手势，但你能够轻松将可用交互约束为首选交互的列表。

struct ContentView: View {
    var body: some View {
        Map(interactionModes: [.pan, .pitch]) {
            // ...
        }
    }
}

地图控件

每当将 MapKit 与 SwiftUI 一起导入时，你将获得可用作地图控件的特定 SwiftUI 视图。这些视图包含 MapScaleView、MapCompass、MapPitchToggle、MapUserLocationButton 和 MapZoomStepper 视图。

struct ContentView: View {
    var body: some View {
        Map {
            // ...
        }
        .mapControls {
            MapScaleView()
            MapCompass()
        }
    }
}

你能够将这些视图与 mapControls 视图修饰符一起运用，为在 SwiftUI 视图层次结构中共享相同环境的任何地图实例指定控件。当你将 MapScaleView 或 MapCompass 视图放在 mapControls 视图修饰符内时，SwiftUI 会处理控件的放置，具体取决于运转应用的平台。

这些地图控件是简单的 SwiftUI 视图，这意味着你能够在 mapControls 视图修饰符之外的任何位置运用它们。在这种情况下，要将地图控件绑定到特定的地图实例，你应该运用 mapScope 视图修饰符。

struct MapScopeExample: View {
    @Namespace private var favoritesMap
    var body: some View {
        VStack {
            Map(scope: favoritesMap) {
                // 保藏的符号
            }
            HStack {
                MapScaleView(scope: favoritesMap)
                MapCompass(scope: favoritesMap)
            }
        }
        .mapScope(favoritesMap)
    }
}

如上例所示，咱们运用 Namespace 属性包装器生成一个地图标识符，将控件绑定到地图实例。当你需求更改自动可见性装备为始终可见或躲藏时，还能够运用 mapControlVisibility 视图修饰符。

struct MapScopeExample: View {
    @Namespace private var favoritesMap
    var body: some View {
        VStack {
            Map(scope: favoritesMap) {
                // 保藏的符号
            }
            HStack {
                MapScaleView(scope: favoritesMap)
                MapCompass(scope: favoritesMap)
                    .mapControlVisibility(.hidden)
            }
        }
        .mapScope(favoritesMap)
    }
}

总结

本文介绍了 SwiftUI 中 MapKit API 的定制功用。首要，经过 mapStyle 视图修饰符，咱们学习了如何定制地图的呈现款式，包含 imagery 款式的高程设置。其次，咱们了解了预界说和可装备的地图款式，例如 standard 款式答应装备地图的高程、感爱好点和是否显现交通信息，而 hybrid 款式则答应同时显现影像、路途和路途称号。

咱们深化了解了 SwiftUI 中 MapKit 的强壮功用，包含定制地图款式、交互方法和控件，为开发者供给了更多灵活性和可定制性的挑选。