A New Fragment3:48 with Ben Deitch
In this video we'll create our next Fragment!
[SOUND] We finally finished up our list fragment. 0:00 And we're ready to move on to launching a new fragment, 0:06 once the user has selected a recipe. 0:08 But before we get started, let's take a quick look 0:11 at what this new fragment should be and how we can go about implementing it. 0:14 When we tap on a recipe, the app should change its display 0:18 to show the ingredients and directions of that recipe. 0:21 And when we're on a phone, these should be displayed one at a time by using tabs. 0:25 To utilize tabs like this, we'll be making use of a new view group called ViewPager. 0:30 ViewPagers, much like recycler views, 0:36 make use of an adapter to determine what should be displayed on each page. 0:39 And more than that, there's even a special FragmentPagerAdapter class 0:44 we can use to handle showing different fragments on each page of our viewPager. 0:49 But that's getting a little ahead of ourselves. 0:54 Right now, let's just focus on displaying a new fragment and 0:57 moving our toast into this new fragment. 1:00 Let's start by creating a new class, Named ViewPagerFragment. 1:04 And let's make it extend Fragment. 1:13 Then let's create a new layout file for this fragment. 1:17 And let's name it fragment_viewpager. 1:26 We'll make changes to this layout later, but right now, we just need it to exist. 1:31 Back in our ViewPagerFragment class, let's hit Ctrl+O to bring up 1:37 the override dialogue and override the onCreateView method. 1:41 Then, inside this method, let's create a new view variable 1:49 named view, and set it equal to inflater.inflate, 1:54 pass in our fragment's layout, R.Layout.fragment_viewpager. 1:59 And the view grouping which we'd like to add this layout, container, 2:06 and lastly pass in false for the third parameter to tell 2:10 Android that we don't want our fragment to be added to the container. 2:13 Remember, fragments will be added automatically. 2:18 Last but not least, let's return our view variable. 2:22 Now that we've got our fragment and 2:27 given it a layout, let's head over to main activity and 2:28 see what we can do about switching to this fragment when we tap on a recipe. 2:31 Replacing one fragment with another is done in pretty much the same way 2:37 as when we add a fragment. 2:41 The only difference is that instead of using the add method, 2:43 we'll use the replace method. 2:47 Let's copy the fragment adding code from OnCreate, and 2:49 paste it into the bottom of onListRecipesSelected. 2:53 Then let's change add to replace. 2:59 And use a ViewPagerFragment instead of a ListFragment. 3:05 Now let's run the app and see if it works. 3:15 And if we click on a recipe, we get a blank screen, 3:25 which means we're looking at our new fragment. 3:28 Nice. 3:32 Now let's hit the back button to go back to the recipe list. 3:34 Or just quit the app. 3:38 That's cool too. 3:41 In the next video, we'll see what we can do to make the back button work correctly. 3:43
You need to sign up for Treehouse in order to download course files.Sign up