1
00:00:05,550 --> 00:00:11,030
Alright, so moving on. How do we get the photo details activity to display the photo now that we've got

2
00:00:11,030 --> 00:00:13,750
the photo details activity working.

3
00:00:13,970 --> 00:00:17,760
Well the first thing we have to do is retrieve the details from the intent.

4
00:00:18,020 --> 00:00:23,170
So let's go to photo details activity and do that first.

5
00:00:23,660 --> 00:00:24,680
I'm going to make a bit of space here,

6
00:00:24,700 --> 00:00:26,220
so it's a bit clearer what's happening.

7
00:00:26,630 --> 00:00:32,090
So let's add a line now to actually get the details from the intent, and to do that we're going to type

8
00:00:32,090 --> 00:00:36,590
val photo is equal to intent dot

9
00:00:36,740 --> 00:00:43,610
getSerializableExtra parentheses, which are there, photo underscore transfer

10
00:00:46,330 --> 00:00:50,170
as Photo.

11
00:00:50,170 --> 00:00:55,560
Now we're using the activity's intent property to retrieve the intent that started this activity.

12
00:00:55,690 --> 00:01:02,350
Now to retrieve the photo object, we use a get extra function. We have to use the get method that's appropriate

13
00:01:02,350 --> 00:01:04,140
for the data we want to retrieve,

14
00:01:04,360 --> 00:01:08,960
and in this case it's a serializable object which we then cast to be a photo.

15
00:01:09,340 --> 00:01:14,200
Now we're using the photo transfer constant as the key, to make sure we retrieve the same value that was

16
00:01:14,200 --> 00:01:15,700
stored by main activity.

17
00:01:15,970 --> 00:01:17,890
Alright so now that we've done that,

18
00:01:17,890 --> 00:01:22,960
so next we need to set the values from the fields of the photo object into the appropriate widget in

19
00:01:22,960 --> 00:01:24,040
the display.

20
00:01:24,040 --> 00:01:28,060
Now the text views are easy, so let's the try the first one, so photo

21
00:01:28,300 --> 00:01:31,330
underscore title. Now

22
00:01:31,360 --> 00:01:32,890
be careful with the suggested imports

23
00:01:32,980 --> 00:01:37,760
the first time you access a widget in this way. We haven't yet got a synthetic import,

24
00:01:37,810 --> 00:01:41,160
so Android Studio is going to try to find the best import to use.

25
00:01:41,270 --> 00:01:46,590
Now sometimes it wants to find it in the R class and, that's definitely not what we want.

26
00:01:46,830 --> 00:01:51,370
You want to make sure you're choosing content underscore photo underscore details from the tool

27
00:01:51,370 --> 00:01:52,110
tip.

28
00:01:52,120 --> 00:01:54,990
Now in my case that's the only option I've got, and that's fine,

29
00:01:55,000 --> 00:01:58,790
but if you do get the wrong one, delete the import that's added and use alt enter

30
00:01:58,940 --> 00:02:04,550
to get a list of suggestions, and you want to choose the Kotlin Android synthetic main content underscore

31
00:02:04,610 --> 00:02:09,490
photo underscore details, and you'll find that if I select this one here, we get the import added

32
00:02:09,490 --> 00:02:13,080
on line 4 automatically for us. So photo underscore title dot

33
00:02:13,230 --> 00:02:16,960
text equals photo.title.

34
00:02:17,710 --> 00:02:22,990
So again we've got the synthetic import added now and we can refer to the remaining widgets as well at this

35
00:02:22,990 --> 00:02:23,740
point.

36
00:02:23,920 --> 00:02:31,790
So photo underscore tags dot text, is equal to photo dot tags.

37
00:02:32,090 --> 00:02:37,930
Then we want photo underscore author dot text is equal to photo dot author.

38
00:02:40,860 --> 00:02:44,330
Now showing the picture in the image view is also straightforward.

39
00:02:44,360 --> 00:02:49,930
It's almost exactly the same as the code we used in the on bind view holder function of our adapter,

40
00:02:49,920 --> 00:02:51,950
the flickr recycler view adapter.

41
00:02:52,310 --> 00:02:57,530
So I'm going to go back to that code now, the FlickrRecyclerViewAdapter, and the code in on bind is Picasso

42
00:02:57,560 --> 00:03:01,110
dot with. I'm going to copy that code,

43
00:03:03,040 --> 00:03:11,890
and go back to our PhotoDetailsActivity. I'm going to paste that in. We want to accept the import to com dot squareup dot picasso dot

44
00:03:11,890 --> 00:03:19,150
Picasso, and there's just a few minor changes to make, and they're actually all highlighted for us.

45
00:03:19,190 --> 00:03:20,870
The first one is the context.

46
00:03:20,940 --> 00:03:25,970
Now an activity is a context, so we can just use this for that, so I'm going to go ahead and do that to fix

47
00:03:25,970 --> 00:03:33,020
that first one up, this. Now the next change is the URL to load the picture from. Now

48
00:03:33,170 --> 00:03:39,110
the thumbnail URL was in the image property, and we've stored the full photo URL in the link property,

49
00:03:39,500 --> 00:03:42,240
so we can use photo dot link instead.

50
00:03:42,240 --> 00:03:45,230
I'll come over here and change that.

51
00:03:45,310 --> 00:03:51,790
That's going to be photo.link, and we've also called our photo object photo,

52
00:03:52,020 --> 00:03:56,310
rather than photo item, so obviously I changed that as well.

53
00:03:56,610 --> 00:03:59,260
And finally the image view's stored in photo underscore image,

54
00:03:59,350 --> 00:04:05,760
rather than the holder.thumbnail, so into photo

55
00:04:06,010 --> 00:04:07,650
underscore image,

56
00:04:08,400 --> 00:04:11,360
and we don't need the dot thumbnail at all anymore. Alright, so

57
00:04:11,460 --> 00:04:13,680
let's try running this and see if it works.

58
00:04:20,399 --> 00:04:25,920
We're going to long tap an image, and at this point we've actually got an error.

59
00:04:25,930 --> 00:04:30,100
So we need to figure out what we've done wrong and fix the code.

60
00:04:30,330 --> 00:04:36,550
So let's firstly have a look at log cat, and the problem there is I've left this.thumbnail.context showing,

61
00:04:36,830 --> 00:04:41,170
and of course that should have just been this, because we know we're not using the thumbnail there.

62
00:04:41,560 --> 00:04:47,410
And again the reason we're using this, is that an activity is a context so we can just use this literally

63
00:04:47,410 --> 00:04:50,740
as the context, so I didn't need to use the thumbnail at all.

64
00:04:50,770 --> 00:04:52,830
So let's just try running that again.

65
00:04:59,650 --> 00:05:07,410
OK we'll try long tapping an image, and you notice that there was a short delay while picasso

66
00:05:07,410 --> 00:05:09,510
downloaded the image the first time,

67
00:05:09,720 --> 00:05:14,790
and that's why we've specified a placeholder image is displayed when the real image is downloaded.

68
00:05:15,050 --> 00:05:21,570
If we go back and choose the same image again, notice how it's instant this time,

69
00:05:21,580 --> 00:05:27,060
and that's because picasso's loading it from a local cache, and the other thing we've got is our other

70
00:05:27,100 --> 00:05:27,800
text

71
00:05:27,930 --> 00:05:32,740
views are actually working nicely as well. To do that let's just try another image,

72
00:05:34,090 --> 00:05:35,890
and you can see that's working nicely as well.

73
00:05:40,570 --> 00:05:46,040
So basically, we're now seeing our images load, and we're seeing the text represented on the screen as well,

74
00:05:46,270 --> 00:05:47,980
and it's all working fine.

75
00:05:47,980 --> 00:05:54,480
So at this point let's stop the video, and in the next one I'm going to show you how to use parcelable instead of serializable.

76
00:05:54,490 --> 00:05:55,790
So I'll see you in the next video.