🔴 NEW SwiftUI Airbnb Clone | iOS 17 | Xcode 15
ฝัง
- เผยแพร่เมื่อ 5 ส.ค. 2024
- Let's build Airbnb with SwiftUI!
🔴 SwiftUI Airbnb Pro Course:
appstuff.teachable.com/p/swiftui-airbnb-pro
🔴 Become a member to access Exclusive Content & Source Code :
www.stephancodes.com/plans-pr...
🔴 Source Code:
www.stephancodes.com/product-...
🔴 Swift Fundamentals Bootcamp
• 🔴 Coding Bootcamp For ...
🔴 SwiftUI Networking Masterclass
• Swift Networking Maste...
🔴Navigation Stacks:
• This NEW SwiftUI Featu...
🔴@State vs @Binding video:
• NEVER Confuse @State v...
🖥️ ONLINE COURSES & APPS
👉 Pro Courses:
www.stephancodes.com/videos
👉 iOS App Templates:
www.stephancodes.com/shop
👉 FREE Twitter SwiftUI Course
• 🔴 Let's Build Twitter ...
Chapters
0:00 - Intro
1:32 - Project Setup
04:35 - Explore View UI
19:42 - Custom Search Bar
26:34 - Listing Detail View
49:09 - Listing Detail View Pt. 2
1:08:40 - Destination Search View
1:35:54 - Destination Search View Pt. 2
1:52:05 - Finish UI
2:08:09 - Listing Data Model
2:21:00 - Data Model Injection
2:38:47 - Listing Map View
2:46:02 - Listing Search By Region
3:07:08 - Course Wrap Up & Source Code
Social Media:
Instagram - @stephan.dowless
Instagram - @appstuffllc - วิทยาศาสตร์และเทคโนโลยี
Stephan is simply the best. He explains things in a way that makes it understandable even for a noob like me. Thanks Stephan
I watched your video in one go. I was in the flow, man, thanks for your video!
Awesome Stephan as always
the goat is back!
Great tutorial ! Got me inspired to try it out. Thank a lot ! 👍
Amazing stuff, i love your videos
Thanks for sharing! The accent color allows to change the navigation link components color without do it manually one by one!! Also, the .contentMargins is the new modifier that allows to add margins to a scrollview.
Thanks Stephan!
Simple and easy to understand.
Thanks, keep going with another video with swiftui.
next maybe integrate with some api?
I spent like an hour trying to get the stepper to work and nothing seemed to fix it until I realized that I paused the video just before you mentioned this issue lol, this video was of great help.THANK YOU
same thing happening for me for both datepicker and stepper, i've to long press.
have you found any solution?
@@ADITYARAJ-yv2tr VStack(alignment: .leading) {
if selectedOption == .dates {
Text("When's your trip?")
.font(.title2)
.fontWeight(.semibold)
VStack {
DatePicker("From", selection: $startDate, displayedComponents: .date)
Divider()
DatePicker("To", selection: $endDate, displayedComponents: .date)
}
.foregroundStyle(.gray)
.font(.subheadline)
.fontWeight(.semibold)
} else {
CollapsedPickerView(title: "When", description: "Add dates")
.contentShape(Rectangle())
.onTapGesture {
withAnimation(.snappy) { selectedOption = .dates }
}
}
}
.modifier(CollapsibleDestinationViewModifier())
.frame(height: selectedOption == .dates ? 180 : 64)
VStack(alignment: .leading) {
if selectedOption == .guests {
Text("Who's coming")
.font(.title2)
.fontWeight(.semibold)
Stepper {
Text("\(numGuests) Adults")
} onIncrement: {
numGuests += 1
} onDecrement: {
guard numGuests > 0 else {return}
numGuests -= 1
}
} else {
CollapsedPickerView(title: "Who", description: "Add guests")
.contentShape(Rectangle())
.onTapGesture {
withAnimation(.snappy) { selectedOption = .guests }
}
}
}
.modifier(CollapsibleDestinationViewModifier())
.frame(height: selectedOption == .guests ? 120 : 64)
Stephan just is a G I bet he’s super chill to hang out with
Really useful
good and clear
Greetings from Vietnam, Nice to meet you here. You are so excellent.
Great video!
Question, Does the pro version include how to calculate the total price and fetch data to the cloud database? Thank you!
Big fan of your work! Would be awesome if you could do Duolingo next time.
coming from flutter background, this tutorial helps me alot
I am a flutter dev, trying out SwiftUI. hope this helps🙌🏽🙌🏽
nice
Hi Stephan, can you please let me know, if this app is fully responsive on different devices? if not what what measurements should take into consideration.
Wooooww Cool
Its all well and good people doing good ui but for love of god hook it up to a dummy api shows us all
Yes!
It would be great to have a video to see how to implement payment method for such a marketplace, there is no video online explaining how to do it
I understand this Pro course does not include creating a listing and no booking process. Just 2 different user types right? And does any of the Pro courses includes Passkeys or Apple authentication?
Problem : Everything is so sorted with your videos like content and all, but I face one problem text is so small, if I am watching your videos in my tv or iMac text are quite small, need to focus so much. Can we do something for this?? cause zooming in zooming out TH-cam video all time it makes bit time taken each time I need to do back or forward video. :)
Hell ya
Bruhhh what an class bruhhh when we say's thanks it get lighter for this no words bruhhh.✨
What is the motivation to you share thus course to us free? I'm very glad want to know that✨.
Just trying to give back to community man! iOS development has given me a life I used to dream about. I’m trying to help others accomplish their goals and do the same :)
Great video! Quick question, at 59:47 you create an overlay. Why not go with toolbar + ToolBarItem instead?
crappy that he doesn't respond
Hello and thank you for this sharing !
In your course do you implement the search with dates ?
You are not explaining what is new on your website si I can't know and I want to be sure before buying
Hello, in case you bought it, could you tell me if the pro version includes api integration? Thanks!
@@miguel7986 No it doesn't. But he has another tutorial app called Threads. The full version on his website has api integration
I've never used swift ui, but it seems too easy 😂
did you already know that Datepicker inside of a Vstack is bugged ?
Are you Stephan Dowless in Udemy?
how can we make call recorder in ios for free there are many call recorder on appstore but they are premium how can i create one for me for free...?
hi guys did anyone found the issue of the stepper why we have to hard click to inc or dec ? its so annoying to keep hard click to inc it
btw
thx a lot Steve for the massive tutorial
Yeah it’s strange that you have to long press. I will look into a solution!
I think that the onTapGesture of the section is interfering with the buttons. I went and moved the on tap gesture to CollapsedPickerView itself instead of the VStack. That way when you're in the expanded state, the onTapGesture for that section is no longer in effect.
I also was having the same issue with the date picker and this solved that too.
@@samuelray5425 That doesnt work cause instead of being able to click in any part of the UI component instead you'll have to click on any of the text's to trigger the tapGesture which is a bad UX.
This is an iOS 17.1 bug that needs to be fixed by Apple. A more or less acceptable approach is to use an ‘if’ statement to create any of the components inside a VStack with all the modifiers. However, you will see the transition a little rough when the date component gets deselected. The same goes for the Stepper. Our TapGesture's and the Gesture's of the datepicker and Stepper get overlapped
if selectedOption == .dates {
VStack(alignment: .leading){
Text("When's your trip?")
VStack {
DatePicker("From", selection: $startDate, displayedComponents: .date)
.foregroundStyle(.white)
Divider()
DatePicker("To", selection: $endDate, displayedComponents: .date)
.foregroundStyle(.white)
}
}
.padding()
.frame(height: selectedOption == .dates ? 180 : 64)
.foregroundStyle(.white)
.background(.pink)
.clipShape(RoundedRectangle(cornerRadius: 12))
.padding()
.shadow(radius: 6)
} else {
VStack(alignment: .leading){
CollapsedPickerView(title: "When", description: "Add dates")
}
.padding()
.frame(height: selectedOption == .dates ? 180 : 64)
.foregroundStyle(.white)
.background(.pink)
.clipShape(RoundedRectangle(cornerRadius: 12))
.padding()
.shadow(radius: 6)
.onTapGesture { selectedOption = .dates }
}
Can you create a TH-cam Using SwiftUI
Could you please do it in UIKit as well
I am launching a UIKit course this month :)
It will be covering the basics of UIKit and building a crypto app as the final project
What's the architecture we've used in this app ?
MVVM
This is what a newbie would do: *proceed to describe what I would do*
Thanks for that advice though! :D
Please an Amazon clone 😂 or mercado libre, saludos desde México
date picker not opening on single click because parent stack has tap gesture. Anyone facing this issue. Kindly help me
same here
I was facing this issue, add this will help:
DatePicker("From", selection: $startDate, displayedComponents: .date)
.onTapGesture(count: 99) {}
Please also make this with React native
you gotta stop breathing into your mic it's driving me CRAZY
Once I heard myself do it, it drove me crazy too 🤣
Hello. Can you please tell me how to make an array? I have a hotel in different cities. I added [String] but now this line is complaining.
`$0.state.lowercased() == searchLocation.lowercased()`.
Value of type '[String]' has no member 'lowercased'
What should I add there ? To make it an array?
There are two cities. How do you make a different one for each hotel ?
let region = MKCoordinateRegion(
center: listing.city == "Miami" ? .miami : .losAngeles,
span: MKCoordinateSpan(
latitudeDelta: 0.1,
longitudeDelta: 0.1
)
)