1. Layout Views in SwiftUI - 00:11 2. Everything is a View in SwiftUI - 01:30 3. Parent-Child Relationships in SwiftUI - 03:04 4. Pull-In & Push-Out Views in SwiftUI - 04:07 5. Change Views with Data in SwiftUI - 04:54 thanks mark :)
Hey, thanks, Alex! Yeah, it's been a long time. Starting to recover from burnout. 😃 I see you've been crushing it lately. I see your posts on LinkedIn all the time. Awesome man, you're helping so many people! It's inspirational. 😊
Hey, after a long time again I'm come back here to learn Swift UI. Before 3 years I have started my career from watching your video to learn great UI using Storyboard. Good job. Wish you all the best
Great video, Mark. Thanks for sharing! We will soon start migrating from UIKit to SwiftUI. That means I will watch this video at least another 100 times :D
3:00 Ok, views are replaced, not modified. Got it. But.....why is this important to know? That seems like an "under the hood" concern, but will it affect how we write code or anything? I'm just wondering how this information will come into play.
Yeah, it matters because it affects the order of modifiers. For example, Text have modifiers that can only apply to text views like .fontWeight. So when fontWeight is applied, it returns a View type and then you can apply other modifiers after that. And Shapes have modifiers that only apply to shapes so you have to use those first and get a View back and then other modifiers that apply to views. Adding padding is another good example of how the order matters. I should have mentioned this in the video. Good point.
@@bigmtnstudio Still not clear for me. In what sense does it affect the order of modifiers? For those three modifiers that you mentioned there is no any difference at all. They will give the same in any order: Text("hi").fontWeight(.light).font(.title).padding() Regarding .fontWeight modifier: when you apply it to Text and when you apply it to View, these are two different modifiers with the same name. First one is the extension of the Text struct, the second one is the extension of the View protocol. You could check it by yourself, just cmd+click them in your code.
@@bigmtnstudio SwiftUI thing has the possibility get changed rather than Combine. So It would be better to give some high priority to Combine. Anyway I am waiting for your Combine book. and wanna tell you that I am in love with SwiftUI animation book too.
That was a very concise explanation and much appreciated. I just started learning SwiftUI and I must say, it's a lot more fun than UIKit. Thumbs up & new subscriber.
2:55 I understand the distinction, but....is this something that one needs to be consciously aware of? I mean, what pitfalls await me if I don't understand this concept?
Hi David, yeah, it is important to know when ordering your modifiers. Order matters because some modifiers apply to and return a special type of view. For example, when working with Text: Text("David") .fontWeight(.bold) // Applies to only Text and returns Text view .foregroundColor(.green) // Applies to any View and returns a View now If you tried switching around those two modifiers then you'll get an error because fontWeight can ONLY apply to a Text view but if you apply foregroundColor first, the Text is then replaced with a View and fontWeight can't be applied to it now. Same with Shapes like Circle, Rectangle, etc. There's a modifier to apply a fill to shapes. But if you add a frame modifier to the shape first, it'll change the Shape to a View: Circle() // Is a Shape view .frame(height: 100) // Returns a View .fill(Color.green) // Error: Can only be applied to Shape views, not View You would have to switch these modifiers around to make it work. You also have the case where modifiers are all returning the same type BUT the order of what is returned from the modifiers really matters, such as this: Text("David") .padding() // Returns a view with padding all around the text .background(Color.green) // Returns a view with a green color behind the text AND the padding But if you reverse the modifiers, then you get a much different result: Text("David") .background(Color.green) // Returns a view with a green color behind JUST the text .padding() // Returns a view with padding all around the text with green color. (Green color does not expand, is still small.) Hope this helps!
Thanks Mark. U have explained this so well and in a way anyone can follow. I am really trying to learn SwiftUI but not sure what links or website to refer
Mark is an outstanding teacher. I bought several books from his website and those books have been an amazing resource for me. I highly recommend his book SWIFTUI VIEWS MASTERY.
How easy to understand the concepts this video is and I really recommend this channel to Japanese Swift developers because the teacher Mark's speaking is very clear to hear for people who learn English as 2nd language I think.
I have a free book that tells you for each view. Check out the link in the video description. But without the book, you can't tell from the documentation. This is kind of my own convention I made up to better explain SwiftUI views. The only real way to tell is to use it and see what happens.
SwiftUI is the so the blind men's elephant to programmers; you can explain everything you think you're going to need to map it from other programming languages, but you'll still only cover a description of the tail, the trunk, the legs or the body. The whole is hard (not impossible) to know, but is useful when you finally start to connect all of that knowledge together.
For the view redrawing part, wouldn’t that cause issue for transitions or add an overhead in terms of performance as each time something changes, the whole view gets redrawn?
This was very good, thank you. Q. in the last example, why is the circle vertically centered within the view, but the text label and button are pinned to the top of the screen? I would have thought that each would be stacked against each other, and centered vertically in the view? Cheers.
as he described earlier, Circle is a push out view like Rectangle and takes maximum possible space. And the radius of the Circle of the minimum value among available width and height. If you write the same code and change to landscape, you will understand it better.
@@skydevz7223 Well, put. Even though the circle shape itself isn't filling up the whole space, it's frame certainly is. If you add a circle to your screen and select it on the canvas or in code, you'll see the border of the frame highlighted and see it.
I am a flutter developer. I was wondering whether I could learn swiftUI easily If there are similarities. It seems a lot of things are common. Thanks for making this wonderful video to make learning easy for many people. I love it.
i’m at my wits end trying to figure out how to make a variation of a solar clock in swift. this might be too specific but does anybody know how to do multi-step math on an updating clock? i have it working but it has to manually refresh
Seems like those concepts are the same as flutter did. In Flutter, widgets are immutable and not updated directly. Instead, you have to manipulate the widget’s state.
#5 Change views with DATA.....so when I change the value, it redraws the entire screen......that seems..... expensive. weren't we always told that drawing on the screen is expensive and so UIKit (back in the day) optimized the drawing? I assume that SwiftUI also optimizes that, right?
Hi Mark, When testing my apps on my iPhone X or any other device the time and battery icon doesn't not show, do you know the reason? Still using Storyboard. Thanks!
I'm not quite sure offhand. But that is called the "status bar" so maybe do some searches around that. Maybe you accidentally turned it off? Check out this link: www.tutorialspoint.com/how-to-hide-the-status-bar-in-a-ios-app-using-swift
I don't usually comment much, but this video is one of the best videos I´ve seen for understanding the UI system for beginners! Thanks a lot!
You’re welcome!
1. Layout Views in SwiftUI - 00:11
2. Everything is a View in SwiftUI - 01:30
3. Parent-Child Relationships in SwiftUI - 03:04
4. Pull-In & Push-Out Views in SwiftUI - 04:07
5. Change Views with Data in SwiftUI - 04:54
thanks mark :)
You're welcome, Biswajit! 😃
Good to see you back Mark!
Hey, thanks, Alex! Yeah, it's been a long time. Starting to recover from burnout. 😃 I see you've been crushing it lately. I see your posts on LinkedIn all the time. Awesome man, you're helping so many people! It's inspirational. 😊
Thanks for coming back! Your content is always great, clean and fun
Well, thank you so much, Mr. Crespo! 😃
This is awesome man! thanks!
Thanks, Rizal!
Great video mark. Really liked it
Thanks, Sunny! Glad you liked it.
This is what so many 'SwiftUI for beginners' tutorials need. Thanks for elaborating on this unfortunately named concept ^^ Great video, subscribed!
Thank you!
Ive watched countless tutorials and this is by far the best and most helpful!! Thank you Mark
Thank you Mark, you're explaination were soooooo usefull!!!!!!
You're very welcome! 😃
A green screen AND a beard??? Haha, I kid. Great video Mark. Welcome back!
As you can see I emulate my role models. 😃Dude, I need to work on that green screen. I'm not digging it. Or most likely I'm doing it wrong.
simple and clear
Thanks, Hui!
glad to see big mountain is still making great videos
Thanks!
Useful video, thanks
Thanks, Geoff!
Great video, love the new intro!
Thanks, Caleb, it was fun getting back into the TH-cam recording chair once more.
Thanks 😊
You're welcome! 😊
Yess you're back, my favorite TH-cam educator.
Ha ha, yes!
Thank you so much 🙏🏽 this is so helpful. Makes it much easier to navigate the logic when coding.
Awesome video simple but effective
Thank you!
Amazing video! Came at the perfect time! Thank you so much
You're welcome! Glad you liked it. 😃
You are a great teacher, I was very confused but these 5 points just cleared all my confusions. Thank you so much.
Oh good! I'm glad to hear that. 😃
Good to see a new video from you! As far as SwiftUI goes, I leave it alone for now and let it mature...
Sounds good. We'll see what Apple delivers to us in a few weeks at WWDC. I'm hoping for some big improvements!
I love these 5 SwiftUI concepts Mark! 👍Thank you!
You're welcome, Robert!
Hey, after a long time again I'm come back here to learn Swift UI.
Before 3 years I have started my career from watching your video to learn great UI using Storyboard.
Good job.
Wish you all the best
Great video, Mark. Thanks for sharing! We will soon start migrating from UIKit to SwiftUI. That means I will watch this video at least another 100 times :D
Ha ha, sounds good! It's a fun journey for sure.
Awesome and concise points on swiftUI. Well done!
Thanks, Emiko!
World class intro. Best I’ve seen. Thanks for your content. It is excellent!
Thanks, John! I decided to kick it up a notch and had someone create it for me.
Thank you
You're welcome!
Thanks
You're welcome, FC!
Great one!
Thanks, Ashraful! (Does anyone ever call you "Ash"? That's a cool name. 😃)
3:00 Ok, views are replaced, not modified. Got it. But.....why is this important to know? That seems like an "under the hood" concern, but will it affect how we write code or anything? I'm just wondering how this information will come into play.
Yeah, it matters because it affects the order of modifiers. For example, Text have modifiers that can only apply to text views like .fontWeight. So when fontWeight is applied, it returns a View type and then you can apply other modifiers after that. And Shapes have modifiers that only apply to shapes so you have to use those first and get a View back and then other modifiers that apply to views. Adding padding is another good example of how the order matters. I should have mentioned this in the video. Good point.
@@bigmtnstudio Still not clear for me. In what sense does it affect the order of modifiers? For those three modifiers that you mentioned there is no any difference at all. They will give the same in any order: Text("hi").fontWeight(.light).font(.title).padding()
Regarding .fontWeight modifier: when you apply it to Text and when you apply it to View, these are two different modifiers with the same name. First one is the extension of the Text struct, the second one is the extension of the View protocol. You could check it by yourself, just cmd+click them in your code.
Thank you :)
You're welcome! 👍
Nice little video, perfect for beginners like me. Thank you, Mark.
This was really beneficial, I really enjoyed it thanks!
You're welcome!
have a like! well-earned sir
Thanks, Jeff!
very important highlights, you understand the importance of these as you learn more about swiftUI
Thank you so much! 😊
wow this is really helpful, thank you mark
You're welcome, Kelvin! 👍
this explanation is so nice sir
Oh good, I’m glad to hear it. 😃
Absolutely essential for all SwiftUI beginners. Great, Thank you
Thanks, Robert!
A great video, Mark. As always. 👍🏼
Glad you enjoyed it, Marlon! 👍
I found this to be very helpful! Thank you!
need a Combine framework book too ...please
Hey Heshan, I actually started one but it's kind of a lower priority for me right now because I'm building a SwiftUI Views course right now.
@@bigmtnstudio SwiftUI thing has the possibility get changed rather than Combine. So It would be better to give some high priority to Combine. Anyway I am waiting for your Combine book. and wanna tell you that I am in love with SwiftUI animation book too.
@@heshanyodagama8886, I'm so happy to hear that!
Very helpful! Thanks for the video
You're welcome! 👍
That was a very concise explanation and much appreciated. I just started learning SwiftUI and I must say, it's a lot more fun than UIKit. Thumbs up & new subscriber.
Amazing stuff as usual. We missed your laughing while teaching videos!!
Ha ha ha, thanks, Fede!
2:55 I understand the distinction, but....is this something that one needs to be consciously aware of? I mean, what pitfalls await me if I don't understand this concept?
Hi David, yeah, it is important to know when ordering your modifiers. Order matters because some modifiers apply to and return a special type of view. For example, when working with Text:
Text("David")
.fontWeight(.bold) // Applies to only Text and returns Text view
.foregroundColor(.green) // Applies to any View and returns a View now
If you tried switching around those two modifiers then you'll get an error because fontWeight can ONLY apply to a Text view but if you apply foregroundColor first, the Text is then replaced with a View and fontWeight can't be applied to it now.
Same with Shapes like Circle, Rectangle, etc. There's a modifier to apply a fill to shapes. But if you add a frame modifier to the shape first, it'll change the Shape to a View:
Circle() // Is a Shape view
.frame(height: 100) // Returns a View
.fill(Color.green) // Error: Can only be applied to Shape views, not View
You would have to switch these modifiers around to make it work.
You also have the case where modifiers are all returning the same type BUT the order of what is returned from the modifiers really matters, such as this:
Text("David")
.padding() // Returns a view with padding all around the text
.background(Color.green) // Returns a view with a green color behind the text AND the padding
But if you reverse the modifiers, then you get a much different result:
Text("David")
.background(Color.green) // Returns a view with a green color behind JUST the text
.padding() // Returns a view with padding all around the text with green color. (Green color does not expand, is still small.)
Hope this helps!
@@bigmtnstudio Yes, that definitely helps! Thanks, Mark.
Thanks Mark. U have explained this so well and in a way anyone can follow. I am really trying to learn SwiftUI but not sure what links or website to refer
Thanks Coach!
You're welcome, Kenneth!
Great stuff! Loving the beard!
Thanks, Thomas!
Very nice, thank you!
You're welcome, Denis!
Mark is an outstanding teacher. I bought several books from his website and those books have been an amazing resource for me. I highly recommend his book SWIFTUI VIEWS MASTERY.
Thanks so much, William! I'm really glad you like my content and books. 😃
Awesome intro to SwiftUI, thanks! :-)
(Also, happy to be the 100th like on this vid...) ;-)
Looking forward to more great content. :-)
Thanks for liking the video, Craig. I've got more planned so stay tuned. 😃
This was incredibly useful for me as a beginner. I had no idea about Swift UI as I’ve been using UIKit to learn Swift exclusively. Thanks for the vid!
I'm so glad it helped! Have fun with SwiftUI. 😀
How easy to understand the concepts this video is and I really recommend this channel to Japanese Swift developers because the teacher Mark's speaking is very clear to hear for people who learn English as 2nd language I think.
I'm so glad it's easy to understand! Thank you. 👍
Nice, Keep posting👍
Thanks, Pavan!
Very useful, thank you!
looks great!
I’m starting to learn this. Thank you, sir.
that was nice , thank you!
My pleasure, Deniz! 😃
really helpfull. Thank you so much
Very nice video Thanks! About pull in views, push out views, could you tell us how to tell the view if it is a pull-in type or a push-out type?
I have a free book that tells you for each view. Check out the link in the video description. But without the book, you can't tell from the documentation. This is kind of my own convention I made up to better explain SwiftUI views. The only real way to tell is to use it and see what happens.
Learned more in this video than 3hrs on coursera, canceling that subscription now lol! Great job!
Ha ha, glad to hear it!
SwiftUI is the so the blind men's elephant to programmers; you can explain everything you think you're going to need to map it from other programming languages, but you'll still only cover a description of the tail, the trunk, the legs or the body. The whole is hard (not impossible) to know, but is useful when you finally start to connect all of that knowledge together.
Awesome! Fast
Thanks, Ada!
For the view redrawing part, wouldn’t that cause issue for transitions or add an overhead in terms of performance as each time something changes, the whole view gets redrawn?
From what I understand, the scope of redrawing is limited as much as possible to what is changing.
Can't wait to go all in on SwiftUI after WWDC.
Oh man, you're going to love it. But at times you might hate it. But then you'll love it all over again! 😂
Mark Moeykens For me that constant change from pure joy to total frustration is exactly what programming is all about and what keeps me motivated. 🔥
Missed learnings from you these many days Mark.
Thanks, Reddy, it's good to be producing videos again. 😃
Mark Moeykens Please make video on futures and promises. Your style of teaching is making me watch every video of yours 😍
This was very good, thank you.
Q. in the last example, why is the circle vertically centered within the view, but the text label and button are pinned to the top of the screen? I would have thought that each would be stacked against each other, and centered vertically in the view? Cheers.
as he described earlier, Circle is a push out view like Rectangle and takes maximum possible space. And the radius of the Circle of the minimum value among available width and height.
If you write the same code and change to landscape, you will understand it better.
@@skydevz7223 Well, put. Even though the circle shape itself isn't filling up the whole space, it's frame certainly is. If you add a circle to your screen and select it on the canvas or in code, you'll see the border of the frame highlighted and see it.
I was watching TH-cam ads as a thanks for your video 😂
Ha ha ha, well, thank Nodirbek. 😂
Now you have to draw and animate a beard in SwiftUI !!!
Ha ha ha, I should be getting rid of it probably sometime this summer. We'll see how much more the wife can tolerate it. 😉
I am a flutter developer. I was wondering whether I could learn swiftUI easily If there are similarities. It seems a lot of things are common. Thanks for making this wonderful video to make learning easy for many people. I love it.
i’m at my wits end trying to figure out how to make a variation of a solar clock in swift. this might be too specific but does anybody know how to do multi-step math on an updating clock? i have it working but it has to manually refresh
I'm not sure if this will help but toward the bottom of this article, he talks about making a clock: swiftui-lab.com/swiftui-animations-part1/
wow
Why do you need SwiftUI over storyboard and autolayout?
Seems like those concepts are the same as flutter did. In Flutter, widgets are immutable and not updated directly. Instead, you have to manipulate the widget’s state.
That's pretty cool. I bet SwiftUI borrowed a lot of things from Flutter.
#5 Change views with DATA.....so when I change the value, it redraws the entire screen......that seems..... expensive. weren't we always told that drawing on the screen is expensive and so UIKit (back in the day) optimized the drawing? I assume that SwiftUI also optimizes that, right?
Hi Mark, When testing my apps on my iPhone X or any other device the time and battery icon doesn't not show, do you know the reason? Still using Storyboard.
Thanks!
I'm not quite sure offhand. But that is called the "status bar" so maybe do some searches around that. Maybe you accidentally turned it off? Check out this link: www.tutorialspoint.com/how-to-hide-the-status-bar-in-a-ios-app-using-swift
LazyvStack
I know, right! No longer only 3 ways to lay things out... Dang it, new video needed now. 😃
Very helpful, I'm sorry I can't like it twice
Ha ha, thank you so much!
Children inherit from parents to override them. It's called - life.
LOL. Yes! Ha ha ha.
Finally, iOS Development feels like JavaScript
Ha ha, there you go!
@@bigmtnstudio my nightmare is rn erghh
ayyy Mark this is great. Can you check my latest swiftUI vid? I have a feeling my solution is overkill for making a circle within a circle