1 00:00:07,150 --> 00:00:12,240 Hey everybody what's going on this is Caleb with Def slopes dot com and welcome to the UI split view 2 00:00:12,250 --> 00:00:15,390 controller target topic in this Target topic. 3 00:00:15,390 --> 00:00:21,910 We're going to learn how to use a UI split view controller which is a pretty common way of creating 4 00:00:22,320 --> 00:00:28,780 master detail type applications with a table view and view controllers that load when those particular 5 00:00:28,780 --> 00:00:30,250 cells are selected. 6 00:00:30,250 --> 00:00:33,520 So for instance this is the app we're going to build called splitter. 7 00:00:33,550 --> 00:00:36,980 And I named it that because you know you guys have controller blah blah blah. 8 00:00:37,180 --> 00:00:44,470 Anyway so we have a table view here with you know a few cells and each cell is for a different image. 9 00:00:44,470 --> 00:00:49,080 Now when I click on a cell it opens up a view controller that shows that image. 10 00:00:49,090 --> 00:00:54,700 OK so I can go back and this is kind of how you would expect a table view to work with a UI navigation 11 00:00:54,700 --> 00:00:55,440 controller. 12 00:00:55,600 --> 00:00:58,870 But the cool thing is that this is not just a table view. 13 00:00:59,050 --> 00:01:04,960 If I rotate the device you'll see that we can see both the table view and the supporting View Controller 14 00:01:04,960 --> 00:01:05,800 at the same time. 15 00:01:05,800 --> 00:01:07,050 Check it out. 16 00:01:07,300 --> 00:01:12,730 See I can select an image and the image will appear in its related View Controller. 17 00:01:12,730 --> 00:01:14,440 Super cool stuff. 18 00:01:14,500 --> 00:01:19,180 And there's also this full screen button here which if I click it it's going to go ahead and load that 19 00:01:19,180 --> 00:01:20,770 image up in full screen. 20 00:01:20,950 --> 00:01:26,770 Now if I rotate back whoops wrong way if I rotate back it's going to just simply show the regular view 21 00:01:26,770 --> 00:01:28,060 controller that you would expect. 22 00:01:28,060 --> 00:01:29,280 Pretty cool. 23 00:01:29,290 --> 00:01:36,060 Now of course I can go back and I can select another one here rotate and I can go back to show the view 24 00:01:36,070 --> 00:01:37,290 controller on the side. 25 00:01:37,480 --> 00:01:38,290 Pretty awesome. 26 00:01:38,290 --> 00:01:44,410 This is a great way to add functionality into your app if you think of like the iOS settings app it 27 00:01:44,410 --> 00:01:49,930 uses this and I'll have you notice as well that I'm running this on an iPhone a plus because it has 28 00:01:49,930 --> 00:01:51,440 the bigger screen size. 29 00:01:51,640 --> 00:01:58,930 Usually I split view controller apps are on the iPad but if an app is built with a split view controller 30 00:01:59,380 --> 00:02:01,000 you can access it on an iPhone. 31 00:02:01,000 --> 00:02:02,250 A plus as well. 32 00:02:02,290 --> 00:02:07,930 Now if you were to simply run this app on an iPhone 8 For instance you would not get the UI split view 33 00:02:07,930 --> 00:02:08,770 controller. 34 00:02:08,770 --> 00:02:14,620 So it's only going to work on devices with a regular width and an iPhone 8 does not have a regular with 35 00:02:14,620 --> 00:02:15,100 or height. 36 00:02:15,100 --> 00:02:19,480 So we're going to go ahead and build this app it's pretty cool. 37 00:02:19,480 --> 00:02:27,280 Pretty cool concept to be able to load up a UI view controller as well as show both in the same view 38 00:02:27,280 --> 00:02:28,780 if the screen is big enough. 39 00:02:28,780 --> 00:02:32,760 Pretty awesome stuff so I don't know about you but I want to dive into building this. 40 00:02:32,750 --> 00:02:37,090 So let's head over to the next video where we're going to import all of the graphical assets like the 41 00:02:37,090 --> 00:02:43,030 images we're going to set up some dummy data and we're also going to explore something in the app delegate 42 00:02:43,030 --> 00:02:45,040 after we create our project so Acia there.