SwiftUI Navigation - NavigationView & NavigationLink Tutorial

Поділитися
Вставка
  • Опубліковано 29 гру 2020
  • 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 navigate between screens in your SwiftUI app using NavigationView and NavigationLink. I also the the basics of passing data between views as well as some simple customizations.
    UINavigationController Tutorial Video:
    • iOS Navigation Control...
    If you like my teaching or presentation style, I've started creating my own courses:
    seanallen.teachable.com/
    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
  • Наука та технологія

КОМЕНТАРІ • 98

  • @seanallen
    @seanallen  3 роки тому +13

    If you enjoyed my teaching/presentation style, I've created a SwiftUI Fundamentals course that you can find at seanallen.teachable.com. You can watch the first ~10% for free to get a feel for it.

  • @PatrikManHora
    @PatrikManHora 2 роки тому +2

    2:36 This piece of information is what I needed. I was putting nav controllers inside each other like an idiot...

  • @pleasewait8913
    @pleasewait8913 2 роки тому

    Your all video is super good and easy to understand. It changed from state nightmare to state happymare. Thank you from the deep of my heart.

  • @larsmees4952
    @larsmees4952 11 місяців тому +1

    God, this video helped me solve an issue that I've been trying to solve for days! Thanks for the clear tutorial Sean!

  • @josstaneke5300
    @josstaneke5300 3 роки тому +1

    Great tutorial. Like the fact you show directly what you change in your code in the preview.

  • @dzmitryfedchanka1720
    @dzmitryfedchanka1720 3 роки тому +1

    Best timing as usual :3

  • @wilsonnarea5378
    @wilsonnarea5378 2 роки тому

    Thank you so much!!! Amazing teaching style.

  • @Nilely
    @Nilely 3 роки тому +1

    Your videos makes understanding swift UI concept very easy. 👍

    • @seanallen
      @seanallen  3 роки тому +1

      Glad to hear it, Nilesh!

  • @andrejkling3886
    @andrejkling3886 3 роки тому +1

    Cool lesson Sean.... Thank you for sharing

  • @QuentinVadon101
    @QuentinVadon101 3 роки тому

    Super, Super clear tutorial .. Thank you so much !

  • @StowGeneral
    @StowGeneral 3 роки тому

    Simply, Thank you! You are awesome. Liked and subscribed.

  • @dexteroreilly
    @dexteroreilly 3 роки тому +7

    Thanks Sean! Your tutorials have helped me in the development of my contact tracing app for iOS. I can code for android in my sleep, but Swift is another story since I’ve never used it. Keep up the great work!

    • @seanallen
      @seanallen  3 роки тому

      Thanks! Happy to help.

    • @Monster33336
      @Monster33336 3 роки тому

      Android is much harder in my opinion. Apple nailed it when they introduced Swift.

  • @marinab.6647
    @marinab.6647 2 місяці тому +1

    changing the color of the buttons and the offset .. is what I needed. Thank you!

  • @MonsterGames71
    @MonsterGames71 Рік тому

    a very helpful tutorial thanks Sean

  • @aymanomara8468
    @aymanomara8468 2 роки тому

    thanks your tutorials is really helpful

  • @KimbrellBrad
    @KimbrellBrad 3 роки тому +1

    Great content Sean! Thanks for a great refresher.

  • @franjomaric7913
    @franjomaric7913 2 роки тому

    Thank you man !

  • @sam2223
    @sam2223 Рік тому

    awesome tutorial

  • @clayfulgham21
    @clayfulgham21 3 роки тому +1

    This Video really cleared things up for me. Thanks

  • @ins3rt915
    @ins3rt915 5 місяців тому +2

    Thanks so much dude, this is exactly what I needed!

    • @seanallen
      @seanallen  5 місяців тому +1

      Glad I could help!

  • @LEKYSMA
    @LEKYSMA 3 роки тому

    Nice segue to the commercial at the end of the video

  • @yashumaurya4500
    @yashumaurya4500 3 роки тому

    Guru ji Pranam . Love from India

  • @rhiannondennis2075
    @rhiannondennis2075 3 роки тому

    Thank you so much!!

  • @PiccolosDaughter
    @PiccolosDaughter 2 роки тому +1

    Thank you so much for making this video.

    • @seanallen
      @seanallen  2 роки тому +1

      Glad it was helpful 👍

  • @fgpr999
    @fgpr999 2 роки тому +1

    On the point tutorial. Very useful for an Android developer like me who is currently porting his app to iOS 😁

    • @seanallen
      @seanallen  2 роки тому +1

      Glad it was helpful!

  • @nazarwelkakayew692
    @nazarwelkakayew692 2 роки тому +1

    Thanks Sean. You helped me a lot)

  • @academicsuccess5034
    @academicsuccess5034 3 роки тому

    nice work

  • @raymundoortiz7269
    @raymundoortiz7269 2 роки тому

    Nice!

  • @jenniferescobar6085
    @jenniferescobar6085 3 роки тому +1

    Nice thanks for this presentation you are awesome

    • @seanallen
      @seanallen  3 роки тому +1

      Thanks for the kind words, Jennifer!

  • @TheSteak1984
    @TheSteak1984 9 місяців тому +1

    Thank you!🙏

  • @lucarauchenberger628
    @lucarauchenberger628 2 роки тому +1

    awesome video!

  • @smow8618
    @smow8618 2 роки тому +2

    Thanks! I currently don’t have a Mac or any app,e computers for Xcode, but I’ve been using swift playgrounds and surprisingly I’ve been able to follow the entire video. But I needed to write a few lines of code for translation and whatever. Nice video though 👍

    • @seanallen
      @seanallen  2 роки тому +1

      Interesting to hear how these work on Playgrounds as I've never tried that.... Glad it was helpful!

  • @sharbel9624
    @sharbel9624 3 роки тому

    LETS GO!

  • @yazidali7071
    @yazidali7071 3 роки тому

    Amazing tutorial.....

  • @barche75
    @barche75 3 роки тому +1

    Great video, Sean. One thing can be helpful how to pop to root view.

    • @seanallen
      @seanallen  3 роки тому

      It's on my video to-do list!

  • @btechstuff
    @btechstuff 2 роки тому

    Great explanation of the navview, Sean. Can I show navlinks side by side in an hstack? So two "buttons" each goes to a diff destination

  • @user-tf9pt7yy7w
    @user-tf9pt7yy7w Рік тому

    Nice tutorial! At first, I thought Gervonta Davis retired and started programming UA-cam.

  • @polyglotmona
    @polyglotmona 8 місяців тому

    3:33 into the video and I'm really loving you. I've tried many teachers in the last few months, but your style seems to be the one I can get the most out of. Do you know how many complicated tutorials there are that not even work, and beginners just don't know why and are lost and are getting depressed. So a big: Danke 💜 thank you 💛 gracias 🧡 merci 💙 grazie 💚 спасибо ❤ for your clear explanations, because they are easy-to-follow, clearly to see and they're working :)

    • @polyglotmona
      @polyglotmona 8 місяців тому

      by the way, when I hit rename, it couldn't preview, but I figured I'd search for more "ContentView" in the code and found it: The ContentView_Previews hadn't changed to RedOneView_Previews, so I changed it manually, and wooo - the preview worked :)

    • @polyglotmona
      @polyglotmona 8 місяців тому

      and I'm actually learning, when you say "and now resume - see, there's the green three" but there's a green 2 :D

    • @seanallen
      @seanallen  8 місяців тому +1

      Glad you're enjoying my teaching style!

  • @georgehabib4333
    @georgehabib4333 Рік тому

    Thanks Sean
    @4:00 - Is there a way of determining the actual size of the Navigation Bar to exactly offset the shuffling in y? I have an image on my splash screen (that doesn't include the navigation view) that I want to line up exactly with the same image on my home view. I can manually fudge it, but I suspect the offset will change depending on device used

  • @Bharat_s
    @Bharat_s 2 роки тому

    I wish you could also tell how to make a button to go back to the first view or Home Screen. Thank btw. I was on a loop because I was using navigation view on every page. Thank a lot .

  • @parthjangid3587
    @parthjangid3587 Рік тому

    Hey Sean,
    Thanks for this amazing video. I have one silly question, correct me if I am wrong but when you click on a piece of code in the preview a border tends to appear around it. How can we get this for our project too?

  • @wenlongteo6272
    @wenlongteo6272 2 роки тому

    Good tutorial for an Android developer who started to learn ios dev as well :)
    But how about deep link? Is it included in NavigationView?

  • @boonyawatl
    @boonyawatl 3 роки тому +2

    Questions. I want to put the struct BlueTwoView in a separate file. How can I do that? I did it and it says Cannot find in scope. Thanks for your help

  • @wesleybritob
    @wesleybritob 3 роки тому +4

    Nice video !!
    Unfortunately the way they design navigation link kind of sucks. If you have 3 views and when you are in your view3 you can't go back to the view1 unless you pass the state reference from view1 to view2 and view3...

  • @Tw33tMonsta14
    @Tw33tMonsta14 3 роки тому +1

    How do we change the background color of the navigation bar title when it is .inline? I’ve tried doing UINaviationBar.appearance().backgroundColor = .red, but it only works when the bar title is large or automatic, not when it is inline.

  • @jakubkromoowski4065
    @jakubkromoowski4065 2 місяці тому

    Is there some way to pass to button view destination like a color or font size?

  • @dotnetdevni
    @dotnetdevni 2 роки тому

    .net has a good implementation called shell which creates a naivgation drawer on both ios and andriod but performace of shell is slow

  • @finalpets
    @finalpets 2 роки тому

    What about Nested NavigationView? how to return to the RootContoller?

  • @jaylensmith6308
    @jaylensmith6308 2 роки тому

    Is it necessary to have them in one view file? I have the code navigating in between different view files

  • @cyberrage8658
    @cyberrage8658 3 роки тому

    Hey sean, could you make a video on how to make a button that pops up another thing inside with more buttons, like in zoom meeting, where you press the reaction button and it pop ups another view or whatever the name is. Thanks

    • @seanallen
      @seanallen  3 роки тому +1

      I have that on my list of video ideas... it's just a VERY long list.

  • @nam.ng0
    @nam.ng0 Рік тому

    how can i make a custom back button?

  • @zenithacademy4588
    @zenithacademy4588 Рік тому

    how to navigate between branched views as we do in storyboard. because this is completely sequential.

  • @wafflestraw8631
    @wafflestraw8631 Рік тому

    My preview keeps crashing. What should I do?

  • @aganeto1
    @aganeto1 3 роки тому

    I saw when you said to remove the NavigationView from BlueTwoView , otherwise it would push things very down.
    However I need a structure like ListView -> ListView -> DetailView... Something like nested listview or sublistview.
    For example:
    ----- Shoes (main listview)
    ----- Shoes blue (secondary listview)
    --- DetailView ShoewBlue
    --- Shoes Red
    --- DetailView Shoew Red
    --- Clothes
    How can I accomplish it?
    Thx

    • @codywright7658
      @codywright7658 2 роки тому

      I would also like to know how to do this. I’ve been trying things all day.

  • @dotnetdevni
    @dotnetdevni 2 роки тому

    Swift ui falls down at navigation should have a simple navigation drawer abilitie but doenst

  • @tariqAlmazyad
    @tariqAlmazyad 3 роки тому

    Awesome tutorial . I wish you could one video where when you make ScrollView and the Large title in the navigation does not behave correctly when scrolling
    For Navigation configuration , I made my own View extension .
    here : -
    Extension: View {
    /// to modify the navBar attributes , title , bar color , and Translucent
    func navBarModifier(largeTitleColor: Color, smallTitleColor: Color,
    isTranslucent: Bool, barStyle: UIBarStyle,
    navBackgroundColor: Color, tintColor: Color,
    userInterfaceStyile: UIUserInterfaceStyle) -> some View {
    return self.onAppear{
    UINavigationBar.appearance().largeTitleTextAttributes = [.foregroundColor: largeTitleColor.uiColor()]
    UINavigationBar.appearance().titleTextAttributes = [.foregroundColor: smallTitleColor.uiColor()]
    UINavigationBar.appearance().isTranslucent = isTranslucent
    UINavigationBar.appearance().barStyle = barStyle
    UINavigationBar.appearance().backgroundColor = navBackgroundColor.uiColor()
    UINavigationBar.appearance().tintColor = tintColor.uiColor()
    UINavigationBar.appearance().overrideUserInterfaceStyle = userInterfaceStyile
    }
    }
    // HOW TO USE ?
    struct ContentView: View {
    var body: some View {
    NavigationView{
    Text("Text 123")
    .navBarModifier(largeTitleColor: .white,
    smallTitleColor: .white, isTranslucent: true,
    barStyle: .dark, navBackgroundColor: .clear,
    tintColor: .black, userInterfaceStyile: .dark)
    }
    }
    }
    }

  • @gangalo68
    @gangalo68 3 роки тому +2

    Great tutorials should use verbose code. Refactoring comes later.

  • @Devprogram
    @Devprogram 4 місяці тому +1

    Now with ios 17, i got problems with NavigationView, and now trying to see newer implementation like the Navigation Stack

    • @seanallen
      @seanallen  3 місяці тому

      I did a video all about NavigationStack here - ua-cam.com/video/oxp8Qqwr4AY/v-deo.html

  • @alcoop8729
    @alcoop8729 3 роки тому

    idk if my swift is broken but none of this wants to work

  • @neuearthmedia
    @neuearthmedia 3 роки тому

    Hi Sean, I enjoyed your tutorial on multiple navigation screens. I’m now trying to add a video player to the last screen to navigate from the second screen making to root my splash screen. How can I add that video player on the last screen and play a video stored in the cloud? Thx!

  • @stevez5134
    @stevez5134 3 роки тому

    setting the frame still throws me off. are we not wanting the button to be a lot larger on iPad???

    • @seanallen
      @seanallen  3 роки тому +2

      I hear ya. I have to draw the line somewhere when it comes to keeping the tutorial simple and focused on the task at hand. Bringing in geometry readers to a tutorial about NavigationView is too much distraction in my opinion. Trust me... people ask about EVERY aspect of the code in tutorials, even when it's not the topic being discussed. Another note is that not ALL apps are required to expand to iPad/Mac. There are tons of iPhone only apps out there.

  • @SummerCroatia
    @SummerCroatia 2 роки тому

    Two things you forgot to mention. How to navigate without previous screen stack and how to navigate with multiple stacks.

  • @jamesmartin46
    @jamesmartin46 2 місяці тому

    Is the completed source code available for this project?

    • @seanallen
      @seanallen  2 місяці тому

      Not for this project because NavigationView has been deprecated. I recommend watching my NavigationStack tutorial which was released in iOS 16 to replace NavigationView. - ua-cam.com/video/oxp8Qqwr4AY/v-deo.html

  • @HerrParabel
    @HerrParabel Рік тому

    Nice, but doesn‘t work for iPads at all.

  • @mhmtkrnlk
    @mhmtkrnlk 2 роки тому

    I love most of the things about SwiftUI but this navigation system is absolute garbage. Think you are for some reason going to
    page1 -> page 2-> page3 then on page3 u want pop to root but cant u still have to go page2 even if you dont want. Think a framework that cant load pages based on however you want.

  • @IamTheGreatCornholioo
    @IamTheGreatCornholioo 2 роки тому +1

    NavigationView / navigationLink is the only dumb crap I've seen so far in ios development, everything else is awesome, especially compared to android development

  • @ullchoenange4808
    @ullchoenange4808 3 роки тому

    Awesome 😍💋 💝💖♥️❤️

  • @erickmartins9510
    @erickmartins9510 Рік тому

    Thank you man!