1
00:00:00,740 --> 00:00:05,990
Use custom gestures to determine custom behavior by our users on the device.

2
00:00:05,990 --> 00:00:11,570
Imagine if you want to find out if your user is drawing something similar to a circle or if you want

3
00:00:11,570 --> 00:00:14,780
to find out if they are pointing in a certain direction.

4
00:00:14,780 --> 00:00:17,800
All of those we can actually achieve them by custom gestures.

5
00:00:17,990 --> 00:00:23,540
And in this list then I'm going to actually show you how to find the way that you use it has to draw

6
00:00:23,540 --> 00:00:25,680
a certain direction on the device.

7
00:00:25,760 --> 00:00:30,920
And if that direction is correct they get a they get a notification saying that they have drawn in the

8
00:00:30,920 --> 00:00:35,110
right direction and if it is not they get a chance to redraw it.

9
00:00:35,120 --> 00:00:40,700
This could be useful for any situation like when you want your user to draw projects or in a video game

10
00:00:40,700 --> 00:00:43,970
for instance or anything that you might come up with.

11
00:00:44,000 --> 00:00:50,510
Now in this lesson particularly because it became a slightly longer code I decided to actually develop

12
00:00:50,510 --> 00:00:53,830
the app for you in advance so I can actually show it to you.

13
00:00:53,840 --> 00:01:00,770
So if you go to school and into a simulator this is the end result that if you're going to see the app

14
00:01:00,770 --> 00:01:02,390
has a very simple interface.

15
00:01:02,420 --> 00:01:09,230
Every time you read the roll you get two different points start and start and and your user can drop

16
00:01:09,230 --> 00:01:12,080
in here or move their top.

17
00:01:12,260 --> 00:01:17,580
And as they move their top they get some sort of an indication of which direction they're moving.

18
00:01:17,750 --> 00:01:24,860
And if they do draw in the same direction from the start two ends of this one they will get a notification

19
00:01:24,860 --> 00:01:27,050
saying that you found the direction.

20
00:01:27,050 --> 00:01:30,980
Any other thing it tells them that they have to try again.

21
00:01:31,010 --> 00:01:37,610
Now in my example only thing that really matters is that the direction you could actually expand on

22
00:01:37,610 --> 00:01:44,630
this and make it in a way that it has to start from this point or somewhere near this point and be on

23
00:01:44,630 --> 00:01:46,180
the right direction.

24
00:01:46,190 --> 00:01:51,110
So that's what you're going to do is going to be a slightly longer piece of code but I think it really

25
00:01:51,110 --> 00:01:56,530
helps you understand and master everything that is out there about your gestures.

26
00:01:56,640 --> 00:02:02,690
With that let's go ahead and get this thought that I'm going to go to explore to start a new project

27
00:02:03,520 --> 00:02:11,060
called it costs just shows and the first thing I'm going to do is I'm going to add my interface items

28
00:02:11,570 --> 00:02:17,300
so I have a label up there that's going to be my result.

29
00:02:17,320 --> 00:02:21,640
But it shows us how well or use or how I was done.

30
00:02:21,920 --> 00:02:27,220
So that's my result to label make the link.

31
00:02:27,240 --> 00:02:32,450
Now it's really quickly that is the result.

32
00:02:32,450 --> 00:02:41,290
I have a you I view which my YOU view is essentially where your user can play the game.

33
00:02:41,320 --> 00:02:44,070
So that's the playable area essentially.

34
00:02:44,450 --> 00:02:53,220
And we have a button this then redraws different items to start and end.

35
00:02:53,320 --> 00:03:00,370
So now I'm going to say read the roll and read the are always going to be maybe like that.

36
00:03:00,490 --> 00:03:03,800
I'm going to make the bag you're on to have a slightly different color.

37
00:03:03,940 --> 00:03:06,610
So you can see everybody else.

38
00:03:06,730 --> 00:03:09,120
I have another label.

39
00:03:09,340 --> 00:03:14,450
This is going to have a different color such as this.

40
00:03:14,560 --> 00:03:22,270
I just call this thought and I have another label and this one actually says and

41
00:03:25,190 --> 00:03:27,650
let's go ahead and are these outlets

42
00:03:34,090 --> 00:03:38,180
so this is going to be resolved later.

43
00:03:38,720 --> 00:03:42,640
This is going to be a view.

44
00:03:44,430 --> 00:03:49,420
This is going to be a start labeling.

45
00:03:50,630 --> 00:04:03,260
This is going to be an down this one is going to be a read the role action that's about that.

46
00:04:03,270 --> 00:04:06,530
That's all we need to have in our storyboard.

47
00:04:06,570 --> 00:04:12,540
So the school had to view controller when a format is a little bit better because I know that you know

48
00:04:12,540 --> 00:04:16,430
we're going to have a lot of code to write action.

49
00:04:16,710 --> 00:04:18,300
And this is our view that a lot.

50
00:04:18,320 --> 00:04:20,970
Maybe I'll clean that up as well.

51
00:04:21,450 --> 00:04:24,530
And I need to have a few other things as well.

52
00:04:24,540 --> 00:04:30,330
One of them is that I need to add a new class that is going to be my actually my gesture recognizes

53
00:04:30,360 --> 00:04:32,440
something to say class.

54
00:04:32,460 --> 00:04:39,250
So I'm going to call it my my classroom gestures my costume gestures.

55
00:04:39,450 --> 00:04:43,340
And it's a subclass of your gesture recognize.

56
00:04:43,680 --> 00:04:45,220
So that's one.

57
00:04:45,510 --> 00:04:51,610
And then in my view controller I'm going to have to get one of those and use some of those.

58
00:04:51,660 --> 00:05:01,320
So I'm going to say wow my simple gesture that's going to be just sure that's going to be of the type.

59
00:05:01,320 --> 00:05:04,180
My costume just show i hate myself.

60
00:05:04,470 --> 00:05:10,690
I need to have two locations because we need to be able to randomly place these two.

61
00:05:10,920 --> 00:05:19,950
So I'm going to get to C.G. point for those that say route points one that's going to be a CGU point

62
00:05:20,120 --> 00:05:24,100
and I'm going to have a point too.

63
00:05:24,340 --> 00:05:27,690
And that's going to be a CGU point as well.

64
00:05:28,050 --> 00:05:34,050
And the next thing I want to do is I want to be able to redraw these two labels every given time that

65
00:05:34,050 --> 00:05:34,590
they needed.

66
00:05:34,590 --> 00:05:37,790
So I'm going to go to read the wrong action and you might read the raw.

67
00:05:37,830 --> 00:05:39,240
Essentially you have to do this.

68
00:05:39,240 --> 00:05:44,620
I have to say it starts labor data center to become something new value.

69
00:05:44,670 --> 00:05:52,320
And I have to say and the label DOD Center to become some of you value you and those new values you

70
00:05:52,350 --> 00:05:55,970
have to essentially produce them randomly.

71
00:05:55,980 --> 00:06:03,720
So I'm in here and say Let's first make a random location for each of these two numbers.

72
00:06:03,810 --> 00:06:12,000
So let's first produce a Rand on location for point 1 and point 2 simply because these two points are

73
00:06:12,000 --> 00:06:18,600
the direction we have to go through and also are there these two should be placed that's and that's

74
00:06:18,600 --> 00:06:20,720
going to be a little bit of a long record.

75
00:06:20,730 --> 00:06:21,980
But bear with me.

76
00:06:22,050 --> 00:06:35,020
So I say let around X let's make that become an arc for random uniform with an upper bound of the roll

77
00:06:35,030 --> 00:06:46,130
view dot frame that size that at the moment you do that you will end up getting an arrow and that arrow

78
00:06:46,170 --> 00:06:53,450
is it's essentially because the type of the variable here is not the same as what the function is expecting.

79
00:06:53,460 --> 00:06:57,090
This happens a lot on an escort and you get a different kind of Arrow.

80
00:06:57,090 --> 00:07:04,450
The arrow says the type of file is ambiguous without more context simply because it can not translate

81
00:07:04,450 --> 00:07:06,210
it to the type of function.

82
00:07:06,210 --> 00:07:12,960
Most often when you when you have this kind of error it's the type of Marybel is not the same as the

83
00:07:12,960 --> 00:07:14,240
function is asking.

84
00:07:14,400 --> 00:07:17,190
So don't fix that at least in this very instance.

85
00:07:17,220 --> 00:07:24,510
I'm going to say well let's do a you end tested two which is what you expect of this right.

86
00:07:24,510 --> 00:07:30,520
You don't get myself a little bit more space because I still need to write quite a bit of code.

87
00:07:30,840 --> 00:07:37,990
So now we got a Orrick for random but that's a random value is a you incertitude itself.

88
00:07:37,990 --> 00:07:45,070
So if I wanted my random x to be essentially a CEG float which is what I want it to be.

89
00:07:45,170 --> 00:07:50,900
This is not going to give us an error because it's going to say one side of this equation is a you inserted

90
00:07:50,930 --> 00:07:58,440
to the other side is a C.G. float on the suggestion that the House is to essentially cast this value

91
00:07:58,530 --> 00:08:00,050
into a C.G. flawed.

92
00:08:00,240 --> 00:08:04,710
But just let me get myself a little bit more spaces then.

93
00:08:04,950 --> 00:08:12,870
And now what we have is we have a CGI float value all of this random location which is based on the

94
00:08:12,870 --> 00:08:14,780
vet of the droll view.

95
00:08:14,790 --> 00:08:19,890
So we got the X taken care of and I don't need to have this explicit notation.

96
00:08:20,000 --> 00:08:25,850
And in the interest of saving a space I'm actually going to remove it because we know it is a C.G. float.

97
00:08:26,220 --> 00:08:28,680
So now I'm going to get the same thing.

98
00:08:29,100 --> 00:08:31,770
It say this is why.

99
00:08:32,040 --> 00:08:41,610
And this is height and obviously then when I play both of these to make my point one so point one becomes

100
00:08:41,700 --> 00:08:56,130
a point of these two value random x and random Y and my start label can essentially be at point 1.

101
00:08:56,130 --> 00:08:59,910
So I start laborer's center goes and point 1.

102
00:08:59,910 --> 00:09:03,510
Now we have to read this process once again.

103
00:09:03,620 --> 00:09:08,230
Four point two and that's going to help us with the Enderley but.

104
00:09:08,260 --> 00:09:11,140
So I'm going to go ahead and say let's copy most of these.

105
00:09:11,140 --> 00:09:14,080
One more time again.

106
00:09:14,200 --> 00:09:16,600
This time we don't need to do the left part.

107
00:09:16,600 --> 00:09:22,660
And we actually have to convert these two into variables because you're trying to change them and we

108
00:09:22,660 --> 00:09:25,560
are redoing the random generation again.

109
00:09:25,720 --> 00:09:29,790
Remember if we did it once the boss of these will be at the same point.

110
00:09:29,950 --> 00:09:34,370
But since we do it once and replace the first label then we do either.

111
00:09:34,420 --> 00:09:39,420
And if it breaks the next label they end up being at the right spot.

112
00:09:39,430 --> 00:09:51,910
So next one is going to be point two which is going to be a CGU point of these two locations run X and

113
00:09:51,920 --> 00:09:53,140
run.

114
00:09:53,800 --> 00:10:00,830
And of course the center of the end the table becomes point to so if it all works well by now we should

115
00:10:00,830 --> 00:10:07,460
have an app that when we run it every time we press the reader or button it redraws to new locations

116
00:10:07,460 --> 00:10:11,250
for our labels for the locations of the labels.

117
00:10:11,270 --> 00:10:15,120
I should mention that I didn't really icons for the borders.

118
00:10:15,140 --> 00:10:22,210
If you want to be super careful about it you can make sure that they never go in and out of the view.

119
00:10:22,340 --> 00:10:25,410
But for now I think they can just live with this.

120
00:10:25,430 --> 00:10:30,870
So now every time I first read all but then I get to new locations for a start.

121
00:10:30,920 --> 00:10:37,240
And so now we have these two taken care of and I'm going to have to move on with my actual gesture.

122
00:10:37,490 --> 00:10:39,800
So retro action is taken care of.

123
00:10:39,920 --> 00:10:47,810
Let me fall that forward and now I'm going to go to my view that lot to add gesture to let's say my

124
00:10:47,810 --> 00:10:51,610
simple gesture is my custom gesture.

125
00:10:51,800 --> 00:10:58,880
And that's going to have a target that's the default superclass in it from you or just your recognizer.

126
00:10:58,970 --> 00:11:06,910
I'm going to say target itself and the action is let's say a select four for something called just sheer

127
00:11:07,130 --> 00:11:09,220
action which you don't have yet.

128
00:11:09,380 --> 00:11:16,420
So I'm going to say let's add that function gesture action and that's that.

129
00:11:16,530 --> 00:11:20,160
And it has to be exposed through Objective-C.

130
00:11:20,250 --> 00:11:29,030
And once I have that I'm going to go ahead and say well draw a view does I just show recognizers and

131
00:11:29,040 --> 00:11:33,090
then just say I want to add is my simple gesture.

132
00:11:33,240 --> 00:11:39,350
Now let's see what we need for or just to actually do for us what we need to do is this.

133
00:11:39,360 --> 00:11:54,180
I'm going to write them as comments find the angle between points 1 and to find the angle between starting

134
00:11:54,450 --> 00:11:57,100
and ending points.

135
00:11:57,400 --> 00:12:02,060
All that just share and compare them against each other.

136
00:12:02,060 --> 00:12:07,000
So we have to find the angle between the two points which are essentially these two guys.

137
00:12:07,000 --> 00:12:12,520
If you have to find the angle between where the mouse is moving then we have to compare them.

138
00:12:12,570 --> 00:12:18,210
If it was within a certain tolerance acceptable value it means our user has done well.

139
00:12:18,360 --> 00:12:22,340
If not it means our user has essentially messed it up.

140
00:12:22,500 --> 00:12:28,290
So to do that I'm going to first go through my gesture because we're just sure we need to have this

141
00:12:28,290 --> 00:12:29,010
thing.

142
00:12:29,010 --> 00:12:35,550
The angle between a starting and ending point which is not a difficult thing from any gesture.

143
00:12:35,550 --> 00:12:38,480
So we have to you have to build that ourselves.

144
00:12:38,580 --> 00:12:45,110
So I'm going to go ahead to my gesture in here my gesture class and what I say I need some valuables.

145
00:12:45,150 --> 00:12:53,650
First of all I need an anger and I'm going to say that is a C.G. float is the default value of zero.

146
00:12:53,670 --> 00:12:57,770
The next thing is I need to find the starting and the ending point.

147
00:12:57,780 --> 00:13:08,700
So I'm going to say that the starting point that's going to be a CGU point and ending point that's going

148
00:13:08,700 --> 00:13:11,200
to be a C.G. point as well.

149
00:13:11,650 --> 00:13:17,810
Now every should recognize that can override that to the main touch functions.

150
00:13:17,860 --> 00:13:20,700
So I'm going to say touches began.

151
00:13:20,910 --> 00:13:23,550
That's one of the functions we're going to use.

152
00:13:23,600 --> 00:13:25,890
And let me reformat it properly.

153
00:13:26,160 --> 00:13:27,650
I need touches.

154
00:13:27,650 --> 00:13:36,570
Move that's another one you're going to use the imagery for my dad when I was a mess myself.

155
00:13:36,600 --> 00:13:44,110
Get myself a little better space and touches and and soon you will see that most of the code that you

156
00:13:44,110 --> 00:13:46,560
have to write it is actually very simple.

157
00:13:46,780 --> 00:13:49,170
So the simple parts are these.

158
00:13:49,240 --> 00:13:58,540
The starting point becomes touches on that first that location in view.

159
00:13:58,840 --> 00:14:04,650
So now we got the very first point based on where the touch began.

160
00:14:04,810 --> 00:14:09,210
Then you get the ending point in touches and that touches on that.

161
00:14:09,210 --> 00:14:13,090
I'm going to say that is exactly the same thing as before.

162
00:14:13,100 --> 00:14:20,490
First location in view view and the view refers to the default view of the gesture.

163
00:14:20,620 --> 00:14:26,170
And since we are only applying it to one of you it doesn't matter for us.

164
00:14:26,170 --> 00:14:31,550
Otherwise you could actually have a custom in it to take care of this part for yourself.

165
00:14:31,600 --> 00:14:34,210
So that's taken care of.

166
00:14:34,210 --> 00:14:41,290
Then the next thing is this you have to find this angle between these two different locations for a

167
00:14:41,350 --> 00:14:43,890
starting point and the ending point.

168
00:14:43,930 --> 00:14:47,920
And more importantly we have to set the estate of the gesture.

169
00:14:48,130 --> 00:14:50,370
So I'm going to say that touches begin.

170
00:14:50,470 --> 00:14:59,280
We're going to say a state is going to be you I gesture recognize that the state DOT began.

171
00:14:59,320 --> 00:15:03,450
So our gesture is now active.

172
00:15:03,580 --> 00:15:05,930
They didn't yet didn't.

173
00:15:06,280 --> 00:15:14,260
And then in the touchiest and that I'm going to say well a state is going to be you I just should recognize

174
00:15:14,510 --> 00:15:15,750
the state DOT.

175
00:15:15,830 --> 00:15:23,470
And so now we know where it begins and where it ends and everything in between is the move part which

176
00:15:23,470 --> 00:15:26,350
we really haven't done anything about it just yet.

177
00:15:26,350 --> 00:15:34,090
Now let's go ahead and count the actual angles between various thought that and where we ended the first

178
00:15:34,090 --> 00:15:39,290
thing I'm going to do is I'm gonna assume my Usenet is going to run this several times.

179
00:15:39,370 --> 00:15:44,210
So every time that they begin I'm going to set the angle to zero.

180
00:15:44,590 --> 00:15:46,320
When I say angle is zero.

181
00:15:46,390 --> 00:15:48,660
Every time the touch begins.

182
00:15:48,670 --> 00:15:51,810
So over time at the very beginning we don't have any anger.

183
00:15:52,120 --> 00:15:59,260
Every time the touch ends and the estate ends squarehead and say anger and just a bit of a mathematical

184
00:15:59,260 --> 00:16:02,220
formula I think I've mentioned it somewhere else as well.

185
00:16:02,290 --> 00:16:04,510
If you don't know it it doesn't really matter at all.

186
00:16:04,510 --> 00:16:05,530
I don't know it either.

187
00:16:05,530 --> 00:16:07,470
I went online and I Googled it.

188
00:16:07,630 --> 00:16:09,610
So it becomes an arctangent.

189
00:16:09,620 --> 00:16:16,110
Two of the defense of the voices on the defense of the excess.

190
00:16:16,270 --> 00:16:23,730
So essentially ending point dot y minus the starting point.

191
00:16:23,920 --> 00:16:35,500
That's why the next argument of it is going to be ending point dot X minus a starting point DOT takes

192
00:16:35,770 --> 00:16:37,570
and that's all there is to it.

193
00:16:37,570 --> 00:16:45,420
So this formula is going to calculate the angle for us and it has an error for me for some reason.

194
00:16:45,500 --> 00:16:52,800
MC What does it say ending point value of as you point has no number.

195
00:16:55,530 --> 00:16:56,810
Varies.

196
00:16:57,420 --> 00:16:59,190
Oh OK.

197
00:16:59,370 --> 00:17:03,770
So why not to say that that was my dad.

198
00:17:04,050 --> 00:17:06,030
And yeah that's about it.

199
00:17:06,030 --> 00:17:12,280
So we now can calculate Yangon before I move one to actually test this out.

200
00:17:12,300 --> 00:17:15,030
I want to show you a very very simple way.

201
00:17:15,030 --> 00:17:21,630
Another very very bright way to be honest for showing the direction where your user is actually drawing.

202
00:17:21,630 --> 00:17:23,220
Here is my strategy.

203
00:17:23,220 --> 00:17:32,400
Hear me out when I begin moving for every word I move I draw a little you I view with the color red.

204
00:17:32,820 --> 00:17:40,410
So every time I start moving for every where my mouse goes or my top goes I draw a little box and that

205
00:17:40,410 --> 00:17:45,600
box is going to be added to this view and at the end I'm going to remove them.

206
00:17:45,600 --> 00:17:48,870
So when the touch ends I'm going to get rid of them.

207
00:17:48,990 --> 00:17:50,610
So let's see how we'll do that.

208
00:17:50,640 --> 00:18:01,410
And yet in my gesture save valuable temp boxes it's going to be an array of views and it is going to

209
00:18:01,410 --> 00:18:03,310
be empty by default.

210
00:18:03,330 --> 00:18:09,700
So these are the temp boxes or templates call them temp guides better name.

211
00:18:10,020 --> 00:18:15,660
So every time we go toothaches moved and that has nothing to do with the touches began or that just

212
00:18:15,700 --> 00:18:18,230
ended on the touch has moved.

213
00:18:18,270 --> 00:18:22,820
I'm going to say Let let's call it this guy.

214
00:18:23,080 --> 00:18:32,710
I'm going to make it a new high view of you I view with that frame and that frame is going to be 0 0

215
00:18:32,830 --> 00:18:37,500
and of itself may be five on five not this number that don't really matter.

216
00:18:37,540 --> 00:18:45,170
I'm going to say this guy will have a background color of white color red.

217
00:18:45,280 --> 00:18:50,570
So it is quite distinctive and this the most important part of it.

218
00:18:50,560 --> 00:18:58,390
That sensor is and touches that first dot location in view.

219
00:18:58,720 --> 00:19:07,900
So we place them exactly where our touch is currently on this location is obviously optional so we have

220
00:19:07,900 --> 00:19:11,710
to force on it to make sure that it actually exists.

221
00:19:11,950 --> 00:19:18,220
And then I'm going to say view that our sub view Guide to it.

222
00:19:18,220 --> 00:19:24,110
So now we end up adding so many guides to our view.

223
00:19:24,120 --> 00:19:26,800
But we should also have a way of removing them.

224
00:19:26,920 --> 00:19:28,730
And that's why I have that array.

225
00:19:28,810 --> 00:19:34,970
So I'm going to say temp guides that append guide.

226
00:19:35,500 --> 00:19:41,950
So this way we end up making sure that we have a store them somewhere and we can get rid of them.

227
00:19:41,950 --> 00:19:43,680
So when do we want to get rid of them.

228
00:19:43,720 --> 00:19:54,890
Obviously when the touches and so vendor touches and I'm going to say well for any in temp guides do

229
00:19:54,920 --> 00:20:01,250
this any DOT to remove it from Super of you.

230
00:20:01,420 --> 00:20:07,570
So anyone in the temp guide which is it all the guys that are currently stuck to the view they removed

231
00:20:07,570 --> 00:20:08,910
them from SuperValu.

232
00:20:09,070 --> 00:20:15,250
Once you did that say temp Kite's is empty again.

233
00:20:17,090 --> 00:20:17,720
OK.

234
00:20:17,830 --> 00:20:19,050
A lot of code.

235
00:20:19,060 --> 00:20:25,040
So by now we should be able to see at least these guys.

236
00:20:25,040 --> 00:20:29,830
So that's a good thing because it kind of gives me a little bit of confidence that I'm doing the right

237
00:20:29,830 --> 00:20:30,220
thing.

238
00:20:30,250 --> 00:20:32,880
Having the visual feedback usually.

239
00:20:33,220 --> 00:20:39,880
So now if I do that's perfect he's actually showing me that I'm actually drawing something at least

240
00:20:40,170 --> 00:20:42,970
whether it is in the right direction or the wrong direction.

241
00:20:42,970 --> 00:20:46,880
I don't know that much just yet but that will figure it out real soon as well.

242
00:20:47,020 --> 00:20:52,860
So to get us started with that let's go ahead to or just share function which is here.

243
00:20:52,930 --> 00:21:01,480
And I'm going to say that's print's two values one value is the direction between the two points which

244
00:21:01,480 --> 00:21:06,020
we have to calculate and the other one is the one that our gesture has produced.

245
00:21:06,100 --> 00:21:14,290
So I'm going to say let's just call this one current angle and that's going to be arctangent to very

246
00:21:14,290 --> 00:21:16,320
similar to the one we had before.

247
00:21:16,570 --> 00:21:29,790
Of point to remember this one ending point point two to y minus point 1 that Y and the other side effect

248
00:21:29,830 --> 00:21:36,570
is going to be pointed to that X minus point 1 that x.

249
00:21:36,760 --> 00:21:43,300
So that is going to be the angle currently presented between these two points.

250
00:21:43,520 --> 00:21:47,030
And then we also have a point 1.

251
00:21:47,050 --> 00:21:49,500
I don't know why I constantly make this mistake.

252
00:21:49,900 --> 00:21:56,370
And then we have the angle that we received from our gesture being recalled called my simple gesture.

253
00:21:56,650 --> 00:21:58,180
So I'm going to print some values.

254
00:21:58,210 --> 00:22:06,970
I'm going to save prints and in the print I'm going to say a triple quotation marks for largest string

255
00:22:07,110 --> 00:22:08,040
essentially.

256
00:22:08,400 --> 00:22:15,590
And in a year I'm going to say I have these one of them is going to be current.

257
00:22:15,640 --> 00:22:27,100
I'm going to ease up on the value for it is Koren's anger and then I'm going to say gesture anger is

258
00:22:27,820 --> 00:22:30,820
my simple gesture don't anger.

259
00:22:31,300 --> 00:22:37,930
So we end up seeing both of these values and then we can find a way for essentially comparing them.

260
00:22:38,060 --> 00:22:42,580
If we had to find the angle between these two we found that we had to find the angle between the starting

261
00:22:42,580 --> 00:22:44,140
and the ending of the gesture.

262
00:22:44,180 --> 00:22:47,380
We found them the last part is comparing them.

263
00:22:47,540 --> 00:22:53,860
That's right again and once it comes up we should be able to draw on the screen and see the values of

264
00:22:53,860 --> 00:22:54,780
both of them.

265
00:22:54,790 --> 00:22:58,140
If that works it means doing a very good shape.

266
00:22:58,160 --> 00:23:04,700
So now everything crashed why do you think that happens now.

267
00:23:05,460 --> 00:23:10,590
This is something that began to study in Inform in advance like you know 15 sections from now.

268
00:23:10,590 --> 00:23:18,900
But for now if you go to your little debugger window it will tell you that Tuvalu is on point 1 and

269
00:23:18,900 --> 00:23:19,990
point two.

270
00:23:20,100 --> 00:23:27,180
No one has decided about them and that's simply because these tools are the default values and the default

271
00:23:27,180 --> 00:23:30,150
values are actually are nil.

272
00:23:30,150 --> 00:23:32,460
Nobody has actually defined them.

273
00:23:32,580 --> 00:23:38,310
They only get defined the very first time the redraw action is being pressed.

274
00:23:38,310 --> 00:23:44,240
So one of the solutions is we actually called the reader or once we go to view it lot.

275
00:23:44,280 --> 00:23:48,070
So in the view of the law I'm going to say you read the wrong search.

276
00:23:48,750 --> 00:23:55,040
And if we run the application now we should be able to see the values of most of these but I want to

277
00:23:55,040 --> 00:23:59,840
remind you that it's still something is not going to work the way we expected it.

278
00:23:59,880 --> 00:24:06,560
So as we run this we get so many just showing goals that are zero just showing below zero just trying

279
00:24:06,600 --> 00:24:07,200
to zero.

280
00:24:07,410 --> 00:24:10,980
And then sometime at the end we get an actual just showing.

281
00:24:11,190 --> 00:24:17,450
And the reason for that is this our actual angle gets calculated here.

282
00:24:17,590 --> 00:24:26,460
Venda touches and which is when the state of the gesture is and so in all just your function here you

283
00:24:26,460 --> 00:24:30,350
have to only do this when the gesture has ended.

284
00:24:30,510 --> 00:24:41,130
So I'm going to say if my simple just show this state is your ears you just should recognize the state

285
00:24:41,760 --> 00:24:44,100
state DOT in bed.

286
00:24:44,100 --> 00:24:49,080
This is the only time that we actually have to do this comparison.

287
00:24:49,230 --> 00:24:56,070
So let's try again and this time it will only happen when our touch ends which is essentially even the

288
00:24:56,070 --> 00:24:57,620
gesture ends.

289
00:24:57,690 --> 00:25:00,190
So now I let go.

290
00:25:00,190 --> 00:25:06,390
We see that and of course the two numbers are widely different than each other because one of them is

291
00:25:06,390 --> 00:25:12,030
going a hundred eighty degrees or three point one for something around the point number and the other

292
00:25:12,050 --> 00:25:14,450
direction I draw was on the top to bottom.

293
00:25:14,610 --> 00:25:19,650
But if I was something like that the numbers are kind of very very similar.

294
00:25:19,730 --> 00:25:21,380
And let's deal with that part.

295
00:25:21,380 --> 00:25:26,220
Now the opposite is going to be the easiest one in here in my gesture function.

296
00:25:26,220 --> 00:25:30,220
Let me get myself a little bit in space so I can only show you this one.

297
00:25:31,260 --> 00:25:34,060
So obviously you don't need any of the print values.

298
00:25:34,080 --> 00:25:39,090
What they need is some sort of a boundary or tolerance.

299
00:25:39,090 --> 00:25:50,600
I'm going to say let tolerance to be let's say point two and then in the end that state of all gesture

300
00:25:50,610 --> 00:25:55,240
recognizer I'm going to say let's find the difference between these two.

301
00:25:55,260 --> 00:25:59,510
The angle from the current one and the angle from the simple gesture.

302
00:25:59,580 --> 00:26:09,160
So I'm going to say let angular difference for instance that's going to become my simple gesture.

303
00:26:09,150 --> 00:26:13,100
Does anger minus current anger.

304
00:26:13,170 --> 00:26:15,750
So we're going to subtract these two from each other.

305
00:26:15,750 --> 00:26:21,840
Now here's something that you have to keep in mind that these two values could be could have a different

306
00:26:21,840 --> 00:26:22,700
signature.

307
00:26:22,710 --> 00:26:25,210
One of them could be positive.

308
00:26:25,210 --> 00:26:26,970
One of them would be negative.

309
00:26:26,970 --> 00:26:30,270
And because of that you have to get the absolute value of it.

310
00:26:30,330 --> 00:26:32,030
You have to get the difference between them.

311
00:26:32,050 --> 00:26:34,520
Irrelevant of the signature.

312
00:26:34,530 --> 00:26:40,250
And if that was the case only if he got there you know signature free value.

313
00:26:40,320 --> 00:26:47,160
I'm going to say if the angle difference was smaller than tolerance.

314
00:26:47,280 --> 00:26:53,550
So if the difference between these two Tango's was smaller than point two then that's what we want to

315
00:26:53,540 --> 00:26:54,200
do.

316
00:26:54,690 --> 00:27:02,290
So here I'm going to say if that was the case then we call this one resort label if I'm not wrong.

317
00:27:02,310 --> 00:27:03,530
Yes.

318
00:27:03,660 --> 00:27:15,160
So we're going to say result labeled that text is going to say you found that direction and resolve

319
00:27:15,400 --> 00:27:17,390
to label that bygones.

320
00:27:17,400 --> 00:27:19,010
Color becomes you.

321
00:27:19,090 --> 00:27:23,940
I mean anybody else.

322
00:27:23,940 --> 00:27:25,410
All the opposites happen.

323
00:27:25,400 --> 00:27:30,030
So in the else it says try again.

324
00:27:32,420 --> 00:27:35,200
And the gun becomes red house.

325
00:27:35,270 --> 00:27:41,330
Now there is a little error in here saying you're comparing a CGI float with a double.

326
00:27:41,360 --> 00:27:47,520
So the very simple solution is we make the tolerance to become a C.G. floaters.

327
00:27:47,780 --> 00:27:52,410
So everyone is now C.G. flawed and that should be perfect.

328
00:27:52,420 --> 00:27:54,020
Let's read on this application.

329
00:27:54,020 --> 00:27:57,110
Now we don't need to print anyone anymore.

330
00:27:57,410 --> 00:28:03,410
You only have to be able to see the direction and now it's the moment of the truth somewhere.

331
00:28:03,460 --> 00:28:10,380
All I want to get a better space perfect if I go from a start down there because God help me try again.

332
00:28:10,550 --> 00:28:15,640
If I go other way is going to say try again if I go from and to twist that says try again.

333
00:28:15,890 --> 00:28:21,950
If I go from a stock to and it says you found the direction if I to start from somewhere similar to

334
00:28:21,980 --> 00:28:25,250
and it's still good if I go further.

335
00:28:25,250 --> 00:28:26,030
It's bad.

336
00:28:26,180 --> 00:28:29,270
So you guys should decide about this tolerance on your own.

337
00:28:29,270 --> 00:28:33,140
How much is pointing to for you are worth it.

338
00:28:33,140 --> 00:28:39,460
And you can actually calculate the points to be point two multiplied by one hundred and eight divided

339
00:28:39,470 --> 00:28:40,920
by 2.1 four.

340
00:28:40,940 --> 00:28:43,040
So it's about 11 degrees.

341
00:28:43,040 --> 00:28:45,950
So it is a very narrow margin.

342
00:28:45,950 --> 00:28:48,260
I'd say point two is actually a good number.

343
00:28:48,440 --> 00:28:52,040
I came up with it randomly what I think is a good number that we found.

344
00:28:52,290 --> 00:29:00,120
So that's a lot that a complete custom gesture recognizer are benefiting from touches begin to move

345
00:29:00,140 --> 00:29:08,380
then in their methods and applying it on top of a draw you to find a specific direction.

346
00:29:08,390 --> 00:29:14,150
A lot of the things that you end up doing with custom gestures they end up being more about mathematics

347
00:29:14,150 --> 00:29:15,480
than programming.

348
00:29:15,530 --> 00:29:20,600
For instance if you want to find out if you use it is drawing something similar to a circle and then

349
00:29:20,630 --> 00:29:27,620
that essentially becomes a lot of mathematics finding sample points of where your user has clicked on

350
00:29:27,620 --> 00:29:29,270
trying to find the center.

351
00:29:29,270 --> 00:29:35,630
Establishing a center based on that and then based on that finding out if most of them are within the

352
00:29:35,780 --> 00:29:36,860
same vicinity.

353
00:29:36,860 --> 00:29:44,420
For instance a drawing like this would kind of be a circle but the drawing like this would not be characterized

354
00:29:44,480 --> 00:29:45,350
as a circle.

355
00:29:45,860 --> 00:29:47,710
And yeah that's about it.

356
00:29:47,720 --> 00:29:53,150
I hope you can manage this on your own and see you in the next lesson.