1
00:00:05,120 --> 00:00:10,820
In the last video, we added the search menu item. Now clicking it won't do anything yet. The main reason for that is

2
00:00:10,820 --> 00:00:16,700
we've got an error now in MainActivity, in the onOptionsItemSelected, because we've removed the settings

3
00:00:16,700 --> 00:00:17,410
menu option.

4
00:00:17,650 --> 00:00:19,210
So it's time to get that working now.

5
00:00:19,520 --> 00:00:26,210
So what we want to do is launch the searchActivity activity. Now we've seen how to start a new activity

6
00:00:26,270 --> 00:00:28,710
using an intent, a few times now.

7
00:00:28,940 --> 00:00:34,200
So this is going to be very similar to starting our PhotDetailsActivity when a thumbnail's tapped.

8
00:00:34,250 --> 00:00:39,980
So the place to do it, again, is in this onOptionsItemSelected in MainActivity, and the change,

9
00:00:39,980 --> 00:00:45,030
firstly, we're going to remove the action underscore settings because we deleted that menu option.

10
00:00:45,050 --> 00:00:47,180
We're going to replace that with action

11
00:00:47,310 --> 00:00:54,970
underscore search, which is our new one, delete true, add a code block, and the code block is going to be start

12
00:00:54,980 --> 00:01:00,870
Activity parentheses Intent with a capital I,

13
00:01:01,610 --> 00:01:04,510
then parentheses again, this comma.

14
00:01:04,650 --> 00:01:10,360
Then it's going to be searchActivity colon colon class dot Java.

15
00:01:11,360 --> 00:01:12,450
That's the first one,

16
00:01:12,620 --> 00:01:15,170
and the second line is going to be true.

17
00:01:15,650 --> 00:01:20,180
So although we haven't done very much, and it's just basically launching of an activity like we've done

18
00:01:20,180 --> 00:01:20,960
before,

19
00:01:21,050 --> 00:01:24,660
it's still a good idea to run the app before going any further.

20
00:01:24,670 --> 00:01:28,550
So let's actually try doing that, making sure that the app compiles and runs.

21
00:01:35,900 --> 00:01:36,280
OK, so

22
00:01:36,280 --> 00:01:41,630
there's our app, and we've now got the little magnifying glass here, the search icon

23
00:01:41,630 --> 00:01:48,360
so we click on that, we can see that searchActivity actually works. But of course, it's not going to do anything

24
00:01:48,360 --> 00:01:48,910
yet.

25
00:01:49,340 --> 00:01:55,250
But if we know that it launches OK, then any errors we get later will be caused by changes in search

26
00:01:55,250 --> 00:01:56,000
Activity,

27
00:01:56,150 --> 00:01:57,860
so that narrows down where we have to look for them.

28
00:01:57,860 --> 00:02:02,670
So that's why it's always a good idea to be making, or testing your changes as you go along.

29
00:02:02,930 --> 00:02:05,680
Alright, so we've got the search icon working, so that's good.

30
00:02:05,930 --> 00:02:09,550
So it's now time to make our searchActivity do something useful.

31
00:02:09,560 --> 00:02:15,650
Now it turns out there's actually not much we need to do, because the search view widget does most of it for

32
00:02:15,650 --> 00:02:18,250
us. Now we need to create a new menu,

33
00:02:18,380 --> 00:02:23,450
so I'm going to come over here to our res folder. I'm going to open that up, the res Menu folder,

34
00:02:24,950 --> 00:02:28,240
right click, select New, Menu resource file.

35
00:02:28,340 --> 00:02:33,000
I'm going to call this one menu_search and click OK.

36
00:02:33,000 --> 00:02:34,430
We don't change anything else.

37
00:02:36,660 --> 00:02:42,390
Now it's just going to contain a single item which would be where we enter the search terms.

38
00:02:42,450 --> 00:02:48,390
So what we're going to do here, is use the toolbar to host a search view widget, so that we can search

39
00:02:48,390 --> 00:02:50,580
for things by typing them into the toolbar.

40
00:02:50,710 --> 00:02:54,000
And that's a very common way to implement search in Android.

41
00:02:54,070 --> 00:02:56,820
So it'll pretty much look as you'd expect it to.

42
00:02:56,880 --> 00:03:03,120
So I'm going to come over here and grab, and drag rather, a search item onto the menu, and obviously search

43
00:03:03,120 --> 00:03:08,610
item rather than menu item, so we're going to just do that and release, and obviously I could've dragged it into the component tree,

44
00:03:08,940 --> 00:03:10,840
if I wanted to do that instead.

45
00:03:10,980 --> 00:03:16,530
Alright so that's created the search view for us, you can see over here that as well. The ID has been set to

46
00:03:16,570 --> 00:03:17,940
app underscore bar underscore search.

47
00:03:17,940 --> 00:03:19,600
So I'm just going to leave it at that.

48
00:03:19,620 --> 00:03:24,120
Now I have noticed that the common attributes pane doesn't always populate, and you can see there that

49
00:03:24,300 --> 00:03:26,160
I've clicked on that and nothing's happening.

50
00:03:26,170 --> 00:03:31,690
If that appears blank for you, just expand the attributes pane and that should show all the attributes.

51
00:03:31,690 --> 00:03:35,720
So I'll come over here and do that, and you can see that that's actually working now.

52
00:03:36,000 --> 00:03:41,110
And if it comes up with a different ID for you, either change it to be the same as mine, or just use the

53
00:03:41,110 --> 00:03:46,150
ID you've got when you type the code in later. And again, if I go back we can't see anything else, but you can see by

54
00:03:46,160 --> 00:03:48,190
the extended view we can see that it's working.

55
00:03:48,410 --> 00:03:51,450
Now we've got an error though, or I have and you may not have.

56
00:03:51,630 --> 00:03:56,310
If we come over here, and I've already expanded menu but you can see over here, we've got a warning or an error over

57
00:03:56,330 --> 00:03:56,930
here.

58
00:03:57,160 --> 00:03:58,700
And if you click on this exclamation mark,

59
00:04:02,310 --> 00:04:09,030
the error's saying that we should be using the app colon namespace with the appCompat library, and it's actually

60
00:04:09,130 --> 00:04:11,220
a slightly strange error.

61
00:04:11,530 --> 00:04:13,260
So if we scroll up a little bit more,

62
00:04:13,790 --> 00:04:19,089
it's actually got a button here, a fix, that'll change to use the app colon namespace.

63
00:04:19,220 --> 00:04:24,400
Now if Android Studio can spot the error and fix it for us, then it may fix it automatically in future.

64
00:04:24,410 --> 00:04:28,890
So if you don't get this particular error that's fine. There's no point worrying when you don't get an error.

65
00:04:28,950 --> 00:04:31,150
Save your worrying for when you do get them.

66
00:04:31,150 --> 00:04:37,110
Alright so I'm going to click on this fix button, and you can see that we've actually got a message

67
00:04:37,110 --> 00:04:40,200
here about hardcoded text, but the other message has disappeared,

68
00:04:40,200 --> 00:04:41,580
so that's good.

69
00:04:41,580 --> 00:04:46,900
Now what we should probably do is make a point of clearing or fixing this hardcoded text warning

70
00:04:46,920 --> 00:04:49,660
as well. So I'm going to close this for now,

71
00:04:49,860 --> 00:04:51,360
and as I showed you earlier,

72
00:04:51,390 --> 00:04:55,800
for my version of Android Studio the common attributes aren't showing, and so therefore I'm having to click

73
00:04:55,800 --> 00:05:00,950
on the extended attributes to get in there and be able to change anything.

74
00:05:01,080 --> 00:05:03,320
And what we want to do is to make some changes here.

75
00:05:03,660 --> 00:05:06,150
So we've already got our string resource for search,

76
00:05:06,150 --> 00:05:13,020
so we're going to go over next to title, over here, and click on the ellipsis. Then we want to choose activity

77
00:05:14,710 --> 00:05:18,900
underscore search, so I've got title underscore activity underscore search.

78
00:05:19,080 --> 00:05:19,610
Click on OK,

79
00:05:20,690 --> 00:05:26,930
and you can see that it's now cleared the error. Now the last attribute is set to, to set is showAsAction.

80
00:05:27,150 --> 00:05:28,250
So we want to set that to

81
00:05:28,250 --> 00:05:38,580
ifRoom, so this one down here, showAsAction. We're going to come over here, expand this out, and click on ifRoom. Alright so at this

82
00:05:38,580 --> 00:05:40,350
point we've got our menu created.

83
00:05:40,530 --> 00:05:46,190
Now we need to tell search activity to display it and provide the search functionality that we need.

84
00:05:46,200 --> 00:05:48,100
So I'm going to go through the easy stuff first,

85
00:05:48,330 --> 00:05:52,470
and then we can have a look at how search is implemented, and the changes we have to make to get it to

86
00:05:52,470 --> 00:05:52,980
work.

87
00:05:53,280 --> 00:05:59,220
So the first thing we need though, is to declare a search view variable in search activity. So I'm going to come over and

88
00:05:59,280 --> 00:06:00,190
open that up.

89
00:06:00,270 --> 00:06:01,170
SearchActivity.

90
00:06:04,540 --> 00:06:08,680
Let's go back under the tag definition and add a search view, so it's going to be private var

91
00:06:11,470 --> 00:06:16,170
search view colon SearchView

92
00:06:16,990 --> 00:06:17,840
question mark

93
00:06:17,860 --> 00:06:22,010
equals null, and we're going to select,

94
00:06:22,240 --> 00:06:24,300
now you might be asking which one to select here.

95
00:06:24,510 --> 00:06:28,720
Well we're using the framework search view rather than the support version,

96
00:06:28,900 --> 00:06:32,050
and that's because SearchView was added in API 11.

97
00:06:32,070 --> 00:06:34,400
Now our minimum API is 17,

98
00:06:34,500 --> 00:06:38,940
so therefore we don't need to use the support library for this. Now as Android Studio

99
00:06:38,970 --> 00:06:42,820
doesn't now support API levels earlier than 14,

100
00:06:42,920 --> 00:06:47,370
it's even strange that it's offering the support library version. It's something to be aware of though and watch out

101
00:06:47,370 --> 00:06:48,010
for.

102
00:06:48,030 --> 00:06:54,750
So I'm going to select the main version android.widget.SearchView. Now the next step is to inflate

103
00:06:54,840 --> 00:07:00,880
menu in the onCreateOptions menu function, which we'll add after the on create function.

104
00:07:01,130 --> 00:07:07,590
So I'm going to come down here, then I'm going to do a control o to generate the stub, and again, the one we want we want is

105
00:07:07,610 --> 00:07:14,480
onCreateOptions. I'm just typing a bit of that in, that one there, onCreateOptionsMenu is the one we want so I'm just going

106
00:07:14,480 --> 00:07:16,160
to press enter there.

107
00:07:16,490 --> 00:07:19,360
And we're going to delete the call to super,

108
00:07:19,560 --> 00:07:28,950
and instead what we're going to do is type menu inflator dot inflate parentheses R.menu dot

109
00:07:29,430 --> 00:07:31,460
menu underscore search, which we created,

110
00:07:31,580 --> 00:07:34,820
comma menu closing parentheses.

111
00:07:34,850 --> 00:07:37,620
And then we're going to return true.

112
00:07:37,730 --> 00:07:43,190
So that's standard code in the onCreateOptionsMenu function, and it's the same as we did in MainActivity,

113
00:07:43,700 --> 00:07:49,220
except of course this time we're inflating menu underscore search instead of menu underscore main. Now

114
00:07:49,220 --> 00:07:55,280
inflating an XML layout, just takes the XML representation of all the widgets and menu items and

115
00:07:55,280 --> 00:07:59,180
so forth, and creates the view for them, or from them.

116
00:07:59,180 --> 00:08:04,490
Now here we're using a menu inflater rather than a layout inflater, because we're actually creating

117
00:08:04,490 --> 00:08:07,850
a menu, or inflating a menu, rather than a layout.

118
00:08:07,850 --> 00:08:09,830
Alright so that's the easy bits out of the way.

119
00:08:10,190 --> 00:08:11,340
Now it gets interesting.

120
00:08:11,400 --> 00:08:17,570
Now the steps we have to do at this point are well documented, and a good source is a Google training document

121
00:08:17,600 --> 00:08:24,800
that I'm going to open up in my browser now, and add as a resource as I always do,

122
00:08:24,880 --> 00:08:31,080
so you can check it out at your leisure. Now this particular page doesn't mention that you have to use

123
00:08:31,080 --> 00:08:33,289
the app colon namespace,

124
00:08:33,380 --> 00:08:37,919
if you're using AppCompat, but the rest of the document is accurate. Now we've actually done the first

125
00:08:37,919 --> 00:08:40,980
steps on this page.

126
00:08:40,980 --> 00:08:42,820
We've added the search view to the app bar,

127
00:08:43,020 --> 00:08:48,800
so what we need now to do is create a Searchable Configuration, and that's all described on that heading.

128
00:08:48,810 --> 00:08:52,080
So if we scroll down here, create a Searchable configuration,

129
00:08:52,350 --> 00:08:56,580
and we're going to be coming back to this page to get the meta data for the manifests.

130
00:08:56,580 --> 00:09:03,660
Now we're going to create a very basic configuration file, but if we follow the Searchable Configuration

131
00:09:03,660 --> 00:09:09,370
link at the top of that section of the page, there's a lot of configuration possibilities, so Searchable

132
00:09:09,390 --> 00:09:10,490
Configuration here.

133
00:09:13,820 --> 00:09:19,680
So you can see there's quite a few options that we can define. Now we're going to provide a label because that's

134
00:09:19,680 --> 00:09:20,820
required, 

135
00:09:21,300 --> 00:09:23,890
and we can come down to any of these and see whether they're required or not.

136
00:09:24,040 --> 00:09:29,830
You can see here String resource required, and we're also going to provide a hint, which if we scroll down and have

137
00:09:29,830 --> 00:09:30,790
a look there, the hint

138
00:09:30,910 --> 00:09:32,540
that's actually recommended.

139
00:09:33,100 --> 00:09:38,700
Everything else is optional and lets you provide lots of things including, for example, voice search.

140
00:09:38,710 --> 00:09:43,190
Now we're going to keep things simple for this first example of using search in our apps.

141
00:09:43,190 --> 00:09:47,930
So our Searchable Configuration file will only contain the label and the hint.

142
00:09:47,950 --> 00:09:53,230
Now the Searchable Configuration file is usually called searchable dot xml, although frankly

143
00:09:53,230 --> 00:09:58,360
you can call it any valid name you want, which you may need to do if your app implements several different

144
00:09:58,360 --> 00:09:59,640
search features.

145
00:09:59,650 --> 00:10:04,060
Now the file that you create must live in the res slash xml directory,

146
00:10:04,180 --> 00:10:06,910
so therefore we need to create that xml directory.

147
00:10:06,970 --> 00:10:09,260
So going back to Android Studio,

148
00:10:09,430 --> 00:10:10,650
we'll go into the res folder,

149
00:10:11,050 --> 00:10:18,610
and from the res folder we're going to create a new folder. We're going to right click New, Android resource directory. So

150
00:10:18,630 --> 00:10:25,600
we're going to change it so that the name will change from values to xml, and the Resource type, we'll also change that

151
00:10:25,600 --> 00:10:29,170
so that's also xml. Everything else is fine to leave as the default

152
00:10:29,170 --> 00:10:31,350
so just click on OK.

153
00:10:31,430 --> 00:10:37,820
So at this point we've now got an xml folder down here. So we want to right click on that folder now, and click

154
00:10:37,820 --> 00:10:42,540
on New, XML resource file.

155
00:10:42,540 --> 00:10:45,710
Now we don't need to specify anything other than the file name,

156
00:10:45,900 --> 00:10:48,170
so we can just type in searchable here.

157
00:10:49,770 --> 00:10:50,990
Click OK,

158
00:10:51,070 --> 00:10:56,250
and the xml extension will be provided automatically by Android Studio, and we can confirm that by

159
00:10:56,510 --> 00:10:59,690
opening up the directory there and you can see that showing up.

160
00:10:59,760 --> 00:11:04,960
The other thing that is different though, is that Android Studio's automatically opened up searchable dot

161
00:11:04,960 --> 00:11:07,330
xml in the new preferences editor.

162
00:11:07,560 --> 00:11:13,830
Now this was new to Android Studio 2.2, and it lets you create a settings screen for your app settings.

163
00:11:13,830 --> 00:11:18,900
Now that's great if you're trying to create a settings screen, but less useful if you're creating what

164
00:11:18,900 --> 00:11:21,590
we're doing, a searchable configuration file.

165
00:11:21,630 --> 00:11:25,030
Now there is a way to prevent it from launching straight into this preferences editor

166
00:11:25,170 --> 00:11:29,400
when you create a new xml file, but frankly it's not really worth the trouble, because all you really

167
00:11:29,400 --> 00:11:34,860
have to do is come over here and click on text to get into a normal editor, where you can edit the xml

168
00:11:34,920 --> 00:11:36,560
directly. Now notice that

169
00:11:36,560 --> 00:11:39,620
it also creates the xml declaration for us.

170
00:11:39,740 --> 00:11:43,680
That's that first line, line 1, and that saves a little bit of typing.

171
00:11:43,680 --> 00:11:49,320
So what I'm going to do is replace the preferences screen tags with the searchable tag that we need.

172
00:11:49,530 --> 00:11:55,710
So literally I'm just going to come up here and change that to searchable, press enter there. I'm going to come over to the

173
00:11:55,710 --> 00:11:57,720
end of this first line for Android.

174
00:11:57,720 --> 00:12:07,980
I'm going to add to that, android colon hint equals Enter photo tags, and on the next line, tab over so that

175
00:12:08,100 --> 00:12:16,800
it's nicely in line, so android label equals. Then we're going to print double quotes @string forward slash

176
00:12:17,350 --> 00:12:20,150
title_ activity_search,

177
00:12:20,880 --> 00:12:27,970
and I'm just going to close it off there, and just delete the closing tag there now that we've done that. Now for the hint,

178
00:12:28,080 --> 00:12:30,570
I going to show you an alternate way of doing things.

179
00:12:30,570 --> 00:12:35,640
As I've actually entered the actual text that I want, what you can do with your cursor in that field,

180
00:12:35,700 --> 00:12:39,610
is you can hold down alt and press enter,

181
00:12:39,710 --> 00:12:47,130
and it brings up a little menu here. We can select Extract string resource, and that actually lets you create, or convert

182
00:12:47,130 --> 00:12:49,260
rather, the text to a string resource.

183
00:12:49,260 --> 00:12:55,230
Now I'm going to use the name searchable_hint for the resource name.

184
00:12:55,510 --> 00:13:01,680
Now note that the resource value is already set to whatever text you typed in the double quotes there. So if you just

185
00:13:01,680 --> 00:13:08,560
click on OK now, you can see that the text is now stored in a string resource instead of being hardcoded.

186
00:13:09,230 --> 00:13:10,580
Alright so let's finish the video here.

187
00:13:10,770 --> 00:13:15,600
We'll continue on working on the changes to implement search in the next video.