SwiftUI Custom Path Drawing - Map Balloon Shape

This video is a free preview from the Custom Map Annotation section in my intermediate SwiftUI course, Dub Dub Grub. I explain how to draw the custom shape using Path in Swift. We start with a basic square to show you how drawing a path works, and then we introduce curves and control points to draw our custom map pin shape.

If you've enjoyed this video and want to learn more, here's a 15% off promo code for the full course:

In the full course we build a singular product over 81+ videos and cover a wide variety of topics including SwiftUI, CloudKit, MapKit and more. You can watch the short overview video and the first section as a free preview here:

Timestamps:
0:00 - Intro
0:30 - Create MapBalloon File
1:06 - SwiftUI Shape Overview
2:16 - Basics of Drawing: Square Example
7:41 - Advanced Drawing YouTube Channel
8:14 - Drawing our MapBalloon
8:54 - Design Tool Visual Explanation of Curves & Control Points
10:53 - Code: Draw MapBalloon Shape with Curves
13:25 - Path Fills The Container: Adjustments

Link to my book - How I Became an iOS Developer:

My Twitter:

My Podcast - iOS Dev Discussions:

Book and learning recommendations that help out the channel if you decide to purchase (Affiliate Links):

Paul Hudson's Hacking With Swift:

Donny Wals - Combine:

Mark Moeyken’s SwiftUI Books:

Ray Wenderlich Books:

Links to my iOS Dev Setup & iOS Dev Book Recommendations

#swift #softwaredeveloper #iosdeveloper

[seanallen]

Interested in Dub Dub Grub? Use code SHAPE at checkout to get 15% off the price. seanallen.teachable.com. You can watch the first few videos of the course to get a feel for it as a free preview.

[anashassnn]

Best explanation on this! really understood this now, Thanks Sean!

[Patrick]

I've been away from Swift (and coding) for a couple of years. These videos are re-igniting my interest, thanks!

[Connor-pjtg]

Damn daily uploads. Is it Christmas already? XD Thanks for the tutorial Sean

[NLBAMF]

great explanation .. always quality videos ... thank you Sean ...

[elman]

I really like the way you explain!! thanks Sean.

[yellowhero]

That's amazing and useful ! Thank you so much!!!

[FabricioMTL]

Hey Sean do you have video that explain how to build resizable dynamic textfield in SwiftUI

[Notkdenben]

Sean (and/or community) I’m pulling my hair out over this issue and I feel like the answer might be simple; but I was playing with this method of creating custom shapes but I haven’t been able to figure out if these custom shapes can support the .onTapGesture modifier.

My initial assumption was that since it confirms to the Shape protocol, that it would be one of SwiftUIs niceties in that it’s supported, but I tried something simple like .onTapGesture { foregroundColor = .red } however tapping doesn’t do anything. So I tried swapping it out for a print statement that would let me know if touch was being made and registered, but I got nothing. I tried the same with a simpel rectangle and it registers touch and I was able to get the foreground color to update to a new color.

Any help? Something I’m missing? I tried looking at the definition of the rectangle to see how it’s working behind the scenes; but those definitions are really hard to digest for me and I can’t find an answer.

[Hamza-xckb]

Question: Why use shapes when we can create very light weight PNGs in Figma and import it in Xcode?

[lichbrn]

Looking at the speed of your previews... What hardware do you use for development? My mbp pro 2018 is ridiculously slow at that stuff tbh

[sami]

Very understandable explanation. Thanks!

I recently tried drawing an arc and added a child view in the custom arc shape. What I found out was that it’s difficult to make the child to take it’s parents shape.

What if you try to make the image in the map pin to take the annotation’s shape? Have you tried it?