端侧操作系统图形2D粒子动效优化

本仓库为第二届中国研究生操作系统开源创新大赛，系统赛道“周四焦糖厚蛋挞队”的作品仓库。技术细节与详细测试见功能说明文档与测评视频。

开发及运行环境

开发工具：DevEco Studio v5.0.5 Release
操作系统：OpenHarmony 5.0.3，对应API能力级别为API 15 Release
开发及测试硬件设备：OpenHarmony开发者手机二代、Huawei Mate 70 Pro

粒子接口及使用方式

粒子接口说明

我们的粒子系统具有功能丰富，使用简单的特点，基本实现了OH原生粒子接口的所有功能，接口参数如下表：

参数名称	类型	说明
downsampling	number	降采样系数，1 为不降采样，控制粒子渲染时的分辨率降低。
shape.type	string	粒子发射器的形状类型，取值：Round（圆形）、Rectangle（矩形）、Line（线性）。
shape.center	number[2]	圆形发射器的中心点坐标（单位：像素）。适用于 Round 类型。
shape.radius	number	圆形发射器的半径（单位：像素）。适用于 Round 类型。
shape.l	number[2]	矩形或线性发射器的左上角坐标（单位：像素）。适用于 Rectangle 和 Line 类型。
shape.r	number[2]	矩形发射器的右下角坐标或线性发射器的右侧坐标（单位：像素）。适用于 Rectangle 和 Line 类型。
rate	number	每秒发射的粒子数量。
life	RValue<number>	粒子的生命周期（单位：毫秒）。可为常数或 [min, max] 随机范围。
size	TValue<RValue>	粒子的初始大小（单位：像素），支持动态变化（例如随时间渐变）。
weight	RValue<number>	粒子的重量，影响粒子受力的程度。可为常数或 [min, max] 随机范围。
type	ParticleType	粒子类型，Point 或 Image。Point 表示单点粒子，Image 表示图像粒子。
velocity.type	VelocityType	初始速度类型，取值：In（向内）、Out（向外）、Custom（自定义）。
velocity.speed	RValue<number>	粒子速度（单位：像素/秒），可为常数或 [min, max] 随机范围。
velocity.angle	RValue<number>	自定义粒子速度的角度（单位：度），可为常数或 [min, max] 随机范围，仅在 Custom 模式下使用。
color	TValue<RValue<number[4]>>	粒子的颜色变化，可定义渐变、曲线等时间曲线，RGBA 格式。
image	string	粒子使用的贴图路径，仅在 type 为 Image 时使用。

普通粒子使用示例

const config: EmitterConfig = {
  downsampling: 1,
  shape: {
    type: "Rectangle",
    l: [0, 0],
    r: [750, 1500]
  },
  rate: 200,
  count: 60 * 10000,
  life: 3 * 1000,
  size: {
    type: TValueType.Linear,
    spots: [15,25],
  },
  weight: 1,
  type: ParticleType.Point,
  velocity: {
    type: VelocityType.Custom,
    speed: 25,
    angle: 3.1415926 * 3 / 2
  },
  color: {
    type: TValueType.Linear,
    spots: [
      [0.3, 0.5, 0.0, 0.0],
      [0.3, 0.5, 0.9, 1.0]
    ]
  }
}

图片粒子使用示例

const config: EmitterConfig = {
  downsampling: 1,
  shape: {
    type: "Rectangle",
    l: [0, 0],
    r: [750, 1500]
  },
  rate: 100,
  count: 100 * 10000,
  life: 3 * 1000,
  size: {
    type: TValueType.Constant,
    spots: [20,20],
  },
  weight: 1,
  type: ParticleType.Image,
  velocity: {
    type: VelocityType.Out,
    speed: [20, 30]
  },
  color: {
    type: TValueType.Constant,
    spots: [
      [0,0,0,1],
      [0,0,0,1]
    ]
  },
  image: "egg_tart.png"
};

代码效果：

粒子运动场参数说明

我们同时实现了粒子运动场，方便开发者实现更真实的效果，其中包括引力场、恒力场、通用场。

场类型	参数名称	类型	说明
引力场 (Gravitation)	center	number[2]	引力中心点坐标（单位：像素）
	mass	number	引力质量/强度，正值表示吸引力，负值表示排斥力
	din	boolean	是否动态变化，true 表示引力中心会随时间变化
恒力场 (ConstantForce)	radian	number	力的方向（单位：弧度），0 表示向右，π/2 表示向下
	strength	number	力的大小/强度，影响粒子的加速度
通用场 (Field)	smoothness	number	场的平滑度，值越大场效应越平滑
	strength	number	场强度，控制场对粒子的影响程度

粒子场使用示例

// 创建引力场
const gravitation: Gravitation = {
  center: [500, 1000],  // 引力中心坐标
  mass: 1000,           // 引力强度
  din: false            // 静态场
};

// 创建恒力场  
const constantForce: ConstantForce = {
  radian: 0,           // 向右的力
  strength: 100        // 力的大小
};

// 创建通用场
const field: Field = {
  smoothness: 10,      // 平滑度
  strength: 100        // 场强度
};

// 添加到粒子系统
nativeRender.addGravitation('abc', gravitation);
nativeRender.addConstantForce('abc', constantForce); 
nativeRender.addField('abc', field);

**PS**：我们的粒子系统参数丰富，使用简单，效果惊艳！更多实现场景可见功能说明文档，无限创意场景等你实现！！！

万级粒子测试应用安装

为测试粒子性能，队伍开发了测试应用。该应用可以进行粒子发射速率、大小等基本参数设定，并可选择调用我们的粒子系统或OpenHarmony原生接口。下面介绍该测试应用的安装方式。

方式1 DevEco Studio安装

1. 将代码克隆至本地，使用DevEco Studio导入项目。
   
2. 打开File -> Project Structure -> Signing Configs进行签名。
   
3. 将设备通过数据线连接电脑，打开USB调试，选中设备，点击“Run”。
   

方式2 Hap包安装

1. 首先确保电脑可以正常运行hdc命令行工具。
2. 命令行中执行“hdc install ParticleSystemTest.hap”
   

测试应用使用方式

1. 在首页配置粒子大小、数量、速率等基本参数。默认使用我们的粒子系统，打开开关则使用系统原生粒子接口。
   
2. 大量粒子被发射，可在hdc命令行中使用“SP_daemon -ohtestfps 1000”或Graphics Profiler进行帧率采集。
   

项目结构

├─ParticleSystem            
  ├─AppScope                // 应用级资源和配置
  └─entry                   // 应用入口模块
      └─src                
        ├─main              
        │  ├─cpp            // C++实现的粒子系统核心代码
        │  │  ├─Base                 // 基础组件：Program类、FBO类、向量数学库等
        │  │  ├─Context              // EGL上下文管理，渲染环境设置
        │  │  ├─Particle             // 粒子系统核心参数：粒子定义、发射器、运动场、配置
        │  │  ├─postprocess          // 后期处理效果相关代码
        │  │  │  ├─ResolveTranslucent  // 处理半透明效果的后期处理
        │  │  │  └─SimpleCopy          // 简单的纹理复制后期处理
        │  │  ├─shader               // 着色器相关代码
        │  │  │   └─shaders          // GLSL着色器源码：计算着色器、顶点着色器、片段着色器
        │  │  └─types                // 类型定义
        │  │      └─libnativerender  // 原生渲染库相关的类型定义
        │  ├─ets                     // ArkTS代码实现
        │  │  ├─entryability         // 应用入口类
        │  │  └─pages                // 应用页面实现，包含ParticleSystemGPU.ets
        │  └─resources              // 应用资源文件，如图像粒子原图片
        └─ohosTest