鸿蒙(API 12 Beta6版)【ArkGraphics 3D资源创建以及使用】方舟3D图形

3D场景中资源类型主要包含以下几种:

  • 材质(Material): 材质是对场景中物体的光学物理性质的数学建模。在渲染计算的过程中,利用这些物理性质计算与光的相互作用,得到最终渲染的颜色。ArkGraphics 3D提供的材质类型基于PBR渲染,支持用户参照PBR渲染材质类型创建材质资源,得到预期的渲染结果。
  • 图片(Image): 图片本质上是上一个储存信息的二维内存块(buffer),用于储存3D渲染计算过程需要的相关信息,比如基础色、法线等等。ArkGraphics 3D提供基于png、jpg、ktx格式创建Image资源的能力,支持用户自定义需要的Image资源。
  • 着色器(Shader): 着色器是GPU上可以执行的一段程序,可以控制GPU执行哪些并行计算操作。AGP引擎提供的默认着色器实现了PBR渲染,开发者只需要指定对应的参数就可以完成不同的PBR渲染。ArkGraphics 3D支持开发者创建自定义的着色器,开发者可以通过自定义着色器自定义渲染计算过程,完全控制渲染计算流程,比如控制某物体不受某光源的影响等。
  • 环境(Environment): 环境是3D场景背景的一种描述,可以基于图片进行创建。通过将一张图片进行正方体或者球体的映射处理,将图片贴在正方体或者球体上,在3D场景中模拟真实的环境。ArkGraphics 3D支持用户创建环境资源,定义3D场景的背景。
  • 动画(Animation): 3D中的动画资源用于创建三维场景可以运动的虚拟对象,例如人物、动物、车辆等。它们是构成3D场景的基本元素之一,为动画片、游戏、虚拟现实等领域提供了丰富的内容。

材质的创建及使用

材质的关键属性包括名字和类型,以此为输入可以创建材质。示例代码如下:

import { Image, Shader, MaterialType, Material, ShaderMaterial, Animation, Environment, Container, SceneNodeParameters,
  LightType, Light, Camera, SceneResourceParameters, SceneResourceFactory, Scene, Node } from '@kit.ArkGraphics3D';

function createMaterialPromise() : Promise<Material> {
  return new Promise(() => {
    let scene: Promise<Scene> = Scene.load($rawfile("gltf/CubeWithFloor/glTF/AnimatedCube.gltf"));
    scene.then(async (result: Scene) => {
      let sceneFactory: SceneResourceFactory = result.getResourceFactory();
      let sceneMaterialParameter: SceneResourceParameters = { name: "material" };
      // 创建材质
      let material: Promise<Material> = sceneFactory.createMaterial(sceneMaterialParameter, MaterialType.SHADER);
      return material;
    });
  });
}

着色器资源的创建及使用

着色器主要用于控制GPU计算,给开发者提供自定义渲染的能力,提高了3D渲染控制的灵活性。着色器资源的创建需要着色器资源的名字以及着色器在文件沙箱中的路径。着色器资源主要的使用场景是替换材质的着色器属性,给材质自定义渲染算法,达到灵活控制渲染过程的目的,示例代码如下:

import { Image, Shader, MaterialType, Material, ShaderMaterial, Animation, Environment, Container, SceneNodeParameters,
  LightType, Light, Camera, SceneResourceParameters, SceneResourceFactory, Scene, Node } from '@kit.ArkGraphics3D';

function createShaderPromise() : Promise<Shader> {
  return new Promise(() => {
    let scene: Promise<Scene> = Scene.load($rawfile("gltf/CubeWithFloor/glTF/AnimatedCube.gltf"));
    scene.then(async (result: Scene) => {
      let sceneFactory: SceneResourceFactory = result.getResourceFactory();

      // 创建SceneResourceParameters类型变量并以此创建shader
      let sceneResourceParameter: SceneResourceParameters = { name: "shaderResource",
        uri: $rawfile("shaders/custom_shader/custom_material_sample.shader") };
      let shader: Promise<Shader> = sceneFactory.createShader(sceneResourceParameter);
      shader.then(async (shaderEntity: Shader) => {
        let sceneMaterialParameter: SceneResourceParameters = { name: "material" };
        // 创建材质
        let material: Promise<Material> = sceneFactory.createMaterial(sceneMaterialParameter, MaterialType.SHADER);
        material.then(async (materialEntity: ShaderMaterial) => {
          // 绑定材质与shader
          materialEntity.colorShader = shaderEntity;
        });
      });
      return shader;
    });
  });
}

图片资源的创建及使用

3D场景中的图片资源是指GPU可以直接使用的图片资源。创建图片资源的关键参数包括图片资源的名字以及图片资源的路径。将图片资源应用到材质中作为材质属性,是常见的图片资源使用方式之一,示例代码如下:

import { Image, Shader, MaterialType, Material, ShaderMaterial, Animation, Environment, Container, SceneNodeParameters,
  LightType, Light, Camera, SceneResourceParameters, SceneResourceFactory, Scene, Node } from '@kit.ArkGraphics3D';

function createImagePromise() : Promise<Image> {
  return new Promise(() => {
    let scene: Promise<Scene> = Scene.load($rawfile("gltf/CubeWithFloor/glTF/AnimatedCube.gltf"));
    scene.then(async (result: Scene) => {
      let sceneFactory: SceneResourceFactory = result.getResourceFactory();
      let sceneImageParameter: SceneResourceParameters = { name: "image", uri: $rawfile("bricks.jpg") };
      // 创建Image
      let image: Promise<Image> = sceneFactory.createImage(sceneImageParameter);
      image.then(async (imageEntity: Image) => {
        let sceneMaterialParameter: SceneResourceParameters = { name: "material" };
        // 创建材质
        let material: Promise<Material> = sceneFactory.createMaterial(sceneMaterialParameter, MaterialType.SHADER);
        material.then(async (materialEntity: ShaderMaterial) => {
          // 利用创建的图片资源设置纹理属性
          if (materialEntity && materialEntity.colorShader) {
            materialEntity.colorShader.inputs["BASE_COLOR_Image"] = imageEntity;
          }
        });
      });
      return image;
    });
  });
}

环境资源的创建及使用

环境资源的创建需要指定名字以及图片或者glTF在文件沙箱中的路径,将环境资源设置到3D scene的environment属性,即可以将创建的环境资源设置为3D场景的背景环境。环境资源提供了diffuseFactor、specularFactor等的属性,支撑开发者对于环境资源属性进行控制。示例代码如下:

import { Image, Shader, MaterialType, Material, ShaderMaterial, Animation, Environment, Container, SceneNodeParameters,
  LightType, Light, Camera, SceneResourceParameters, SceneResourceFactory, Scene, Node } from '@kit.ArkGraphics3D';

function createEnvironmentPromise() : Promise<Environment> {
  return new Promise(() => {
    let scene: Promise<Scene> = Scene.load($rawfile("gltf/CubeWithFloor/glTF/AnimatedCube.gltf"));
    scene.then(async (result: Scene) => {
      let sceneFactory: SceneResourceFactory = result.getResourceFactory();
      let sceneEnvironmentParameter: SceneResourceParameters = { name: "env", uri: $rawfile("bricks.ktx") };
      // 创建Environment
      let env: Promise<Environment> = sceneFactory.createEnvironment(sceneEnvironmentParameter);
      env.then(async (envEntity: Environment) => {
        // 设置env相关属性
        envEntity.indirectDiffuseFactor.x = 1;
        envEntity.indirectDiffuseFactor.y = 1;
        envEntity.indirectDiffuseFactor.z = 1;
        envEntity.indirectDiffuseFactor.w = 1;
      });
      return env;
    });
  });
}

最后呢

很多开发朋友不知道需要学习那些鸿蒙技术?鸿蒙开发岗位需要掌握那些核心技术点?为此鸿蒙的开发学习必须要系统性的进行。

而网上有关鸿蒙的开发资料非常的少,假如你想学好鸿蒙的应用开发与系统底层开发。你可以参考这份资料,少走很多弯路,节省没必要的麻烦。由两位前阿里高级研发工程师联合打造的《鸿蒙NEXT星河版OpenHarmony开发文档 》里面内容包含了(ArkTS、ArkUI开发组件、Stage模型、多端部署、分布式应用开发、音频、视频、WebGL、OpenHarmony多媒体技术、Napi组件、OpenHarmony内核、Harmony南向开发、鸿蒙项目实战等等)鸿蒙(Harmony NEXT)技术知识点

如果你是一名Android、Java、前端等等开发人员,想要转入鸿蒙方向发展。可以直接领取这份资料辅助你的学习。下面是鸿蒙开发的学习路线图。

针对鸿蒙成长路线打造的鸿蒙学习文档。话不多说,我们直接看详细鸿蒙(OpenHarmony )手册(共计1236页)与鸿蒙(OpenHarmony )开发入门视频,帮助大家在技术的道路上更进一步。

  • 《鸿蒙 (OpenHarmony)开发学习视频》
  • 《鸿蒙生态应用开发V2.0白皮书》
  • 《鸿蒙 (OpenHarmony)开发基础到实战手册》
  • OpenHarmony北向、南向开发环境搭建
  • 《鸿蒙开发基础》
  • 《鸿蒙开发进阶》
  • 《鸿蒙开发实战》

总结

鸿蒙---作为国家主力推送的国产操作系统。部分的高校已经取消了安卓课程,从而开设鸿蒙课程;企业纷纷跟进启动了鸿蒙研发。

并且鸿蒙是完全具备无与伦比的机遇和潜力的;预计到年底将有 5,000 款的应用完成原生鸿蒙开发,未来将会支持 50 万款的应用。那么这么多的应用需要开发,也就意味着需要有更多的鸿蒙人才。鸿蒙开发工程师也将会迎来爆发式的增长,学习鸿蒙势在必行! 自↓↓↓拿

相关推荐
我是瓦力18 分钟前
PointNet++改进策略 :模块改进 | EdgeConv | DGCNN, 动态图卷积在3d任务上应用
人工智能·深度学习·计算机视觉·3d
繁依Fanyi1 小时前
828 华为云征文|华为 Flexus 云服务器搭建 PicGo 图床
服务器·华为·华为云
Mr.mjw3 小时前
项目中使用简单的立体3D柱状图,不用引入外部组件纯css也能实现
前端·css·3d
SuperHeroWu73 小时前
【HarmonyOS】Beta最新对外版本IDE下载和环境配置
ide·华为·harmonyos
沉迷单车的追风少年4 小时前
腾讯百度阿里华为常见算法面试题TOP100(3):链表、栈、特殊技巧
百度·华为·腾讯·阿里
SunriseSurfer4 小时前
华为发布大容量128TB SSD:空间利用率提升10倍
经验分享·华为
xq9527--4 小时前
鸿蒙next web组件和h5 交互实战来了
华为·harmonyos
PlumCarefree13 小时前
基于鸿蒙API10的RTSP播放器(八:音量和亮度调节功能的整合)
华为·ffmpeg·音视频·harmonyos
Android技术栈16 小时前
鸿蒙开发(NEXT/API 12)【使用fetchsync发送同步网络请求 (C/C++)】 远场通信服务
c语言·网络·c++·信息与通信·harmonyos·鸿蒙系统·openharmony
GIS数据转换器21 小时前
时空大数据平台:激活新质生产力的智慧引擎
大数据·人工智能·物联网·3d·gis