mapview使用
Finding places, navigating our way, or simply checking what’s around — these are essential things that smartphones can help with. This year Apple added maps functionality to the SwiftUI framework. Let’s check out how we can use it and what are the current problems.
查找位置，导航或仅查看周围环境-这些都是智能手机可以帮助解决的基本问题。 今年，苹果公司将地图功能添加到了SwiftUI框架中。 让我们看看我们如何使用它以及当前存在什么问题。
I would like to point out that this covers Xcode 12 beta software and it can change in future releases.
我想指出的是，它涵盖了Xcode 12 beta软件，并且在以后的发行版中可能会发生变化。
呈现MapView (Present the MapView)
To show MapView we need to use MapKit’s structure Map that is specifically designed to use with SwiftUI. It is a view that displays an embedded map interface. We can use it to configure user-allowed interactions, show and track current location, and add annotations on the map.
为了显示MapView，我们需要使用专门为SwiftUI设计的MapKit的结构Map 。 该视图显示嵌入式地图界面。 我们可以使用它来配置用户允许的交互，显示和跟踪当前位置以及在地图上添加注释。
It comes with several initialize methods. Let’s see how to create a map specifying the map visible map region and add annotations.
它带有几种初始化方法 。 让我们看看如何创建一个指定地图可见地图区域的地图并添加注释。
The coordinate region defines the area that is visible on the map. It is a Binding that takes an MKCoordinateRegion object that is a combination of center coordinate and a coordinate span around it.
坐标区域定义了在地图上可见的区域。 它是一个采用MKCoordinateRegion对象的Binding ，该对象是中心坐标和围绕它的坐标跨度的组合。
struct MapView: View {
@State var coordinateRegion = MKCoordinateRegion(
center: CLLocationCoordinate2D(latitude: 56.948889, longitude: 24.106389),
span: MKCoordinateSpan(latitudeDelta: 0.2, longitudeDelta: 0.2))
var body: some View {
Map(coordinateRegion: $coordinateRegion)
.edgesIgnoringSafeArea(.all)
}
}Now we have a map showing the capital city of Latvia — Riga. With this init method we can specify other things like interaction capabilities, showing user location, and more.
现在，我们有了一张显示拉脱维亚首都里加的地图。 使用此init方法，我们可以指定其他功能，例如交互功能，显示用户位置等。
在地图上添加注释 (Add annotations on the map)
If we want to add annotation on the map we need to use a different initializer method that takes MKCoordinateRegion, identifiable collection of annotations and block that creates returns MapAnnotationProtocol protocol object.
如果要在地图上添加注释，则需要使用另一个初始化器方法，该方法采用MKCoordinateRegion ，可识别的注释集合和创建返回MapAnnotationProtocol协议对象的块。
Right now MapKit offers three simple annotation views:
现在，MapKit提供了三个简单的注释视图：
MapPin- pin-shaped annotationMapPin销状注释MapMarker- balloon-shaped annotationMapMarker气球状注释MapAnnoation- custom view annoationMapAnnoation自定义视图注解
The simplest way is to use the first two annotation types, in this blog post we’re going to look into MapMarker annotation type. To initalize need to pass a coordinate and optional tint color.
最简单的方法是使用前两种注释类型，在本博客中，我们将研究MapMarker注释类型。 要初始化需要传递坐标和可选的色泽。
MapMarker(coordinate: place.coordinate, tint: .green)By putting it all together, we can show couple of annoations on the map like this:
通过将所有内容放在一起，我们可以在地图上显示几个注解，如下所示：
struct MapViewWithAnnotations: View {
let veganPlacesInRiga = [
VeganFoodPlace(name: "Kozy Eats", latitude: 56.951924, longitude: 24.125584),
VeganFoodPlace(name: "Green Pumpkin", latitude: 56.967520, longitude: 24.105760),
VeganFoodPlace(name: "Terapija", latitude: 56.9539906, longitude: 24.13649290000000)
]
@State var coordinateRegion = MKCoordinateRegion(
center: CLLocationCoordinate2D(latitude: 56.948889, longitude: 24.106389),
span: MKCoordinateSpan(latitudeDelta: 0.2, longitudeDelta: 0.2))
var body: some View {
Map(coordinateRegion: $coordinateRegion,
annotationItems: veganPlacesInRiga) { place in
MapMarker(coordinate: place.coordinate, tint: .green)
}.edgesIgnoringSafeArea(.all)
}
}Let’s not forget those collection elements should conform to Identifiable - provide ID value. The easiest way is to just use the UUID like this:
别忘了那些收集元素应该符合Identifiable提供ID值。 最简单的方法是像这样使用UUID ：
struct VeganFoodPlace: Identifiable {
var id = UUID()
let name: String
let latitude: Double
let longitude: Double
var coordinate: CLLocationCoordinate2D {
CLLocationCoordinate2D(latitude: latitude, longitude: longitude)
}
}As we see that there is no way how to initialize an annotation with the title right now. For that, we need to use MapAnnoation that allows us to create custom map annotation.
如我们所见，目前尚无办法初始化带有标题的注释。 为此，我们需要使用MapAnnoation ，它允许我们创建自定义地图注释。
目前的弊端 (Current drawbacks)
Adding Map view with SwiftUI is a very straight forward task, but current implementation lacks some important components. Let’s discuss some of the drawbacks.
使用SwiftUI添加Map视图是非常简单的任务，但是当前的实现缺少一些重要的组件。 让我们讨论一些缺点。
Adding a callout view for map annotation is one of the most essential things that is lacking with the current implementation.
为地图注释添加标注视图是当前实现缺少的最重要的内容之一。
After clicking on an annotation and showing a callout usually, there is the navigation or a modal view is presented. With a custom MapAnnoation we can partially do it, but for sure it is not a great solution.
单击注解并通常显示标注后，将出现导航或模态视图。 使用自定义MapAnnoation我们可以部分完成此操作，但是可以肯定的是，这不是一个很好的解决方案。
Right now you can add only add annotations on the map. There isn’t support for polyline or other elements.
现在，您只能在地图上添加添加注释。 不支持折线或其他元素。
TL; DR (TL;DR)
Adding Map view with SwiftUI is simple. It comes with ways to add binding to the map region, specify annotation list, track user’s location, and more. Sadly with current Xcode Beta 3, it lacks features like showing titles for annotations, callout view, and SwiftUI way of navigation. Let’s hope Apple will add it in the future.
使用SwiftUI添加地图视图很简单。 它带有添加绑定到地图区域，指定注释列表，跟踪用户位置等等的方法。 不幸的是，对于当前的Xcode Beta 3，它缺乏诸如显示注释标题，标注视图和SwiftUI导航方式的功能。 我们希望苹果将来会添加它。
链接 (Links)
https://www.hackingwithswift.com/quick-start/swiftui/how-to-show-a-map-view
https://www.hackingwithswift.com/quick-start/swiftui/how-to-show-a-map-view
https://swiftwithmajid.com/2020/07/29/using-mapkit-with-swiftui/
https://swiftwithmajid.com/2020/07/29/using-mapkit-with-swiftui/
翻译自: https://medium.com/@fassko/mapview-with-swiftui-a9fbdceff93a
mapview使用
5456
被折叠的 条评论
为什么被折叠?
到【灌水乐园】发言
