以前做商品展示页面，最常见的方式就是放几张照片。正面一张、侧面一张、背面再来一张。但如果用户想仔细看看商品的立体结构，这种展示方式就不够直观了。

随着HarmonyOS三维能力和空间计算相关技术的发展，开发者可以探索把3D模型直接放进应用界面。今天就从一个简单的模型展示页面开始，聊聊相关开发思路。

假设我们要开发一个背包商品展示页。普通版本只能显示商品图片，而3D版本希望实现：

• 展示背包的三维模型。
• 支持查看不同角度。
• 在模型旁边展示商品说明。

这个需求并不一定需要先开发复杂的3D引擎。对于支持相关能力的HarmonyOS开发环境，可以先了解ArkUI的Component3D组件。

首先先把模型加载出来，以一个简化的3D模型展示页面为例：

@Entry
@Component
struct Product3DPage {
  private scene: SceneOptions = {
    scene: $rawfile('bag.glb'),
    modelType: ModelType.SURFACE
  };

  build() {
    Column({ space: 16 }) {
      Text('背包3D展示')
        .fontSize(24)
        .fontWeight(FontWeight.Bold)

      Component3D(this.scene)
        .renderWidth('90%')
        .renderHeight('65%')

      Text('查看背包的立体结构')
        .fontSize(16)
    }
    .width('100%')
    .height('100%')
  }
}

这里的重点是SceneOptions和Component3D。

前者描述要加载的模型资源，后者负责在页面中展示三维内容。

示例假设项目已经准备好bag.glb资源，并且使用了支持相关组件的SDK。这里需要注意，具体导入、资源位置、组件接口及运行环境，需要根据当前HarmonyOS版本进一步确认。

确保模型显示正常的检查：

3D开发和普通页面开发有个明显区别：代码正确，不代表视觉效果就一定正确。例如，可能出现模型太小、方向不对、材质显示异常，甚至根本看不到模型。我优先检查下面几个问题：

1. 模型文件是否真正打包进项目。
2. 文件格式与当前加载能力是否匹配。
3. 模型比例、坐标和朝向是否合理。
4. 材质及贴图资源是否完整。
5. 运行设备是否支持所使用的三维能力。

尤其是模型资源，最好先用外部工具确认能够正常打开，再放到HarmonyOS项目中。否则很可能花大量时间排查代码，最后发现问题出在模型文件本身。

3DGS和普通3D模型有什么区别？

在HarmonyOS空间计算相关技术中，3DGS也是一个值得关注的方向。它利用高斯表示与渲染技术来重建和呈现三维场景，与传统的网格模型展示并不是同一套完整流程。例如，使用Component3D展示已有GLB模型，并不意味着自动完成了3DGS场景重建。

如果进一步探索3DGS端侧重建，需要研究对应的空间计算能力、数据采集、重建流程和设备支持条件。

3D能力其实可以应用在很多场景。例如商品展示、校园建筑介绍、教学模型、博物馆文物展示，甚至旅游景点预览。对于刚接触HarmonyOS空间计算的开发者，我建议先完成一个最简单的3D模型展示页面。等模型加载、显示和基础交互都没有问题之后，再逐步增加光照、动画、模型切换等功能。

先让一个模型成功出现在页面上，比一开始就追求复杂的3D效果更重要。当我们逐渐掌握这些基础能力，也就有机会把更多原本停留在二维界面中的创意，变成更加直观的三维体验。