增强现实 - 带遮挡的虚拟装束(仅限高级版,难度:3级)
-
用到的相关知识
介绍
在之前的一篇教程中,大家学习了如何在用户头上添加虚拟装束。
不过那个项目有个大问题,如果用户仰起头来,我们就能看到帽子的后边缘,看起来整个帽子就在人脸前面。
https://cdncreaticodecom.b-cdn.net/scratch-gui-projects/forum/da8fc6e3-2345-49c7-a043-2477ef9f947d.png" width="450" style="border-radius: 5px; border: 1px solid #29622d;">
在这篇教程中大家将学习如何解决这个问题。大体思路就是遮挡住装束的后边缘,这样看起来就好像被头挡住了。
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步 - 复制之前的虚拟装束项目
请打开“虚拟装束”教程的项目,保存一份副本。
第2步 - 切换至仿真模式
因为我们又回到编程上来,我们要开启仿真模式并显示标记。
https://cdncreaticodecom.b-cdn.net/scratch-gui-projects/forum/eed72523-003e-419a-afcc-f712c66844f9.png" width="1000" style="">
https://cdncreaticodecom.b-cdn.net/scratch-gui-projects/forum/6ae7c700-e7e4-4217-b8cd-fdc3ff03273f.gif" width="450" style="border-radius: 5px; border: 1px solid #29622d;">
第3步 - 添加一个椭球形表示人头
现在我们要用一些“技巧”。大体思路就是,添加一个三维物体来表示人头,用这个物体遮挡住帽子的后边缘。并且,这个物体应当是透明的,从而在最终结果中看不到它。尽管在现实世界中透明物体不能遮挡其他物体,但在虚拟世界中却可以实现。
首先,我们添加一个和人头形状差不多的椭球形。可以用一个球体,X/Y/Z三个维度分别为110/100/120,
https://cdncreaticodecom.b-cdn.net/scratch-gui-projects/forum/77506e2c-42df-4436-9f79-8727a9d6b9e2.png" width="1000" style="">
提示,我们要把这个椭球形命名为“头”,以便于后面根据名称选择。
目前得到如下结果:
https://cdncreaticodecom.b-cdn.net/scratch-gui-projects/forum/b69367b9-afa6-4baf-81fd-cbb23a46fb3b.gif" width="470" style="border-radius: 5px; border: 1px solid #29622d;">
第4步 - 移动椭球形以适配帽子
接下来,我们要移动椭球形以适配帽子。大家可以点击舞台窗口上方的“位置”控件,然后用箭头拖动椭球形。
https://cdncreaticodecom.b-cdn.net/scratch-gui-projects/forum/a91758c1-433e-497a-92e5-7ceda3358bf1.gif" width="470" style="border-radius: 5px; border: 1px solid #29622d;">
操作完成后,舞台下方的角色面板会显示位置,只需把位置信息填入积木“移动到( )”:
https://cdncreaticodecom.b-cdn.net/scratch-gui-projects/forum/7fd6d7db-8c06-4b10-833f-783364be1eee.png" width="1000" style="">
第5步 - 把椭球形用作透明遮挡
现在我们就用一个小技巧让帽子后边缘消失。用到的主要积木就是“转换为透明遮挡”,该积木有两个效果:
- 椭球形的头会变成透明的,那么我们就看不到它了。
- 物体被椭球形遮挡的部分仍然是被挡住的,就好像椭球形不是透明的。
为了实现这个效果,大家需要做两件事:
- 在最下面添加积木“转换为透明遮挡”,即可把椭球形转换为透明遮挡。
- 将积木“添加球体”移动到创建三维场景后面。这一步很重要,因为透明的椭球形只会遮挡住它后面添加的物体,包括帽子和人脸标记。
- 为了在添加帽子之后修改椭球形,需要用积木“选择( )作为角色物体”选中椭球形。
https://cdncreaticodecom.b-cdn.net/scratch-gui-projects/forum/378c3c1f-5464-4cb9-8641-8cee69997c45.png" width="1000" style="">
现在大家看到椭球形消失了,但是,当你转动人脸时,帽子和标记点被一个空的形状所遮挡:
https://cdncreaticodecom.b-cdn.net/scratch-gui-projects/forum/1ce41911-e24f-4d3f-8223-f17f664ea00b.gif" width="470" style="border-radius: 5px; border: 1px solid #29622d;">
第6步 - 用真实摄像头测试
现在我们准备好用真实摄像头测试程序了。大家只需要隐藏标记并关闭仿真模式:
https://cdncreaticodecom.b-cdn.net/scratch-gui-projects/forum/211e5857-25ff-47f2-812b-54c541266a51.png" width="1000" style="">
现在当帽子向后倾斜时,我们就看不到帽子后边缘了:
https://cdncreaticodecom.b-cdn.net/scratch-gui-projects/forum/570f4b86-214f-4447-9df4-3e8ec1ec7bfc.gif" width="300" style="border-radius: 5px; border: 1px solid #29622d;">
请大家调整帽子大小和椭球形,使帽子更适合自己的头。
创意扩展
这个“透明遮挡”方法也可用于其他虚拟物体。下面是一些创意思路供大家参考:
- 眼镜:大家可尝试戴上虚拟的遮阳镜,要遮挡住眼镜腿后部。
- 飞行的飞机:大家可以让一个飞机在头的周围飞行,当飞机飞到头后面时就要被遮挡住。
Hello! It looks like you're interested in this conversation, but you don't have an account yet.
Getting fed up of having to scroll through the same posts each visit? When you register for an account, you'll always come back to exactly where you were before, and choose to be notified of new replies (either via email, or push notification). You'll also be able to save bookmarks and upvote posts to show your appreciation to other community members.
With your input, this post could be even better 💗
Register Login