Galacean Runtime 项目常见问题解决方案

Galacean Runtime 项目常见问题解决方案

runtime A typescript interactive engine, support 2D, 3D, animation, physics, built on WebGL and glTF. 项目地址: https://gitcode.com/gh_mirrors/ru/runtime

1. 项目基础介绍和主要编程语言

Galacean Runtime 是一个基于 TypeScript 的高性能实时交互式引擎，支持 2D 和 3D 图形渲染、动画、物理效果等。它旨在为开发者提供易于使用且轻量级的设计，通过组件系统来构建项目。该项目主要用于网页和移动端，支持 HTML5 和支付宝小程序。主要编程语言为 TypeScript。

2. 新手常见问题及解决步骤

问题一：如何安装 Galacean Runtime？

问题描述： 新手在使用 Galacean Runtime 时，不知道如何正确安装项目。

解决步骤：

1. 打开命令行工具（如终端或命令提示符）。
2. 使用 npm 命令安装 Galacean Runtime。命令如下：

   npm install @galacean/engine
   

3. 安装完成后，你可以在项目中通过以下方式引入整个引擎或单独的类：

   import * as GALACEAN from "@galacean/engine";
   // 或者
   import { Engine, Scene, Entity } from "@galacean/engine";
   

问题二：如何在项目中创建并使用场景？

问题描述： 新手在使用 Galacean Runtime 时，不知道如何创建和管理场景。

解决步骤：

1. 在你的 TypeScript 文件中，首先创建一个引擎实例：

   const engine = await WebGLEngine.create([canvas: "canvas-id"]);
   engine.canvas.resizeByClientSize();
   

2. 获取场景管理器并创建一个根实体：

   const scene = engine.sceneManager.activeScene;
   const rootEntity = scene.createRootEntity("Root");
   

3. 创建子实体，比如灯光和相机：

   const lightEntity = rootEntity.createChild("Light");
   const directLight = lightEntity.addComponent(DirectLight);
   lightEntity.transform.setRotation(-45, -45, 0);
   directLight.intensity = 1.4;
   
   const cameraEntity = rootEntity.createChild("Camera");
   cameraEntity.addComponent(Camera);
   cameraEntity.transform.setPosition(0, 0, 12);
   

问题三：如何为实体添加网格渲染器并显示一个球体？

问题描述： 新手在使用 Galacean Runtime 时，不知道如何为实体添加网格渲染器并显示一个基本的几何体。

解决步骤：

1. 创建一个子实体用于网格渲染器：

   const meshEntity = rootEntity.createChild("Sphere");
   

2. 为该实体添加网格渲染器组件：

   const meshRenderer = meshEntity.addComponent(MeshRenderer);
   

3. 加载一个球体模型（假设已经有模型资源），并将其赋值给网格渲染器。这里只是一个示例，实际操作中需要确保模型资源正确加载：

   // 假设 'sphere' 是一个已经加载的球体模型
   meshRenderer.mesh = sphere;
   

runtime A typescript interactive engine, support 2D, 3D, animation, physics, built on WebGL and glTF. 项目地址: https://gitcode.com/gh_mirrors/ru/runtime