react-native - 使用 React 原生 ViroReact 像面部过滤器一样进行 Snap Chat

Question

我想制作理发应用程序，用户可以在其中使用增强现实技术尝试发型。我想使用 react native 构建应用程序，我发现在 react native 中只有 ViroReact 提供了 AR 功能。那么我们可以使用 ViroReact 来实现这个东西吗？如果没有，那我应该使用什么？

Answer 1

您可以利用 AR 平台提供的人脸追踪能力，协助应用实现用户与虚拟物体之间的自然交互。

这是 ViroReact 的文档。

华为为您提供React Native插件集成AR Engine，通过人脸识别、图形渲染、AR展示等能力接入产品（发型）AR试衣。

主要程序如下：

1. 创建一个继承自Activity的FaceViewActivity，并创建对应的布局文件。
2. 重写FaceViewActivity中的onCreate方法获取FaceView。
3. 为Switch创建一个监听器。开启 Switch后，调用loadAsset方法加载产品的 3D 模型。在LandmarkType中设置面部识别的位置。

mSwitch.setOnCheckedChangeListener(new CompoundButton.OnCheckedChangeListener() {
    @Override
    public void onCheckedChanged(CompoundButton buttonView, boolean isChecked) {
        mFaceView.clearResource();
        if (isChecked) {
            // Load materials.
         int index = mFaceView.loadAsset("FaceView/sunglasses.glb", LandmarkType.TIP_OF_NOSE);
        }
    }
});

4. 在MainActivity创建一个onBtnTryProductOn。当用户点击onBtnTryProductOn按钮时，会调用FaceViewActivity，让用户可以查看AR试衣效果。

您可以在Github上下载该插件。

有关更多详细信息，请参阅文档。