Тёмный

SwiftUI List with Custom Cell & Passing Data 

Sean Allen
Подписаться 152 тыс.
Просмотров 115 тыс.
50% 1

Head to squarespace.com/seanallen to save 10% off your first purchase of a website or domain using code SEANALLEN.
In today's video I show you how to create a List with a custom cell in SwiftUI. We also create a NavigationView that allows us to navigate to a detail view while passing data. You will learn how to create a link button that navigates to safari as well as some basic refactoring. This tutorial was created in Xcode 12.4 and Swift 5.3.
Download Starter Project:
www.dropbox.com/sh/4574sr0ecb...
SF Symbols Video:
• What's New in SFSymbol...
If you like my teaching or presentation style, I've started creating my own courses:
seanallen.teachable.com/
Timestamps
What Are We Building? - 0:00
Starter Project - 0:30
Custom Cell - 2:20
List & NavigationView - 9:20
Adding The Data - 11:20
Video Detail View - 17:32
NavigationLink - 29:28
Refactor - 32:06
Twitter:
/ seanallen_dev
Link to my book - How I Became an iOS Developer:
gumroad.com/l/sean-allen-origin
Hired.com:
hired.com/x/1n01g
Check out my podcast, iOS Dev Discussions:
itunes.apple.com/us/podcast/i...
Book and learning recommendations that help out the channel if you decide to purchase (Affiliate Links):
Ray Wenderlich Books:
store.raywenderlich.com/a/208...
Ray Wenderlich Videos:
store.raywenderlich.com/a/208...
Paul Hudson's Hacking With Swift:
gumroad.com/a/762098803
Learn Advanced Swift Here:
gumroad.com/a/656585843
Links to my iOS Dev Setup & iOS Dev Book Recommendations
www.amazon.com/shop/seanallen
#swift #softwaredeveloper #iosdeveloper

Наука

Опубликовано:

 

4 июл 2024

Поделиться:

Ссылка:

Скачать:

Готовим ссылку...

Добавить в:

Мой плейлист
Посмотреть позже
Комментарии : 182   
@seanallen
@seanallen 3 года назад
If you enjoy my teaching/presentation style, I've started creating my own iOS developer courses at seanallen.teachable.com. You can watch the first ~10% of each one for free to get a feel for them.
@noamif
@noamif 3 года назад
These swiftUI tutorials are FIRE ☄️
@seanallen
@seanallen 3 года назад
Glad you enjoy them, Noam!
@tibettenballs4962
@tibettenballs4962 2 года назад
@@seanallen i enjoy them more tho..
@RevanthMatha
@RevanthMatha Год назад
Another commenter posted "Don't know if this is only my problem, but I needed to add the line .listStyle(.plain) after the List and embed the Image and VStack in a HStack. Otherwise, it looks a bit messy." I had the same issue and the above fixed it for me. So verified :)
@bi0hazardd144
@bi0hazardd144 Год назад
had exact same issues, really helped thanks
@karljay7473
@karljay7473 2 года назад
@9:40 if your version doesn't have the Text views to the right of the Image view, then wrap the Image view and VStack in an HStack. Seems Sean is using a different version, I'm on Xcode 13 Beta 5 and the Text views were below the Image view. Wrapping them in an HStack, solved the problem. Seems the older version had an implied HStack.
@aa.fordays
@aa.fordays 2 года назад
I came looking for this exact comment! You're a legend!
@brandoneckcarr
@brandoneckcarr 2 года назад
I notice that this version of Xcode/iOS 15 aren't pushing the lists to the edge of the screen anymore. Is there any way to correct this and make it full width?
@KimbrellBrad
@KimbrellBrad 3 года назад
As always, great content Sean! You have definitely been one of about 5-6 RU-vidrs that have helped me become a "real developer" in Swift. Still lots to learn, but starting to realize that I know so much more than I did when I started last July. But I love your teaching style so much that I will definitely be a customer for your new course coming out next week! One tip..when you are extracting that Subview you can rename it right there rather than going back and doing so. It's easy to forget...I do it all the time...but easy to see someone else doing it LOL! (I know you are focused on delivering the best explanation while recording! I don't have that excuse...)
@rdtba21qw
@rdtba21qw 2 года назад
As always, so good Sean. I often come back to your videos and rewatch them before building out a particular feature. Super clear and concise with some great tips. Much better than wading through my own ill written notes on the subject ;-) Thank you!
@seanallen
@seanallen 2 года назад
Thanks for the kind words, Robin. I always recommend repeat viewing of content. At least in my experience, going through a tutorial, blog post, or video only once isn't quite enough for the concepts to sink in. I usually have to go through the content, try to implement it myself, then rewatch the content for it to really sink in.
@TheSpiralnotizblock
@TheSpiralnotizblock 2 года назад
Don't know if this is only my problem, but I needed to add the line .listStyle(.plain) after the List and embed the Image and VStack in a HStack. Otherwise, it looks a bit messy.
@artak9439
@artak9439 Год назад
In 32:50 he puts all in HStack
@TheAlpha6echo
@TheAlpha6echo 10 месяцев назад
This helped me. thank you
@AZMerf
@AZMerf 3 года назад
You are just so good. I was just wondering at 21:00 how you remember all these different modifiers and you literally just answered the question. Good to hear there isn’t any real magic to it other than experience.
@tmaharisoa
@tmaharisoa 11 месяцев назад
You are so gifted Sean! what a blessing to watch your content!
@seanallen
@seanallen 11 месяцев назад
Wow, thank you!
@karhoshe
@karhoshe 3 года назад
WoW, can't believe SwiftUI can build this so easily. Thanks for the tutorial, learn so much from it.👍🏻
@seanallen
@seanallen 3 года назад
Happy to hep, Karho 👍
@rahmansajid4280
@rahmansajid4280 2 года назад
This is the first time watching your tutorials - after watching few minutes and how you explain everything - subscribed your channel immediately.
@seanallen
@seanallen 2 года назад
Glad you enjoy my teaching style, Rahman!
@martinmaulhardt9852
@martinmaulhardt9852 2 года назад
Already said this in other video but again, you are the master of iOS programming Sean. Thanks for the tutorial!
@seanallen
@seanallen 2 года назад
Thanks for the kind words, Martin.
@osmanresatdogrul1244
@osmanresatdogrul1244 2 года назад
Besides being a tutorial it is really helpful to choose topics that can adapt to your own application, thank you very much.
@renatomauro6300
@renatomauro6300 2 года назад
Without doubt, the best Swift tutorial!! Congrats!
@applefarm3740
@applefarm3740 3 года назад
Thanks for making these AMAZING SwiftUI tutorials. It's really easy to understand and just open Xcode and follow you and increase my skills.
@seanallen
@seanallen 3 года назад
Happy to hear you enjoy them, Ernest. More on the way!
@GeeElle
@GeeElle 3 года назад
Great clean presentation again, Sean! Good stuff!
@seanallen
@seanallen 3 года назад
Glad you liked it, Gee!
@krishk550
@krishk550 2 месяца назад
You made it so easy sean! Thank you so much for your content. 🎉
@clayfulgham21
@clayfulgham21 4 месяца назад
This is easily the best video I've found discussing SwiftUI data passing...THANK YOU
@seanallen
@seanallen 4 месяца назад
Wow, thank you. Glad you enjoyed it.
@umerfarooq3121
@umerfarooq3121 3 года назад
Seriously bro your tutorial force me to subscribe. You explained every single line step by step. Love you content. Want to see more. Thank you ;)
@seanallen
@seanallen 3 года назад
Happy to hear you appreciate my teaching style and I appreciate the subscribe 👍
@Omeir34
@Omeir34 3 года назад
Always excited to see your videos, Sean!
@seanallen
@seanallen 3 года назад
Glad you like them!
@daftstuff6406
@daftstuff6406 Год назад
Thank you , Sean. Really nice presentation for a beginner SwiftUI coder. Great help.
@KrastyoKrastev
@KrastyoKrastev 3 года назад
I like your style of teaching! It is great!
@seanallen
@seanallen 3 года назад
Happy to hear that, Krastyo!
@andrevdw747
@andrevdw747 2 года назад
Thanks Sean, very helpful. By the way moving a block or line, you can also use cmd-option [ or ] for up and down.
@mikeparsons84
@mikeparsons84 Год назад
This is just what I’ve been looking for, code worked great, however I needed to add in a HStack below the list otherwise it would just create two list entries per item
@jamesvanderbilt201
@jamesvanderbilt201 Год назад
thanks for posting this..i was wondering why mine looked different.
@chandlerzuck6396
@chandlerzuck6396 2 года назад
This is one of the best SwiftUI walk-throughs I’ve ever seen. This was so so so helpful. If possible, could you do a follow up video discussing an API data binding?? Like through Airtable?
@christoskatsenos13
@christoskatsenos13 3 года назад
Great video! Thank you for this detailed explanation. I am always looking forward for your videos.
@seanallen
@seanallen 3 года назад
Glad you enjoy them, Christos!
@Mikey19846
@Mikey19846 2 года назад
I really like the way you refactor your code. It looks really tidy. thank you for the tutorial.
@seanallen
@seanallen 2 года назад
Thanks for the compliment Michael. Code readability and organization is a big deal to me. Happy you noticed!
@johnzender533
@johnzender533 4 месяца назад
your videos are amazing! I'm a beginner and learning quickly thanks to your content! Thank you!
@seanallen
@seanallen 4 месяца назад
Happy to hear that!
@birdman4274
@birdman4274 2 года назад
Brilliant video Sean. SwiftUI is much easier than Storyboard and UIKit. Big thumbs up 👍
@souldock
@souldock Год назад
You've got me. Now I have to watch all of your vids :)
@seanallen
@seanallen Год назад
Enjoy 😀
@razrbhr8888
@razrbhr8888 3 года назад
Really enjoyed it followed the entire tutorial and worked awesome thank you again for your great content
@seanallen
@seanallen 3 года назад
Glad to hear you enjoyed it, Kemley.
@NTuneLabs
@NTuneLabs 2 года назад
Man, this was a GREAT tutorial and I appreciate it. Would love to see one to create an sign-able invoice.
@judy8821
@judy8821 3 года назад
Wonderful clear explanation. Never knew about Link. Very easy to follow your videos.
@seanallen
@seanallen 3 года назад
Glad you enjoy them, Judy 😀. Link was just added in iOS 14.
@iBroi
@iBroi Год назад
Very informative, educational, learning by your learning skills, way is outstanding, explaination is nowhere to find, thanks, please keep it up with progress, all best!
@seanallen
@seanallen Год назад
Thanks for the kind words, Ibrahim. Glad you enjoyed it!
@Vlad-fv6yq
@Vlad-fv6yq 3 месяца назад
Thank you so much. You explain perfectly. Definitely love your manner 😊
@seanallen
@seanallen 3 месяца назад
Glad you appreciate my teaching style!
@odduser1634
@odduser1634 Год назад
Amazing content, learned multiple concepts all in one video.
@evennorthug2585
@evennorthug2585 Год назад
Highly relevant. Well paced. Keep I up!
@enot5575
@enot5575 2 года назад
Wow! This tutorial is super easy! Thanx a lot!
@sureshkutagulla4526
@sureshkutagulla4526 2 года назад
Nice Explanation, Clear understand Thanks Sean Allen
@Lowlightapp
@Lowlightapp 9 месяцев назад
Definitely earned my sub. Awesome video man.
@seanallen
@seanallen 9 месяцев назад
Happy to help, Nate.
@kdtechniquesofficial6153
@kdtechniquesofficial6153 3 года назад
Bro, When I'm watching your videos, it makes me feel you're like a neighbor next door where I want to go and spend time and start my first startup with...
@AbbeyOnAtkins
@AbbeyOnAtkins 2 года назад
“That can lead to clever & confusing code. You still want it to be readable” yes. Thank you!
@tylerstevensx
@tylerstevensx Год назад
Appreciate your videos brotha 🤙
@ajmalrasheed9113
@ajmalrasheed9113 2 года назад
Thankyou Sean, It was very detailed explanation.
@dumbobg
@dumbobg 3 года назад
Hi Sean, just starting out with SwiftUI and I find your videos EXTREMELY helpful! Thanks very much for this! One question: How do I add a color to my data? I'd like to include a custom color to each item on my list. Edit: Nevermind, figured it out :)
@humancyyborg
@humancyyborg 3 года назад
Thanks for the tutorial. This was super helpful
@seungwanwee2107
@seungwanwee2107 2 года назад
Thanks a lot, was able to modify this project and use it for my school project :)
@seanallen
@seanallen 2 года назад
happy to help, Seungwan!
@zb1123
@zb1123 3 года назад
Great video - thanks a lot Sean! Perfect timing, just been tasked with creating a Widget for our app w/ WidgetKit and that's all in SwiftUI, shall include a little List in it too! Cheers:D
@seanallen
@seanallen 3 года назад
Nice. I have some widget videos on my to-do list. I'm waiting till after WWDC to see if they introduce anything new to widgets.
@zb1123
@zb1123 3 года назад
@@seanallen Awesome - shall keep a close eye out for those then!
@GidzPaul
@GidzPaul 2 года назад
Coming from an Android world, I loved this tutorial!
@AndyJMacLeod
@AndyJMacLeod Год назад
Very helpful video, thanks!
@johannespettersen
@johannespettersen Год назад
I finally learned coding because of you, THANK YOU!!🎉
@seanallen
@seanallen Год назад
That's awesome! Happy to hear that and best of luck on your coding journey, Johannes 🚀
@johannespettersen
@johannespettersen Год назад
Thank you!!😁
@gamebazar6453
@gamebazar6453 3 месяца назад
Omg this is the best tutorial rly, thanks!
@seanallen
@seanallen 3 месяца назад
Glad it helped!
@chrispy104k
@chrispy104k 3 года назад
Nice and neat Sean. Thanks man.
@abdouett3676
@abdouett3676 3 года назад
Thank you for this awesome work!
@seanallen
@seanallen 3 года назад
Glad you enjoyed it 👍
@tarunreddy3599
@tarunreddy3599 2 года назад
Great video as always. I was wondering how you would structure the data in firebase if you want to be able to send users friend requests and only if they accept, they are then added to the follower list? Thank you!
@georgehabib4333
@georgehabib4333 Год назад
Excellent tutorial - Thanks Sean. Quick newbie question - is there a way to switch to another view (say "VideoDetailView") through the action of a button press?
@Dygear
@Dygear 2 года назад
This convinced me. I'm going to get your teachable courses.
@seanallen
@seanallen 2 года назад
Happy to answer any questions about the courses if you have any. Hope you enjoy 🚀
@Dygear
@Dygear 2 года назад
@@seanallen None right now but I appreciate it. Wanted to let you know the skills I learn in that will immediately go into an app that will be dispatching emergency service vehicles to assignments (Ambulances & Helicopters). I run a company that builds dispatching software (mostly written in rust) and this is intended to be the Mobile Data Terminal front end for that.
@seanallen
@seanallen 2 года назад
Awesome. Would love to check out the finished product when the time comes.
@aliDevJourney
@aliDevJourney Год назад
What a beneficial video, thanks Sean!
@seanallen
@seanallen Год назад
Glad you enjoyed it!
@BlackThreadDev
@BlackThreadDev 2 года назад
Great job. Thanks!
@frost3239
@frost3239 2 года назад
Hey Sean! Love the tutorial man. Any chance you think all this would be possible with UIKit as well? Cuz I'm trynna have more control on the design side and not too familiar with swift as a language.
@christiansimbarashe
@christiansimbarashe 2 года назад
always so helpful. Thank you
@tiojoe_
@tiojoe_ 3 года назад
Awesome tutorial! Well done
@seanallen
@seanallen 3 года назад
Thanks, Pose!
@ekkogaming5461
@ekkogaming5461 2 года назад
Thanks for the tutorial, really useful.
@seanallen
@seanallen 2 года назад
Happy to help!
@hiroshihorie392
@hiroshihorie392 2 года назад
love this content! thanks!
@nigelgee3576
@nigelgee3576 3 года назад
Nice one. Just a couple In the VideoDetailView I would of put the two modifiers on the HStack. And in the VideoCell do not need the HStack as the View is in the list (unless you put in its own file with a Preview which you could put An HStack in that)
@melvenko
@melvenko 3 года назад
Thanks for this Sean
@seanallen
@seanallen 3 года назад
No problem, Melven. More to come!
@bitsurfer0101
@bitsurfer0101 2 года назад
If you wanted the text in the VideoListView to line with the top and bottom of the image, would you just add a spacer in between the two in the VStack?
@jimfinlaw2519
@jimfinlaw2519 2 года назад
Hi Sean, This works great, Just want to adapt this app so constraints look full on ipad version. Can you route me to tutorial on how to do that?
@MegaSalv0
@MegaSalv0 3 года назад
Great video as always! SwiftUI works like magic until it doesn't... As soon as one wants to do some customization, it seems it lacks the necessary tools... SwiftUI is for sure the future of iOS development, but it is not the present. Compared to UIKit, it looks a bit more than a toy. Easy and fun to use, but for serious stuff, the good old UIKit is still on top. Regardless, keep up with the great work!
@seanallen
@seanallen 3 года назад
Agreed... it's still early. Hopefully we get a nice upgrade in a couple weeks at WWDC. But it's clearly the future and I'm excited for it.
@Wiintb
@Wiintb 2 года назад
You are a good instructor.
@seanallen
@seanallen 2 года назад
Thanks for the kind words :)
@Wiintb
@Wiintb 2 года назад
I wanted to get your bundle. 26 years, CTO. Started as a assembler OS programmer. Want to learn iOS for fun. Do you do any QnA for the purchases? DM or mails? Thank you
@seanallen
@seanallen 2 года назад
Happy to answer any questions you have about the courses! You can DM me on twitter @seanallen_dev or you can find my email in the About section of my RU-vid channel.
@10-minutemathtutor37
@10-minutemathtutor37 2 года назад
Thanks a lot for the great tutorial. I made a list like this and am struggling to add a search function to it. I have been trying to use “searchable”. Any tips?
@mavinsao9919
@mavinsao9919 2 года назад
I really really like your video.
@vamsi3877
@vamsi3877 3 года назад
Great explanation 👏
@seanallen
@seanallen 3 года назад
Thanks Vamsi!
@edgargranados-perez9889
@edgargranados-perez9889 3 года назад
Who else gets excited for the refactoring bc I sure as hell do! Also the swift are the shit!!!!
@senapathirajesh3126
@senapathirajesh3126 2 года назад
sean can you please tell me how to delete the right arrow in the list when we add a navigation link to a list
@samha1513
@samha1513 3 года назад
Love your vids
@seanallen
@seanallen 3 года назад
Thanks Sam 😀
@gabrielrml
@gabrielrml 2 года назад
Sean, this is clear, uncomplicated and great, thank you. Can I ask? Is there any chance you could amend this lesson by showing how you would put a searchbar in the solution too?
@chezchezchezchez
@chezchezchezchez 7 месяцев назад
Hello! Did you happen to find out? I’d like to know also, thank you!
@DavidNitzscheBell
@DavidNitzscheBell 3 года назад
This is such a great video! Thank you so much!!! One little comment....24:15 you could just put the font and foregroundColor on the HStack, right? instead of repeating?
@seanallen
@seanallen 3 года назад
Yup. This would be an optimization.
@Denzilkwabi
@Denzilkwabi Год назад
Amazing video! I was wondering in your video list.. is it possible to have Videos with different "let"'s? Ie one video will not have a title and another will.. hope I am making sense?
@Hush4Me1
@Hush4Me1 2 года назад
Is there a way to remove the cell indicator and separator lines?
@elmcapp6032
@elmcapp6032 2 года назад
Great video. Could you do an update video showing how to do this from an api call instead of json file
@Adventurevictoria
@Adventurevictoria 2 года назад
just wondering are there any performance issues for the Navigation link under the List? you know that all the resources under the navigation link will be initiated right away .
@TygruletZ
@TygruletZ 2 года назад
Amazing tutorial ! So less code compared with UIKit ! The only problem is when I rotate the device and I try to click on another cell...will stop working. Do you guys know what can be the fix for this issue ? Because will be very helpful for everybody.
@bhavithagottimukkula2859
@bhavithagottimukkula2859 2 года назад
How to change the list row background color when selected and persist the state of the list row when user logout and login
@joeallen6x
@joeallen6x 3 месяца назад
Does this work the same with Navigation Stack???
@bronwynpotgieter7405
@bronwynpotgieter7405 Год назад
When you place the link in, should it be in a sting? If I'm not passing it in through data that I already have? In my case, I just want a button that goes to a gitHub repo
@antonioteixeira1779
@antonioteixeira1779 3 года назад
Muito bom, obrigado!
@zinwinhtet9919
@zinwinhtet9919 10 месяцев назад
Very nice content, Sir. In my case, my list line only go half. It only show under VStack. When I comment VStack, it become full line again.
@GoeHybrid
@GoeHybrid 3 года назад
Now how do you pull to refresh that list?
@bitsurfer0101
@bitsurfer0101 2 года назад
How could you make the image that you're showing a placeholder image until the user selects an image from the Photo Library?
@crafter89
@crafter89 2 года назад
Can the emulator run a whole iOS Operating system? I'm asking because you werde able to switch to safari.
@nileshjdarji
@nileshjdarji 3 года назад
Is List in SwiftUI same as TableView in UIKit? Sorry I have bought your SwiftUI course but haven't started yet due to illness.
@seanallen
@seanallen 3 года назад
Yes, List in SwiftUI is a TableView
@StuartZiane
@StuartZiane 2 года назад
Hi Sean, thanks very much for this great tutorial. In my app as I'm following along, the background is grey, with the list having cells with white backgrounds. How can I make the entire screen have a white background (in light mode)? I seem to be having a lot of trouble finding a way to do this. Thanks very much!
@seanallen
@seanallen 2 года назад
You can add a the .listStyle modifier onto the List and give it a style of .plain (in iOS 15).
@StuartZiane
@StuartZiane 2 года назад
@@seanallen Excellent! Thank you!
@TheDirection.
@TheDirection. 3 года назад
Great
@nguyentuan8289
@nguyentuan8289 2 года назад
Very good (y)
@zhenniu2451
@zhenniu2451 2 года назад
mismatch between the code and ui? how is it's laying out the hstack when you have no container for hstack?
@Darknessfell92
@Darknessfell92 Год назад
in 9:51 when I clicked on embed in list, the text moved under the thumbnail, I did everything step by step with but got this result, can you please tell me what have I missed?
@abdoulayefall9278
@abdoulayefall9278 11 месяцев назад
add the line .listStyle(.plain) after the List and embed the Image and VStack in a HStack. (taken from another comment)
@w0mblemania
@w0mblemania 3 года назад
Sean, I'm sure it's been asked before, but how are you doing those super-classy iPhone mockup animations/videos? Are you using rotato.app?
@seanallen
@seanallen 3 года назад
Yup. That’s exactly it.
@w0mblemania
@w0mblemania 3 года назад
@@seanallen Cheers.
@jamesvanderbilt201
@jamesvanderbilt201 Год назад
Please do a tutorial on how to import an existing project, because nothing I do is working. I receive the error “failed to build the scheme …”
@patoroohara8528
@patoroohara8528 Год назад
after embedding the Hstack into List, the text is turned back to vertical orientation... how can I fix it?
@sarahstice4095
@sarahstice4095 Год назад
I have the same issue an haven't been able to get the fix yet. Were you able to figure it out?
Далее
Как выходим с тройняшками 🙃
00:17
How to Get User Location on a Map - Swift
26:11
Просмотров 61 тыс.
Data Flow in a SwiftUI App
33:15
Просмотров 52 тыс.
Create a List of Todo items in SwiftUI | Todo List #1
20:53
Your App Will Get Rejected | New Privacy Rules - 2024
11:26
Hyundai Is Putting Tesla To Shame...What Happened?
11:26
YOTAPHONE 2 - СПУСТЯ 10 ЛЕТ
15:13
Просмотров 165 тыс.