NavigationSplitView in iOS 16
Вставка
- Опубліковано 15 лип 2024
- This is the final video in the 3 part iOS Navigation series for iOS 16. In the first two videos we focussed on the NavigationStack but in this video, we will be looking at NavigationSplitView.
We will see how we can implement 2 column and 3 column split view that will compress down to a NavigationStack type navigation when the view width is compressed like on all iPhones in Portrait mode or on some split views on an iPad.
We will see how we can control the visibility of the different views and layouts.
If you want to support my work, you can buy me a coffee :)
ko-fi.com/stewartlynch
Table of Contents:
0:00 Introduction and Overview
5:00 Two Column NavigationSplitView
20:10 Three Column NavigationSplitView
Starter Project Files:
www.createchsol.com/StarterPro...
Completed Project:
github.com/StewartLynch/Navig...
References mentioned in video:
Grid View in iOS 16
• SwiftUI Grids in iOS 16
All Videos in the iOS16 Navigation Series
Video1: Introduction to NavigationStack
• Introduction to Naviga...
Video2: Programmable NavigationStack and DeepLinks
• NavigationStack 2: Pro...
Video3: NavigationSplitView
• NavigationSplitView in...
Other References:
Stewart Lynch's UA-cam Channel:
/ stewartlynch
Stewart Lynch on Twitter:
/ stewartlynch - Наука та технологія
Excellent video Mr Lynch, noble work of educating the software dev community, THANKYOU
I absolutely agree with you!
Stewart, I really enjoy your videos. I am 80 and retired 15 years ago. At the end of my career, I worked on router software for cisco, mostly doing automated development testing using tcl in routing policy. I also did work measuring routing scalability for various cisco products. I have been enjoying keeping my hands dirty by developing my programming skills using Xcode and hoping for a great app idea! I started programming in the 60s on an IBM 1620, assembly and Fortran II. I enjoyed working on Multics mainframe computers for the middle of my career before I got involved in the Internet and routing architecture. I have seen quite an advancement in hardware and software in my time. Now I have a Multics emulator running on my Raspberry Pi, where it's original hardware would fill up a 40' x 40' room.
Gray power is alive and well. Welcome aboard David. Glad you are enjoying my channel
I am just catching up to the whole complexity of this new Navigation API. Navigation Views were so much easier to understand as a beginner. But really appreciate this evolution. So going through older projects and updating the Navigation is a little bit more complex than I thought. These videos by yourself have been a life saver. You can see how you are teaching from an educators perspective rather than a business perspective which makes this so much more refined and detailed. Thanks again Sir
This was a HUGE help for me. Thanks.
A great series on navigation in iOS 16.
Great improvements, especially when developing for different devices.
Excellent series... Very helpful
Thank you for your very clear explanations and a great video.
Thank you, this is very thorough and your explanations are really clear and easy to follow!!
Thanks!
Thank you Stewart for good lessons…. ✨ special thanks for teaching in real small project. That’s very helpful… 💫💯
Thank you!
Nice! Great example! I use a splitview in my UIKit app and was waiting for something like this for my conversion to SwiftUI. The 2 column layout is exactly what I need. Also the views must be adaptive and I want to be able to link back to the list from the detail view as well. This is a great starter point!
great job man..
Brilliant series! This is such a game changer for design. Thanks for another great series!
Thanks Mark
Excellent tutorial, THANKS.
Glad you are enjoying them
Great tutorials. Stewart, your teaching style is crystal clear and concise. Could we have one in detail on how to implement global routing in iOS 16 App?
I believe Mohammad Azam has a video on that topic
Excellent Stewart! Although it works in the Simulator, the Preview crashes when you follow these steps: 1. Click on a few employees. 2. Do a search with "A" and click on an employee. 3. Refine the search with "Ab" and click on one of the three employees - X Preview Crashed. Sometimes it crashes when you skip step 2. This applies to my code as well as your completed project from Github. The Preview has clearly improved with v14.2, but still has a few niggles.
This is so cool, very well explained, thank you so much. I wanted to ask you, what if we want to implement going back to root when we are on iPhone. Is there a way to do it with NavigationSplitView?
Currently, I don’t believe there is a way.
Great Video, But what about every item in Sidebar open new View and every view have List and NavigationLink
so when user tap on item on list it will open details view, when user move to different sidebar item, then return to previous view
it should show details view not return to rootview
That mean Sidebar work as TabView !
I didn't find any video explain real example like this
it will awesome if you make video explain this situation
Thank you
Thanks for another very educational videos, I have heard a lot from your videos!
I have an app were I use a three column split view, but the detail view contains several lists of textfields so the user can edit the values. When I try to use the same technique as you use in your employee view, but make the employee a bindable object, I get an error. How can I use this type of spilt view with bindable values?
Send me an email (slynch@createchsol.com) and I can send you some sample code that might answer your question. There are a couple of ways that I would do this. One would be to use a NavigationLink and bind the list selection to an identifiable, hashable object
@@StewartLynch Thanks! I will send you that email 😀
What if instead of json, we're wanting nav based on core data? I'm guessing column one you hard code your nav items in a hashable case iterable enum? Then for the content column you create a list from your items var with the value being FetchedResults? But how do you go about setting your detail view for your third column? Do you just setup case statements for each column?
JSON is not used in the navigation at all here Tever. The json is only there to load the data in to the Wine objects. Those object could just as easily been CoreData entities. My real Wine Cellar app now uses CoreData as the persistence layer.
One thing I noticed, when you run the app on a iPad simulator and rotate from portrait to landscape and back again, the list view is collapsed and you have to tap the button to show it again, after which it stays that way, until you start rotating again. Anyway around that ??
Mr Lynch, On 3 column mode is there a way to control the with of the 'Content' ?, In my demo app it is half empty!!, is there any width property ?
You can apply a column width like this to the view.
ContentView()
.navigationSplitViewColumnWith(200)
Merci !
Can you please check the starter project files? They don't load for me.
You are likely using Chrome and it is not allowing downloads of zipped files. Either change your security or use Safari
I don't understand. why doesnt the collapse/toggle button show when NavigationSplitView is used? the sidebar menu occupies the whole screen and the detail page is hidden instead.
Sorry, you are going to have to give me more information here as I don’t know what you are referring to. Can you give me a timestamp in the video where this is happening?
@@StewartLynch the blue button doesnt show up, the one that when you click on it, it shows the sidebar.
@@chitgoks time stamp?
You take too long to get to the point you're trying to make which is how to use NavigationSplitView accordingly. You say it yourself "None of this is important for this video"
Then I suppose my videos are not for you. Cant win them all. Others like the way I do things but obviously you can’t please everyone. There are lots of other choices for you. I do provide chapter links in the description if you want to jump to a location.
Thanks!