1
00:00:05,080 --> 00:00:08,670
Everyone will come back to class and Johnny be here with slopes dot com.

2
00:00:08,830 --> 00:00:15,190
We're continuing working on our shortcut app and in the last lesson we got all of our UI set up and

3
00:00:15,190 --> 00:00:22,200
it's looking fantastic but when we first touch on our app nothing is happening.

4
00:00:22,390 --> 00:00:25,150
So we're going to remedy that in this lesson.

5
00:00:25,160 --> 00:00:25,740
All right.

6
00:00:25,990 --> 00:00:29,890
So let's take a look at the apple documentation here.

7
00:00:30,070 --> 00:00:31,500
Pull it over here.

8
00:00:31,750 --> 00:00:38,260
If you just do a search for UI application shortcut items should be one of the first ones.

9
00:00:38,320 --> 00:00:46,470
Go ahead and I'll just use my publication short cut item then.

10
00:00:46,520 --> 00:00:51,440
Yeah right here developer dot apple dot com documentation that will take you right to here.

11
00:00:51,940 --> 00:00:54,370
And so let's go and just read a little bit.

12
00:00:54,370 --> 00:00:59,130
It's always good to jump into the official Apple documentation when you are learning something new.

13
00:00:59,280 --> 00:01:05,710
All right says that the UI application shortcut items specifies the static homescreen quick actions

14
00:01:05,740 --> 00:01:06,900
for the app.

15
00:01:06,910 --> 00:01:09,780
This key contains an array of dictionaries.

16
00:01:10,050 --> 00:01:17,550
So we're going to be working in our Infocom P list and we're going to create an array of called UI application

17
00:01:17,560 --> 00:01:24,730
shortcut items and inside of it we are going to see here it says that we are going to have an array

18
00:01:24,730 --> 00:01:25,540
of dictionaries.

19
00:01:25,540 --> 00:01:30,580
The number of quick actions shown for your app on the home screen when the user presses your home screen

20
00:01:30,610 --> 00:01:35,400
icon on a device that supports 3D touch is determined by the system.

21
00:01:35,410 --> 00:01:40,930
All right so we have our array called UI application shortcut items and inside of it is a number of

22
00:01:40,930 --> 00:01:41,980
dictionaries.

23
00:01:42,010 --> 00:01:49,230
Now you can have up to four quick actions show wins when you press down on your app icon.

24
00:01:49,460 --> 00:01:49,730
All right.

25
00:01:49,730 --> 00:01:52,410
And so keep that in mind that you can only have four.

26
00:01:52,570 --> 00:01:57,160
And there's actually something called static and dynamic shortcuts.

27
00:01:57,250 --> 00:02:01,840
We're only going to be covering static ones in this Target topic.

28
00:02:02,290 --> 00:02:04,920
Well maybe maybe we'll get to dynamic ones we'll see.

29
00:02:05,140 --> 00:02:10,930
But the static ones are defined in your list and that's where we're going to be working.

30
00:02:10,930 --> 00:02:17,370
All right so there are some keys that we need for a quick action.

31
00:02:17,360 --> 00:02:17,800
All right.

32
00:02:18,040 --> 00:02:24,180
So the first type is are the first key is right here UI application a short cut item type.

33
00:02:24,670 --> 00:02:31,120
And this is a required string delivered to your app when the user invokes the corresponding quick action.

34
00:02:31,120 --> 00:02:37,060
So basically this is just an identifier for your quick action that we can do a check in our app delegate

35
00:02:37,060 --> 00:02:45,000
file to be able to say if it was this type then do this if it was this one then do that.

36
00:02:45,280 --> 00:02:46,890
All right so it's just an identifier.

37
00:02:47,200 --> 00:02:50,820
Then we have a UI application shortcut item and title.

38
00:02:50,860 --> 00:02:54,980
So our shortcut has a title and that's also required.

39
00:02:55,090 --> 00:02:56,860
And then we have some optional ones here.

40
00:02:57,040 --> 00:03:00,860
We have an item subtitle so that's optional.

41
00:03:01,120 --> 00:03:06,350
It'll be displayed below the main title The main item title.

42
00:03:06,580 --> 00:03:14,650
Then we have a UI application shortcut item icon type so optionally we can have our our quick actions

43
00:03:14,650 --> 00:03:21,820
have an icon next to it and it can either be so if you use this one the item icon type then it's an

44
00:03:21,820 --> 00:03:26,290
optional string specifying the type of an icon from the system provided library.

45
00:03:26,380 --> 00:03:32,680
And if you click here see the application shortcut icon type then that will take you over here and this

46
00:03:32,680 --> 00:03:42,130
will show you all of the system icon types that are available to you such as compose which will be view

47
00:03:42,460 --> 00:03:51,310
this icon right here or play or see here what do we got prohibit.

48
00:03:51,850 --> 00:03:58,080
Yes so you've got you've got a fair number of system icons that are available to you here.

49
00:03:58,150 --> 00:04:04,960
However if you want to have your own icons like we are going to do then you can use UI applications

50
00:04:04,960 --> 00:04:11,830
shortcut item icon file and this is an optional string specifying an icon image to use from the apps

51
00:04:11,830 --> 00:04:15,740
bundle or the name of an image in an asset catalog.

52
00:04:15,970 --> 00:04:25,570
All right and if you remember in our project we imported our assets for mountain short ocean short and

53
00:04:25,570 --> 00:04:26,800
space short.

54
00:04:26,830 --> 00:04:30,670
All right and so these are the icons for our short cut items.

55
00:04:30,890 --> 00:04:39,440
And if you want to make your own like it says here I should be square a single color and 35 by 35 points.

56
00:04:39,450 --> 00:04:42,980
Then came the Gottesman Photoshop template files.

57
00:04:43,060 --> 00:04:46,010
However I like to use sketch.

58
00:04:46,030 --> 00:04:52,300
And here is actually the sketch file that I use to make the assets for for this target topic.

59
00:04:52,300 --> 00:05:03,190
We've got our our view controller images here and then down here we have our shortcut icons here and

60
00:05:03,190 --> 00:05:08,620
you can see that each art board here is 35 by 35.

61
00:05:08,940 --> 00:05:11,440
And sketches super super nice.

62
00:05:11,460 --> 00:05:18,570
All you've got to do is look at your art boards that you want to export and say export at 1 2 and 3

63
00:05:18,600 --> 00:05:23,230
x and anyways so yeah you can use whatever you want Photoshop.

64
00:05:23,250 --> 00:05:32,220
I got to do is just make sure that your your your art board is or your layer is 40 or 35 by 35 points

65
00:05:32,580 --> 00:05:42,960
and then you need to export that at 2 and 3 x so 70 and whatever three times 35 is now the last optional.

66
00:05:43,080 --> 00:05:48,210
Key here is a UI application shortcut item user info.

67
00:05:48,310 --> 00:05:50,180
All right so this is an optional app.

68
00:05:50,250 --> 00:05:55,980
B find a dictionary one use for this dictionary provide perversion information.

69
00:05:56,490 --> 00:06:01,170
So we're so i to be working with this at all but that's just if you want to pass additional information

70
00:06:01,740 --> 00:06:04,290
with your quick action.

71
00:06:04,290 --> 00:06:08,630
All right so these are the ones that we are going to need to implement in our food list.

72
00:06:08,650 --> 00:06:10,530
Let's go ahead and do that.

73
00:06:11,120 --> 00:06:18,060
All right let's go to our food list and we are going to need to create a new key and the one that we

74
00:06:18,060 --> 00:06:21,320
want is not going to be provided in our auto.

75
00:06:21,480 --> 00:06:27,380
So I'm going to jump back here to our safari our documentation and right here is what we want you application

76
00:06:27,390 --> 00:06:34,630
shortcut items are going to copy this Anjum pack into index code and paste it right here.

77
00:06:34,620 --> 00:06:35,430
There we go.

78
00:06:35,430 --> 00:06:41,880
And we're going to change the type 2 array because we we're going to have an array of dictionaries and

79
00:06:41,880 --> 00:06:50,550
then each dictionary holds the information for our quick action and inside of that dictionary is all

80
00:06:50,550 --> 00:06:53,040
of this information right here.

81
00:06:53,040 --> 00:06:56,810
And you can see here we have an example of what that's going to look like.

82
00:06:56,820 --> 00:06:57,910
So here's the array.

83
00:06:57,960 --> 00:07:04,860
Here's our first item so this is right here contains one quick action and then right here contains the

84
00:07:04,860 --> 00:07:06,270
second to quick action.

85
00:07:06,540 --> 00:07:12,070
And we have the icon file the title the type and the user info.

86
00:07:12,420 --> 00:07:14,670
All right so let's go ahead and add those.

87
00:07:14,670 --> 00:07:16,190
Let's start with the shortcut.

88
00:07:16,200 --> 00:07:19,160
Item type I'm going to copy that right here.

89
00:07:19,620 --> 00:07:25,180
And then we're going to jump over here and we're going to have to create a new item.

90
00:07:25,230 --> 00:07:30,010
And so this is item 0 and this is going to be a dictionary.

91
00:07:30,240 --> 00:07:37,330
And then we can put the arrow down again and we're going to add again and this time we can paste.

92
00:07:37,380 --> 00:07:40,770
Well I'll just show you what we copied if you missed it.

93
00:07:40,780 --> 00:07:43,760
Is this application shortcut item type.

94
00:07:43,760 --> 00:07:52,660
It's going to copy that again and right here to paste and then I'm going to just expand this right here

95
00:07:52,660 --> 00:07:53,850
the property list.

96
00:07:53,860 --> 00:07:55,700
All right so this is a string.

97
00:07:55,720 --> 00:08:02,050
This is our identifier and it's common practice for this to be your bundle identifier followed by some

98
00:08:02,050 --> 00:08:03,240
sort of identifier.

99
00:08:03,380 --> 00:08:03,910
OK.

100
00:08:04,030 --> 00:08:08,340
So I'm just going to copy what we have here for the product bundle identifier.

101
00:08:08,350 --> 00:08:13,980
Copy that and paste it and then I'm going to append that.

102
00:08:14,200 --> 00:08:15,620
And this is our first one.

103
00:08:15,640 --> 00:08:18,830
So it's going to be Mt..

104
00:08:19,510 --> 00:08:21,160
Just mountains mountains.

105
00:08:21,160 --> 00:08:21,740
OK.

106
00:08:22,030 --> 00:08:25,690
So there we have our first key for our quick action.

107
00:08:25,690 --> 00:08:28,210
Next up I'm just swapping back to Safari.

108
00:08:28,210 --> 00:08:34,980
Here is our shortcut item title right so we're going to copy the item title which is also required.

109
00:08:35,000 --> 00:08:38,880
We're going to create a new key value pair here.

110
00:08:39,120 --> 00:08:45,360
So we're going to select the plus and I'm going to paste here your application the shortcut item title.

111
00:08:45,370 --> 00:08:51,270
This is another string and we can just same mountains.

112
00:08:52,330 --> 00:08:58,230
And this is the actual string that you see when you press and hold.

113
00:08:58,360 --> 00:08:58,570
All right.

114
00:08:58,570 --> 00:09:05,040
Next up we have an application Shurkin item subtitle and we're not actually going to use the subtype

115
00:09:05,050 --> 00:09:10,150
Well you know I'm going to use it once just to show you what it looks like and then I'll probably get

116
00:09:10,150 --> 00:09:12,720
rid of it and I'm going to say.

117
00:09:13,060 --> 00:09:15,030
So majestic.

118
00:09:15,070 --> 00:09:16,350
There we go.

119
00:09:16,360 --> 00:09:25,480
All right next up we have the item I icon type and I told you that we're going to use the custom ones

120
00:09:25,540 --> 00:09:29,950
but I'm going to start out or start out putting this in just so you can see what it looks like.

121
00:09:30,030 --> 00:09:37,450
So when I paste it and then the string that you need to use I'm coming back toward documentation is

122
00:09:37,540 --> 00:09:43,240
this I'm going to copy this application shortcut icon type.

123
00:09:43,600 --> 00:09:49,130
I'm going to paste it followed by any of these.

124
00:09:49,190 --> 00:09:54,350
Let's go ahead and do and see here love case.

125
00:09:54,370 --> 00:09:57,150
So you have you application shortcut.

126
00:09:57,160 --> 00:10:05,030
I can type in followed by the hoops not love love followed by the enumerator type.

127
00:10:05,070 --> 00:10:05,740
OK.

128
00:10:06,100 --> 00:10:10,760
Any of these cases but it's a capital letter of any of these.

129
00:10:11,260 --> 00:10:11,970
There we go.

130
00:10:12,280 --> 00:10:15,370
And then after I show you we'll come back here and switch.

131
00:10:15,370 --> 00:10:18,730
Swap it out for the custom one that we made.

132
00:10:18,730 --> 00:10:21,730
All right so what do we have next.

133
00:10:21,730 --> 00:10:27,240
Shortcut icon type icon file and that's actually since we're not going to be doing the shortcut.

134
00:10:27,250 --> 00:10:30,810
Item user info that would just be another dictionary that you would add.

135
00:10:30,970 --> 00:10:31,610
OK.

136
00:10:32,230 --> 00:10:38,870
All right so you know what that's actually all we need to do to be able to just see it.

137
00:10:38,920 --> 00:10:40,430
OK so let's go ahead and run this.

138
00:10:40,450 --> 00:10:45,260
All right going to come back out here and then we're going to touch you.

139
00:10:45,280 --> 00:10:46,260
There we go.

140
00:10:46,330 --> 00:10:49,950
Mountains so majestic and we have our icon.

141
00:10:50,410 --> 00:10:50,650
All right.

142
00:10:50,650 --> 00:10:52,550
Not bad not bad.

143
00:10:52,930 --> 00:10:57,710
All right so now that I showed you the icon type I'm going to get rid of it.

144
00:10:57,760 --> 00:11:02,870
So I jump back into safari and we want the shortcut item icon file.

145
00:11:02,910 --> 00:11:08,260
I want to copy that come back here pasted there.

146
00:11:08,500 --> 00:11:12,920
And the one that we want is what did we name it.

147
00:11:13,060 --> 00:11:15,780
It's it's called Mountain short.

148
00:11:15,850 --> 00:11:16,750
OK.

149
00:11:16,940 --> 00:11:18,780
It's right here.

150
00:11:20,040 --> 00:11:28,260
The shortcut item I file mountain short There you go.

151
00:11:28,770 --> 00:11:31,760
And how do we get this new item get to that.

152
00:11:31,770 --> 00:11:34,220
All right so let's go ahead and run this again see how that looks.

153
00:11:34,240 --> 00:11:37,830
All right go back to home and force touch.

154
00:11:37,830 --> 00:11:38,310
There we go.

155
00:11:38,310 --> 00:11:42,060
Now we got our mountain custom icon right there.

156
00:11:42,060 --> 00:11:43,260
Very nice.

157
00:11:43,260 --> 00:11:50,010
All right so let's go ahead and let's add our other two quick actions real quick so I'm going to click

158
00:11:50,010 --> 00:11:51,580
here and I'm going to add air.

159
00:11:51,690 --> 00:11:57,060
Our second item which is also a dictionary I want to put the arrow down.

160
00:11:57,190 --> 00:12:05,550
Then we're going to press the plus button again and we are just going to repeat OK plus And again this

161
00:12:05,550 --> 00:12:08,300
one is going back to Safari.

162
00:12:08,310 --> 00:12:11,360
Just going through them again we have our item type

163
00:12:14,380 --> 00:12:17,880
and it stream is going to open up our first dictionary.

164
00:12:17,890 --> 00:12:24,670
Well I'm just going to copy this whole string pasted here and instead of mountains this is going to

165
00:12:24,670 --> 00:12:26,780
be space.

166
00:12:27,690 --> 00:12:29,720
And let's hear what's next.

167
00:12:29,720 --> 00:12:39,460
The application shortcut title King plus and paste and space.

168
00:12:39,460 --> 00:12:40,250
There you go.

169
00:12:40,600 --> 00:12:49,630
And plus for our next key which is we'll skip the subtitle on this one and just come down here to item

170
00:12:49,630 --> 00:12:50,530
like on file.

171
00:12:50,550 --> 00:12:59,320
When I copy that and drop it in here and paste it and this one the icon file is space short.

172
00:12:59,480 --> 00:13:00,440
Now we go.

173
00:13:00,790 --> 00:13:10,410
And that covers it for this quick action enclose item 1 and do another plus change the type to dictionary.

174
00:13:10,870 --> 00:13:18,860
Drop the arrow down and press plus again and then just copy from our previous dictionary here.

175
00:13:19,150 --> 00:13:21,860
Copy the icon item type.

176
00:13:21,870 --> 00:13:25,460
Paste it I'm sorry the shortcut item type.

177
00:13:25,540 --> 00:13:34,670
I'm going to copy from right here as well and paste here and this identifier is going to be ocean.

178
00:13:34,690 --> 00:13:35,530
There we go.

179
00:13:35,860 --> 00:13:39,510
And then click on the plus to add a new key.

180
00:13:39,560 --> 00:13:48,640
Click on or will come up here and copy this one's key here and then paste it here and add a title.

181
00:13:48,670 --> 00:13:50,640
And this one is ocean.

182
00:13:50,810 --> 00:13:51,920
There we go.

183
00:13:51,940 --> 00:13:58,180
And then we're going to press the plus button again and this time will skip the subtitle and select

184
00:13:58,180 --> 00:13:59,850
the icon file.

185
00:13:59,860 --> 00:14:00,580
Copy that.

186
00:14:00,580 --> 00:14:02,730
Copy that key and paste it here.

187
00:14:03,250 --> 00:14:07,520
And this one is called Ocean short.

188
00:14:07,630 --> 00:14:08,820
All right there we go.

189
00:14:10,130 --> 00:14:17,500
Let's run this and make sure we're going all right we're going to go to the home and forced touch.

190
00:14:17,730 --> 00:14:21,930
And there we go all three of them mountains space and ocean.

191
00:14:21,930 --> 00:14:25,560
And when to get rid of this subtitle on the mountains one here.

192
00:14:25,590 --> 00:14:30,250
That was item zero subtitle.

193
00:14:30,270 --> 00:14:33,170
I'm just going to click on the minus sign to get rid of it.

194
00:14:33,360 --> 00:14:34,510
Let's read that one more time.

195
00:14:35,800 --> 00:14:39,280
All right going home and force touch.

196
00:14:39,280 --> 00:14:39,920
There we go.

197
00:14:39,940 --> 00:14:41,980
Mountain space and ocean.

198
00:14:42,040 --> 00:14:42,930
Pretty cool.

199
00:14:42,940 --> 00:14:49,700
So right now if we click on one of them all it does is take us to the same view.

200
00:14:49,720 --> 00:14:54,360
It just opens it and yes I'm not doing not doing too much.

201
00:14:54,370 --> 00:14:56,140
Looks cool but not doing too much.

202
00:14:56,200 --> 00:15:03,520
And the next lesson we're going to start coding up in the delegate so that we can receive messages for

203
00:15:03,520 --> 00:15:08,320
when someone actually clicks on that and take the recording necessary actions are.

204
00:15:08,450 --> 00:15:09,030
So see you then.