三维 - 虚拟装束（仅限高级版，难度：2级）

creaticodeteacher2-mail

用到的相关知识

介绍

在这篇教程中，将在摄像头检测出的人脸上添加一个虚拟的帽子。

https://cdncreaticodecom.b-cdn.net/scratch-gui-projects/forum/30b85131-023c-4127-8e1e-050ec0d06069.gif" width="480" style="border-radius: 5px; border: 1px solid #29622d;">

第1步 - 加载一个“空”场景

请在创益编程游乐场新建一个项目，删除小狗角色“角色1”，然后在“空的1”角色中添加下列积木。

利用“三维场景”类别中的积木“创建三维场景”来加载“空”场景。

https://cdncreaticodecom.b-cdn.net/scratch-gui-projects/forum/013b9633-2e12-455d-ba68-dbbd4223012b.png" width="300" style="">

第2步 - 开启AR人脸摄像头

现在请开启AR人脸摄像头。先使用仿真模式，并且显示人脸标记。

https://cdncreaticodecom.b-cdn.net/scratch-gui-projects/forum/42d531c7-5e58-4b92-bf56-7705362df8f9.png" width="500" style="">

就会得到如下人脸标记：

https://cdncreaticodecom.b-cdn.net/scratch-gui-projects/forum/9d08a91f-aa3d-4b58-adbd-4499011d496e.gif" width="450" style="border-radius: 5px; border: 1px solid #29622d;">

第3步 - 添加帽子物体

接下来，我们利用积木“添加模型”添加一个帽子。因为头部高度大约为100，我们把帽子的目标高度设置为80。

https://cdncreaticodecom.b-cdn.net/scratch-gui-projects/forum/f7b8e6b5-6eaa-414d-94bc-b35d0d1f335e.png" width="400" style="">

当你运行程序时，会发现帽子离人脸标记较远。这是预料之中的，因为帽子被添加到场景原点，而人脸标记被添加到y坐标为300的位置。

https://cdncreaticodecom.b-cdn.net/scratch-gui-projects/forum/4515ce3b-9fe4-41c8-9fc1-7b629575dc8b.gif" width="480" style="border-radius: 5px; border: 1px solid #29622d;">

第4步 - 使帽子贴到人脸标记上

为了使帽子移到头部位置，我们可以让帽子依附到一个人脸标记点。例如，我们可以用“鼻梁”标记点。我们使用AR人脸摄像头时，人脸对象的名称总是为“ARHead”。一定要在下拉菜单中选择对应的角色，目标高度仍为80。

https://cdncreaticodecom.b-cdn.net/scratch-gui-projects/forum/c8e40230-76d3-41b6-b916-7e6a00ae792e.png" width="600" style="">

现在帽子移到了鼻梁标记点的上方。为了有助于大家分辨出哪个标记点是鼻梁，下方截图中显示为绿色。

https://cdncreaticodecom.b-cdn.net/scratch-gui-projects/forum/6353271f-f830-4046-bedc-db1690240ee4.gif" width="470" style="border-radius: 5px; border: 1px solid #29622d;">

第5步 - 旋转帽子

大家可能注意到了，帽子的方向不对。尖的一侧应当在前面。大家可以将帽子旋转180度：

https://cdncreaticodecom.b-cdn.net/scratch-gui-projects/forum/b9dc1b89-616c-44ad-a4b8-ce2ffd82543e.png" width="600" style="">

旋转帽子前后对比如下：

https://cdncreaticodecom.b-cdn.net/scratch-gui-projects/forum/88ecc7b8-0648-4622-8b43-837f960a084a.gif" width="480" style="border-radius: 5px; border: 1px solid #29622d;">

第6步 - 用真实摄像头测试

现在我们准备好了用真实摄像头测试程序。只需要隐藏标记并关闭仿真模式：

https://cdncreaticodecom.b-cdn.net/scratch-gui-projects/forum/4d98d426-d8a6-4e95-9332-489f40084a3f.png" width="600" style="">

现在帽子会跟踪人脸，但位置有些偏离：

https://cdncreaticodecom.b-cdn.net/scratch-gui-projects/forum/9dcc1168-8d21-4922-bfe4-2df9cb11dc69.gif" width="480" style="border-radius: 5px; border: 1px solid #29622d;">

第7步 - 移动并转动帽子

帽子看起来有3个问题。

第一，其位置太靠前、太低。我们要向后、向上移动。
第二，向上倾斜，我们要沿x轴向下旋转。
第三，有点小，我们要增加目标高度。

这个具体值应当因人而异。

https://cdncreaticodecom.b-cdn.net/scratch-gui-projects/forum/1dda4537-eb07-4f55-8763-1af9945f009d.png" width="600" style="">

现在帽子看起来真实多了：