欢迎访问移动开发之家(rcyd.net),关注移动开发教程。移动开发之家  移动开发问答|  每日更新

HMS Core电商解决方案之商品3D商品展示,但图文商品展示由于色

来源: 开发者 投稿于  被查看 44497 次 评论:190

HMS Core电商解决方案之商品3D商品展示,但图文商品展示由于色


传统电商商品展示采用图文结合的形式,文案介绍产品的相关参数,搭配精美图片去吸引客户眼球。但图文商品展示由于色差、尺寸不符等原因,会让消费者产生图片和实物不一致的疑虑,且消费者需要消耗大量精力阅读和比较后才能做出购买决定。

随着互联网电商平台的不断完善,短视频逐渐成为商品展示的主流形式。通过拍短视频的形式可以多方位展示产品,让消费者在短时间内可以了解产品的参数和优势,极大提高了消费者的购物速度。但短视频展示的劣势在于,展示时间短且很难和消费者进行互动。

3D技术的发展赋予了电商行业最新的商品展示方式,3D模型可以360°全方位细节展示商品,让消费者更直观了解商品,增强他们对产品的信心。消费者还能隔着屏幕与商品产生互动,通过单指拖动来实现360度查看商品、自由放大查看高清细节,从而提高下单机率。

然而,目前效果佳的3D建模技术因其较高的成本而使得让广大开发者望而却步。

1.技术门槛高:专业人员加上深度相机等专业设备。

2.时间成本高:专业人员手动完成模型的制作渲染和调整。完成一个简单物体的低精度模型,工作量以小时起步,而高精度模型耗时更长。

3.耗费高:单个商品的专业建模成本高,平均价格达到上千元,复杂模型则更贵。

HMS Core的3D建模服务,助力轻松建模。用户只需使用普通的RGB相机,通过拍摄物体的不同角度图像,便可实现物体的3D几何模型和纹理的自动化生成,如在电商实物展示的场景,您可以通过此能力自动生成想展示商品模型,用于3D展示,用户可360°随心放大或缩小商品,查看商品细节,为用户提供差异化的购买体验。

3D物体建模能力由端云协同完成,端侧负责采集RGB图像,通过环绕物体拍摄多张图像,从而获取物体的不同角度图像,拍摄完毕后上传至云端实现3D物体建模。云端建模的流程及关键技术包括目标检测分割、特征检测与匹配、稀疏点云计算、稠密点云计算以及纹理重建等模块。

效果展示

以面包为例,只需环绕面包拍摄多张图像,即可得到一个逼真的面包3D模型。那这个功能是如何实现的呢?以下是详细的开发步骤。

开发前准备

  1. 配置集成的SDK包

在应用的build.gradle文件中,dependencies内添加3D建模服务的SDK依赖

// 3D Modeling Kit SDK
implementation 'com.huawei.hms:modeling3d-object-reconstruct:1.0.0.300'

  1. 配置AndroidManifest.xml

打开main文件夹中的AndroidManifest.xml文件,可以根据场景和使用需要,配置读取和写入手机存储以及相机权限,在前添加

<!-- 往sdcard中写入数据的权限 -->
<uses-permission android:name="android.permission.WRITE_EXTERNAL_STORAGE" />
<uses-permission android:name="android.permission.READ_EXTERNAL_STORAGE" />
<!-- 使用相机的权限 -->
<uses-permission android:name="android.permission.CAMERA" />

开发步骤

  1. 使用云侧服务的能力,需要使用“agconnect-services.json”里的api_key值,在应用初始化时通过api_key或者AccessToken来设置应用鉴权信息,AccessToken的优先级较高。两种方式均在应用启动时初始化设置一次即可,无需多次设置。

(1)通过setAccessToken方法设置AccessToken。

ReconstructApplication.getInstance().setAccessToken("your AccessToken");

(2)通过setApiKey方法设置api_key。当您在AppGallery Connect上注册应用时,会给您的应用分配api_key。


ReconstructApplication.getInstance().setApiKey("your api_key");

  1. 新建3D物体建模引擎并初始化,新建3D物体建模配置器。
// 新建3D物体建模引擎。
Modeling3dReconstructEngine modeling3dReconstructEngine = Modeling3dReconstructEngine.getInstance(context);
// 新建3D物体建模配置器。
Modeling3dReconstructSetting setting = new Modeling3dReconstructSetting.Factory()
    // 设置工作模式为图片模式。
    .setReconstructMode(Modeling3dReconstructConstants.ReconstructMode.PICTURE)
    // 设置贴图模式为普通模式或PBR模式。
    .setTextureMode(Modeling3dReconstructConstants.TextureMode.PBR)
    .create();
  1. 新建上传监听器回调,用于处理拍摄的物体图片上传结果。
private Modeling3dReconstructUploadListener uploadListener = new Modeling3dReconstructUploadListener() {
    @Override
    public void onUploadProgress(String taskId, double progress, Object ext) {
         // 上传进度。
    }
    @Override
    public void onResult(String taskId, Modeling3dReconstructUploadResult result, Object ext) {
         // 上传成功处理。
    }
    @Override
    public void onError(String taskId, int errorCode, String message) {
        // 上传失败处理。
    }
};

  1. 使用3D物体建模配置器初始化任务,并且给新建的3D物体建模引擎设置上传监听器,上传采集的图片数据。
// 使用3D物体建模配置器初始化任务(该接口需要在子线程中调用)。
Modeling3dReconstructInitResult modeling3dReconstructInitResult = modeling3dReconstructEngine.initTask(setting);
String taskId = modeling3dReconstructInitResult.getTaskId();
// 设置上传监听器。
modeling3dReconstructEngine.setReconstructUploadListener(uploadListener);
// 调用3D建模引擎的上传接口,上传采集的图片数据。
modeling3dReconstructEngine.uploadFile(taskId, filePath);
  1. 查询3D物体建模任务状态。
// 查询3D物体建模任务状态需要初始化任务处理类。
Modeling3dReconstructTaskUtils modeling3dReconstructTaskUtils = Modeling3dReconstructTaskUtils.getInstance(context);
// 调用查询接口获取3D物体建模任务状态(该接口需要在子线程中调用)。
Modeling3dReconstructQueryResult queryResult = modeling3dReconstructTaskUtils.queryTask(taskId);
// 获取建模任务状态。
int status = queryResult.getStatus();
  1. 新建侦听器回调,调用预览函数,预览3D模型
Modeling3dReconstructPreviewListener previewListener = new Modeling3dReconstructPreviewListener() {
    @Override
    public void onResult(String taskId, Object ext) {
        // 3D物体建模预览结果。
    }
    @Override
    public void onError(String taskId, int errorCode, String message) {
        // 预览错误回调函数。
    }
};
// 预览模型配置。
Modeling3dReconstructPreviewConfig config = new Modeling3dReconstructPreviewConfig.Factory().setTextureMode(Modeling3dReconstructConstants.TextureMode.PBR).create();
// 预览模型。
modeling3dReconstructEngine.previewModelWithConfig(taskId, context,config, previewListener);

  1. 新建下载监听器回调,用于处理3D物体建模模型文件的下载结果。
private Modeling3dReconstructDownloadListener modeling3dReconstructDownloadListener = new Modeling3dReconstructDownloadListener() {
    @Override
    public void onDownloadProgress(String taskId, double progress, Object ext) {
        // 下载进度。
    }    
    @Override
    public void onResult(String taskId, Modeling3dReconstructDownloadResult result, Object ext) {
        // 下载成功处理。
    }
    @Override
    public void onError(String taskId, int errorCode, String message) {
        // 下载失败处理。
    }
};

  1. 新建的下载配置项并将新建的下载监听器传入新建的3D物体建模引擎,下载重建成功的模型文件。
// 设置下载配置项。
Modeling3dReconstructDownloadConfig downloadConfig = new Modeling3dReconstructDownloadConfig.Factory()
    // 配置OBJ或glTF格式。
    .setModelFormat(Modeling3dReconstructConstants.ModelFormat.OBJ)
    // 配置普通或PBR模式。
    .setTextureMode(Modeling3dReconstructConstants.TextureMode.PBR)
    .create();
// 设置下载监听器。
modeling3dReconstructEngine.setReconstructDownloadListener(modeling3dReconstructDownloadListener);
// 调用3D物体建模引擎的下载接口,传入任务id,下载地址和下载配置项,下载模型文件。
modeling3dReconstructEngine.downloadModelWithConfig(taskId, savePath, downloadConfig);

完成以上步骤就可以在电商应用中实现3D建模能力,用手机就能快速给商品建立3D模型,感兴趣的开发者们可以马上动手体验!

除了商品3D建模和展示,HMS Core电商解决方案还提供了AR交互式购物能力,可实现商品试穿功能,为消费者创造虚拟与现实融合的购物体验,相关内容会在下一期进行详细讲解,敬请期待。

了解更多详情>>

访问华为开发者联盟官网
获取开发指导文档
华为移动服务开源仓库地址:GitHub、Gitee

关注我们,第一时间了解 HMS Core 最新技术资讯~

用户评论