Now, in the last lesson, we implemented the touchesBegan method to detect when the user has touched a 1
position on the screen. And then we use hitTest to correspond that 2D touch position into a 3D position 2
and check to see if we touched an existingPlane. 3
And if so, then tell us we touched the plane. 4
Otherwise, just say that we touched somewhere else. 5
But now, instead of printing that out, let's instead print out the actual hitTest result. 6
So I'm gonna get rid of this 7
"if else" statement, but I still need to check to see if there actually was a result that came back and 8
that this value isn't nil if there actually was a hit test result that came back. So I'm gonna use 9
if let hitResult 10
= results, array, .first. 11
So if this is not nil, then we are going to print the hitResult. 12
All right. 13
So if we have a look in our console, we can see this ARHitTestResult printed in the console. And you 14
can see it's got a few components associated with it. 15
It's got something called localTransform which seems to have only a 2D position because the y 16
component is zero. But the other thing that it has is this thing called worldTransform and this seems 17
to have x, y, and z associated with it, 18
and this corresponds to that real world position on the plane that I tapped. 19
So we're going to use this position to place our dice. 20
So whereas previously, we created a vector that just position the dice anywhere we liked. 21
In this case, it was vertically in front of us, roughly horizontal to the camera, and then around 10 centimeters 22
in front of us. 23
In this case, we're going to position our diceNode exactly where the user tapped it 24
corresponding to that position in the real world on the plane using our hitTest. 25
So I'm going to cut these lines of code and I'm going to paste it in here and get rid of this 26
hitResult print. 27
And then, I'm going to uncomment all of this by hitting, of course, command forward slash. 28
And I also want to move it back a bit, 29
so I'm just going to hold down command and hit the left square bracket key on my keyboard, and that shifts 30
it left by two tabs. 31
All right. 32
So we are doing as we did before, we're creating a diceScene using our diceCollada.scn file and 33
we are creating a diceNode using that dice object inside the diceScene. And then we're going to give 34
it a position 35
and, of course, in this case, instead of just 0, 0, -0.1, we're going to give it the 36
real world position of the touch that's on the detected plane. 37
So I'm going to extend this out so that you can see it a little bit more clearly. 38
And I'm going to change the x from zero to hitResults.worldTransform.columns.3.x. 39
Now, when we printed hitResult earlier on, we saw what the worldTransform object was. 40
But what is this columns and what is 3, and what is x? 41
Well, worldTransform if you option click on it, is a four by four matrix of floats, 42
so that means four columns and four rows, and these four columns represent various things about the position 43
of the hitResults. 44
One of the columns corresponds to the scale, one of the columns corresponds to rotation, and the fourth 45
column corresponds to the position. 46
And if I just backtrack a little bit, when I say columns dot, you can see that I've got four options, so 47
0 is column one, 48
1 is column 2 because remember, of course, in computing, we always start counting from zero. 49
So in order to get the fourth column, I'm going to type columns.3, and then I'm going to tap into 50
the x component of that column which is the x component of the position of the hitTest result. 51
That is where we are going to place our dice. 52
And then I'm going to do the same for the y and the z. 53
So hitResults.worldTransform.columns.3.y. 54
And finally, hitResult.worldTransform.columns.3.z. 55
Okay. 56
And once we specify the position, finally, we're going to add the diceNode onto our sceneView, and we 57
should, hopefully, be able to see it when we tap onto our plane. 58
Now, you might notice that there's something slightly peculiar about our dice once it's positioned--once 59
it's positioned onto the plane. 60
And that is the fact that half of the dice is below the plane, but half of it is above the plane. 61
And why is that]? 62
Well, in our y position which describes how much elevation to give above the plane, we're using the position 63
of the plane. 64
Now, that means at the center of the dice is going to be placed flush with the plane that was detected, 65
and that's what's creating this half above and half below problem. 66
So all we need to do is just to add half of the height of the dice in order to raise it so that it sits 67
flush on the plane. And we can do that by tapping into the diceNode 68
and it has this property called boundingSphere. 69
And then, we can tap into its radius, which is around half of the width, which as you'll see will bring 70
our dice up onto the plane. 71
All right. 72
And there you have it. We are able to create our dice in 3D using our DiceCollada file and we can 73
place it onto the scene and have it be flushed with our plane, and look as if we're placing a real dice 74
onto the table by using augmented reality. 75
So in the next lesson, we're going to make it even more awesome by giving it some animations. As you can 76
see at the moment, when we place our dice onto the screen, 77
it simply just appears and stays there as it is. In the next lesson, I want to show you how easy it is to 78
add some animations to our diceNode, and make it spin and roll so that they all have different values 79
that are facing up, so we can use it like a real dice. 80
So I'll see you there.