0 1 00:00:00,890 --> 00:00:01,230 All right. 1 2 00:00:01,250 --> 00:00:06,990 So in the last lesson, we managed to put our dice onto the detected plane and make it flush with that 2 3 00:00:06,990 --> 00:00:07,770 plane. 3 4 00:00:07,770 --> 00:00:11,020 And look, as if we have a real dice on our table. 4 5 00:00:11,040 --> 00:00:16,470 So in this lesson, we're going to make it even more realistic by throwing down the dice and give it a 5 6 00:00:16,470 --> 00:00:23,250 rotational animation, so that our dice behaves like a real dice and gives us a random number that we 6 7 00:00:23,250 --> 00:00:24,510 will be able to use. 7 8 00:00:24,510 --> 00:00:31,620 So in order to roll the dice randomly, I will need some random numbers. And you might remember this when 8 9 00:00:31,620 --> 00:00:34,990 we did dice, one of the first apps that we built in this course, 9 10 00:00:35,100 --> 00:00:40,190 we were able to generate two random numbers that changed the face of two dice. 10 11 00:00:40,200 --> 00:00:48,120 Now, it's slightly more complicated in 3D, because in our case, we actually need to rotate our dice along 11 12 00:00:48,120 --> 00:00:58,560 two axis: the X axis and the z axis. So to do that, I'm going to create a random number called randomX 12 13 00:00:58,830 --> 00:01:09,120 and it's going to be equal to arc4random_uniform, and the upper bound is going to be 4 and shifted 13 14 00:01:09,210 --> 00:01:10,710 up by 1. 14 15 00:01:10,710 --> 00:01:18,000 Now, the reason is because I need to be able to rotate it along the x axis and have all four faces showing 15 16 00:01:18,000 --> 00:01:19,820 up equally likely. 16 17 00:01:19,830 --> 00:01:25,620 So that's why I'm using this line of code to create a random number between 1 and 4. 17 18 00:01:25,620 --> 00:01:32,490 Now, the next thing is I'm going to use the result of this random number generation and I'm going to 18 19 00:01:32,490 --> 00:01:37,230 multiply it by pi/2. 19 20 00:01:37,230 --> 00:01:44,310 Now, as you remember, we said before that half of pi is 90 degrees, and on our dice, every time we turn 20 21 00:01:44,310 --> 00:01:51,780 it 90 degrees, it means that we show a new face for the top of the dice which is exactly what we want. 21 22 00:01:51,840 --> 00:01:57,860 Now, X code is angry because arc4random_uniform, as you remember, creates a integer data type. 22 23 00:01:58,260 --> 00:02:00,290 It's in fact a UInt32. 23 24 00:02:00,330 --> 00:02:05,400 So we have to cast this into a Float for this to be able to work. 24 25 00:02:05,400 --> 00:02:10,110 So, now that we've created randomX, I'm going to go and create randomZ. 25 26 00:02:10,110 --> 00:02:17,700 So I'm going to use exactly the same code randomZ = arc4random_uniform, upper bound is 4, 26 27 00:02:18,450 --> 00:02:29,960 shifted up by 1, and then cast all of this into a Float and multiply it by half pi. 27 28 00:02:34,350 --> 00:02:38,290 So the next thing you might wonder is what about the y axis? 28 29 00:02:38,370 --> 00:02:42,160 Why are we not specifying a rotation for the y axis? 29 30 00:02:42,480 --> 00:02:43,530 Well, let me explain. 30 31 00:02:43,560 --> 00:02:49,740 Now, in order for my dice to be able to show all six faces, I need it to be able to rotate in the x axis, 31 32 00:02:50,460 --> 00:02:57,570 as well as the z axis, but I don't actually need it to rotate in the y axis because it won't change the 32 33 00:02:57,570 --> 00:02:59,400 face that's shown at the top. 33 34 00:02:59,580 --> 00:02:59,820 All right. 34 35 00:02:59,820 --> 00:03:05,780 So, now we've got our random degrees of rotation along the x and the z axis, 35 36 00:03:05,820 --> 00:03:12,510 all we need to do is just to run it as an animation, and SceneKit has the special method called runAction 36 37 00:03:12,510 --> 00:03:19,620 that we can use, and we're going to put it onto the diceNode that we've added onto the sceneView. And 37 38 00:03:19,620 --> 00:03:27,030 we're going to say diceNode.runAction, and we're going to use the simplest type where we just 38 39 00:03:27,030 --> 00:03:29,220 specify a SCNAction. 39 40 00:03:29,550 --> 00:03:36,900 So we're going to say SCNAction.rotateBy, and I'm going to specify the rotational angle on the 40 41 00:03:36,900 --> 00:03:42,630 x axis, the rotational angle on the y, the z, and the duration of this animation, 41 42 00:03:42,630 --> 00:03:51,180 so I'm going to choose this one. And I'm going to make this a little bit easier to see by formatting 42 43 00:03:51,180 --> 00:03:52,460 it like this. 43 44 00:03:52,560 --> 00:04:01,300 So the rotation on our x axis, we've already specified. It's randomX. Rotation on the y axis is going 44 45 00:04:01,300 --> 00:04:07,050 to be zero because it's not going to change our end outcome. And the rotation on the z axis is going 45 46 00:04:07,050 --> 00:04:10,550 to be randomZ. And the duration, 46 47 00:04:10,550 --> 00:04:12,530 let's just say, half a second. 47 48 00:04:12,560 --> 00:04:20,720 So let's use 0.5. And rotateBy is expecting CGFloats, whereas our randomX and randomZ 48 49 00:04:20,720 --> 00:04:23,210 are simply normal floats. 49 50 00:04:23,240 --> 00:04:25,670 So we can cast that into a CGFloat 50 51 00:04:30,690 --> 00:04:32,970 and do the same to randomZ. 51 52 00:04:37,880 --> 00:04:38,390 Okay. 52 53 00:04:38,390 --> 00:04:40,040 So shall we give it a spin? 53 54 00:04:40,550 --> 00:04:50,170 I hope you won't mind the pun. 54 55 00:04:50,370 --> 00:04:50,640 All right. 55 56 00:04:50,670 --> 00:04:51,990 So that wasn't bad, 56 57 00:04:52,090 --> 00:04:56,830 but don't you think that the rotation seemed a little bit too slow? 57 58 00:04:56,980 --> 00:05:03,790 So one way of doing this is we can actually decrease the duration of our animation. But, actually, if you 58 59 00:05:03,790 --> 00:05:11,080 think about it, the problem is that we're only rotating our dice with a random degree either by 90, 59 60 00:05:11,080 --> 00:05:20,850 by 180, 270, or 360 which at maximum is only one full 360 rotation. So that doesn't look like a spinning dice, 60 61 00:05:20,860 --> 00:05:21,520 right? 61 62 00:05:21,550 --> 00:05:30,280 So we can make this look a lot more realistic by simply multiplying of random angle by 5 or by 10 62 63 00:05:30,280 --> 00:05:38,380 if you really want it to be extreme. And this way, it means that we'll get 5 times 90, or 5 times 63 64 00:05:38,380 --> 00:05:44,740 180, or 5 times to 270, and we will still be able to generate all of the numbers on 64 65 00:05:44,740 --> 00:05:50,530 the dice, but we will go through many more revolutions during this animation and it'll look a lot more 65 66 00:05:50,530 --> 00:05:51,390 interesting. 66 67 00:05:51,400 --> 00:06:01,670 Let me show you. 67 68 00:06:01,830 --> 00:06:05,190 All right, so we're steadily making progress on our dice app, 68 69 00:06:05,210 --> 00:06:10,530 but I want to be able to roll all of the dice that I placed on the table with a single button, 69 70 00:06:10,640 --> 00:06:14,370 and I want to be able to roll the dice when I shake the app. 70 71 00:06:14,420 --> 00:06:16,860 So that's what we're gonna be tackling on the next lesson, 71 72 00:06:16,880 --> 00:06:17,660 so I'll see you there.