How to Make a Card View in SwiftUI - Step by Step for Beginners (2023)

In this video, I will be showing you step-by-step how to create a card view in SwiftUI. We will start by setting up our project and then move on to creating the basic layout for our card. From there, we will add some styling and customizations to make our card look great.

[@androidfanatic6528]

Great video and tutorial, thank you. The "Bob Ross" of SwiftUI development. Subbed!

[@a_swiftly_tilting_planet]

😂 Thank you.

[@DailyDoseof-Health]

Thank you for the great work. Looking forward to more tutorials.

[@a_swiftly_tilting_planet]

Thank you. Hopefully I will have the next video out soon.

[@zurvey]

This is my first video I've seen from you. I liked and subscribed. BTW, thank you for starting by showing us the finished product. I wish everyone would do that; it is easier to follow a video when you know what its purpose is. Thanks for making and posting this.

[@a_swiftly_tilting_planet]

Thank you. I agree it’s nice to see the finished product before you start diving into the code.

[@PhilosoBot]

So good to see you making videos again! I wondered what happened to your old ones, I really missed them.

[@a_swiftly_tilting_planet]

Yeah, I needed to take a break for a while but now I’m working on putting together some new tutorials and Swift developer related videos.

[@MJXed]

I love the content I will use it in my next SwiftUI project, keep it up 🎉

[@a_swiftly_tilting_planet]

Glad it was helpful.

[@Nature-cl4kb]

thank you!

[@a_swiftly_tilting_planet]

No worries.

[@werderdoc8618]

Great video. Thanks very much for this. For me as a very new beginner concerning SwiftUI programming, it was a great introduction. Thanks again...

[@a_swiftly_tilting_planet]

Glad it was helpful.

[@w0mblemania]

Nice work.

[@a_swiftly_tilting_planet]

Thank you.

[@tahmidakter2034]

Very intuitive video. I am a react developer. Coming from a react background I can relate a lot of comparative thing with swiftui still I am new in swiftUi. Learned a lot of things in this video. Hope to see more of your video. Thanks 😉

[@a_swiftly_tilting_planet]

Glad to hear this was helpful. My next video coming out soon will be about integrating a searchable map view, so that should be fun. Just out of curiosity, are you learning SwiftUI for side projects or are you looking to get into mobile development as well as web development?

[@tahmidakter2034]

@@a_swiftly_tilting_planetWill be waiting for the next video. My childhood dream is to become a great developer. Since childhood, I was fascinated by the android & ios system. That time I was a kid. So, didn't know how apps work and how an app gets created. After knowing about these development path, I've learned programming all by myself and till this day, I am trying to learn how to make IOS & android app. Swiftui seems pretty fun. It would be great If you could give me some tips on roadmap.

[@a_swiftly_tilting_planet]

I’ll work on a roadmap and/or Swift resource video.

[@tahmidakter2034]

@@a_swiftly_tilting_planet I will be waiting for your video. You can consider me as your student 😀

[@QDWorld-Apps]

Fantastic video … can you please let me know how to change the background colour of the cards to dark grey or something. When I change the colour in the PersonCardView .background (Color.gray) it is not working please help

[@a_swiftly_tilting_planet]

Use a ternary operator like this. www.hackingwithswift.com/books/ios-swiftui/conditional-modifiers

[@BradCaldwellAuburn]

So let's say your List will contain a potentially endless number of CardViews (like FB or Twitter), and you don't want performance issues. I hear List is lazy at least for iPhones. So would it only load as needed for screen and a little extra if your database has say 1,000 cards available if the user scrolled far enough down, or would it load all the cards and nearly crash the app?

[@a_swiftly_tilting_planet]

I apologize for the delayed response. I will need to delve deeper into this myself. In the meantime, I came across a video directly from Apple discussing SwiftUI performance. Demystify SwiftUI performance: developer.apple.com/videos/play/wwdc2023/10160/

[@MarkDog0410]

very good video, but you need to speak louder .

[@a_swiftly_tilting_planet]

Glad you enjoyed the video. I am working on improving my audio. Just posted a new video yesterday. Let me know if the audio is better in that one.

[@MarkDog0410]

@@a_swiftly_tilting_planet that’s awesome , thanks your video to improve our skills.

[@a_swiftly_tilting_planet]

No worries. I hope to have another video out this afternoon or tomorrow.

[@محمدبنسراجالدين]

When tapping any button the whole card gets selected and all buttons get triggered..did try using the buttons? Am I doing something wrong?

[@a_swiftly_tilting_planet]

Good catch. Sorry about that. Here is the fix: PersonCardView(person: person1) .listRowSeparator(.hidden) .buttonStyle(.plain)

[@محمدبنسراجالدين]

@@a_swiftly_tilting_planet Good fix 👍. this fix solves a big problem, which is: when using the new NavigationSplitView you must have a list as the sidebar view..otherwise no pushing and popping happens when views are collapsed (ex. all iPhones in portrait)

[@maverickchan9552]

why are you wispering .... just kidding...

[@a_swiftly_tilting_planet]

Still working audio. 🤫