Custom Map Annotation Pins for SwiftUI MapKit Map | SwiftUI Map App #6

Yes, we could have used the default Map Pins that Apple provides us in the MapKit framework, however, those pins have a very "generic" look and feel. Instead, we will design custom map pins for this app that fit our theme much better. Since we're already customizing the look of them, we will also add some awesome animations to really bring the pins to life!

🤙 WELCOME BACK 🤙

[vladyslavsushko]

Map init deprecated:
You can use:
Map(position: $vm.mapRegion) {
ForEach(vm.locations) { location in
Annotation(location.name, coordinate: location.coordinates) {
LocationMapAnnotationView()
.scaleEffect(vm.mapLocation == location ? 1 : 0.7)
.shadow(radius: 10)
.onTapGesture {
vm.showNextLocation(location: location)
}
}
}
}

[LDLefebvre]

0:00 Making me travel to scotland with those Bagpipes

[lojonater]

Thanks for these videos!
Instead of adding a bunch of bottom padding to the annotation view to get the "arrow" pointing at the right location on the map, you can initialize the MapAnnotation with a custom anchorPoint with a value like CGPoint(x: 0.5, y: 0.9) (the default is CGPoint(x: 0.5, y: 0.5))

[andresraigoza]

So much functionality with that little code, that's so great, thank you so much

[hasanalbanna]

Legendary tutorials man. Learned a lot. I love the map pin you created as well

[sajjadsarkoobi]

Hi, Thanks a lot for your tutorials. But by using MapAnnotation Xcode shows a lot of UI bugs. -> Publishing changes from within view updates is not allowed, this will cause undefined behavior. Is there any workaround? Thanks. Xcode 14.2

[soz]

hello and thank you for your videos they are great. however I have an violet error
"Publishing changes from within view updates is not allowed, this will cause undefined behavior."
what can i do to fix it? thanks

[acecala]

Would you know how to swing the pin from left - right just like Apple Maps does?

[dofaminx]

12:05 scaleEffect animation doesn't work. How can I fix this?

[ScottSchwartz-Owen]

in iOS 18 beta, it is ignoring the map image .cornerRadius(36) completely - no effect. Also using .clipShape doesn't change the image edges. My code looks exactly the same as your Nick, any suggestions: 
Image(systemName: "map.circle.fill")
.resizable()
.scaledToFit()
.frame(width: 30, height: 30)
.font(.headline)
.foregroundStyle(.white)
.background(accentColor)
.padding(6)
.cornerRadius(36)

[Enrii]

Is possible Clustering annotations on Map?

[MathiesenMusic]

- How could all those annotation be saved? So when they go back to the app, they will always show.

- How could those annotations be deleted if they are always being saved?

- How could I get directions to that annotations, and do that by boat?

[Decatilinae]

Hello Nick... one quick thing when you add a Tab button as bottom navigation do you think I need to reduce the card frame and the span or does it do automatically?

[klmoxify]

Great video! Can someone explain how to change the map to satellite view?

[developerios]

Hello nick, as soon as you added the tappable functionality to map markers, the transition effect on the bottom cards got a weird effect.
I suppose its related to the index of that location in the array, what do you think?

[relax_music]

.transition It doesn't work ，why？ xcode 13.2.1

[magedmohmed]

Again I am enjoyed for your Explanation Nick 🤎🤎