Support collision group and fix the position of characterController synchronization late issue

e2e/case/litePhysics-collision-group.ts

@@ -0,0 +1,120 @@
+/**
+ * @title LitePhysics Collision Group
+ * @category Physics
+ */
+import {
+  WebGLEngine,
+  SphereColliderShape,
+  DynamicCollider,
+  BoxColliderShape,
+  Vector3,
+  MeshRenderer,
+  PointLight,
+  PrimitiveMesh,
+  Camera,
+  Script,
+  StaticCollider,
+  ColliderShape,
+  PBRMaterial,
+  Entity,
+  Layer
+} from "@galacean/engine";
+
+import { LitePhysics } from "@galacean/engine-physics-lite";
+import { initScreenshot, updateForE2E } from "./.mockForE2E";
+class MoveScript extends Script {
+  onUpdate() {
+    this.entity.transform.position.y -= 0.1;
+  }
+
+  onTriggerEnter(other: ColliderShape) {
+    // Change color to green when collision occurs
+    (this.entity.getComponent(MeshRenderer).getMaterial() as PBRMaterial).baseColor.set(0, 1, 0, 1);
+  }
+}
+// Create a sphere with physics
+function createPhysicsSphere(
+  rootEntity: Entity,
+  name: string,
+  position: Vector3,
+  radius: number,
+  color: Vector3,
+  collisionGroup: number
+) {
+  const sphereEntity = rootEntity.createChild(name);
+  sphereEntity.transform.setPosition(position.x, position.y, position.z);
+  sphereEntity.addComponent(MoveScript);
+
+  // Add visual representation
+  const sphereMtl = new PBRMaterial(rootEntity.engine);
+  const sphereRenderer = sphereEntity.addComponent(MeshRenderer);
+  sphereMtl.baseColor.set(color.x, color.y, color.z, 1.0);
+  sphereMtl.metallic = 0.0;
+  sphereMtl.roughness = 0.5;
+  sphereRenderer.mesh = PrimitiveMesh.createSphere(rootEntity.engine, radius);
+  sphereRenderer.setMaterial(sphereMtl);
+
+  // Add physics
+  const physicsSphere = new SphereColliderShape();
+  physicsSphere.radius = radius;
+
+  const sphereCollider = sphereEntity.addComponent(DynamicCollider);
+  sphereCollider.collisionGroup = collisionGroup;
+  sphereCollider.addShape(physicsSphere);
+
+  return sphereEntity;
+}
+
+WebGLEngine.create({ canvas: "canvas", physics: new LitePhysics() }).then((engine) => {
+  engine.canvas.resizeByClientSize();
+  const scene = engine.sceneManager.activeScene;
+  const rootEntity = scene.createRootEntity("root");
+
+  // Set up ambient lighting
+  scene.ambientLight.diffuseSolidColor.set(1, 1, 1, 1);
+  scene.ambientLight.diffuseIntensity = 1.2;
+
+  // Set up camera
+  const cameraEntity = rootEntity.createChild("camera");
+  const camera = cameraEntity.addComponent(Camera);
+  cameraEntity.transform.setPosition(0, 3, 15);
+  cameraEntity.transform.lookAt(new Vector3(0, 0, 0));
+
+  // Add point light
+  const light = rootEntity.createChild("light");
+  light.transform.setPosition(0, 10, 0);
+  const pointLight = light.addComponent(PointLight);
+  pointLight.intensity = 1.5;
+
+  const groundEntity = rootEntity.createChild("ground");
+
+  // 设置立方体的位置和大小
+  groundEntity.transform.setPosition(0, 1, 0);
+  // groundEntity.isActive = false;
+
+  // Visual representation of the ground cube
+  const groundMtl = new PBRMaterial(engine);
+  groundMtl.baseColor.set(0.5, 0.5, 0.5, 1.0);
+  groundMtl.roughness = 0.7;
+
+  const cubeSize = new Vector3(10, 0.2, 10);
+  const groundRenderer = groundEntity.addComponent(MeshRenderer);
+  groundRenderer.mesh = PrimitiveMesh.createCuboid(engine, cubeSize.x, cubeSize.y, cubeSize.z);
+  groundRenderer.setMaterial(groundMtl);
+
+  // Physics for the ground cube
+  const groundCollider = groundEntity.addComponent(StaticCollider);
+  const groundShape = new BoxColliderShape();
+  groundShape.size = cubeSize;
+  groundCollider.addShape(groundShape);
+
+  groundCollider.collisionGroup = 3;
+
+  const sphere1 = createPhysicsSphere(rootEntity, "RedSphere", new Vector3(-2, 5, 0), 0.5, new Vector3(1, 0, 0), 1);
+
+  const sphere2 = createPhysicsSphere(rootEntity, "BlueSphere", new Vector3(2, 5, 0), 0.5, new Vector3(0, 0, 1), 2);
+
+  scene.physics.setColliderGroupCollision(2, 3, false);
+  updateForE2E(engine, 1000, 38);
+  initScreenshot(engine, camera);
+});

e2e/case/physx-collision-group.ts

@@ -0,0 +1,132 @@
+/**
+ * @title Physx Collision Group
+ * @category Physics
+ */
+import {
+  WebGLEngine,
+  SphereColliderShape,
+  DynamicCollider,
+  BoxColliderShape,
+  Vector3,
+  MeshRenderer,
+  PointLight,
+  PrimitiveMesh,
+  Camera,
+  Script,
+  StaticCollider,
+  ColliderShape,
+  PBRMaterial,
+  Entity,
+  Layer
+} from "@galacean/engine";
+
+import { PhysXPhysics } from "@galacean/engine-physics-physx";
+import { initScreenshot, updateForE2E } from "./.mockForE2E";
+
+class CheckScript extends Script {
+  onTriggerEnter(other: ColliderShape) {
+    console.log("onTriggerEnter", other);
+    // Change color to green when collision occurs
+    (this.entity.getComponent(MeshRenderer).getMaterial() as PBRMaterial).baseColor.set(0, 1, 0, 1);
+  }
+
+  onContactEnter(other: ColliderShape) {
+    console.log("onContactEnter", other);
+    // Change color to green when collision occurs
+    (this.entity.getComponent(MeshRenderer).getMaterial() as PBRMaterial).baseColor.set(0, 1, 0, 1);
+  }
+}
+
+// Create a sphere with physics
+function createPhysicsSphere(
+  rootEntity: Entity,
+  name: string,
+  position: Vector3,
+  radius: number,
+  color: Vector3,
+  collisionGroup: number
+) {
+  const sphereEntity = rootEntity.createChild(name);
+  sphereEntity.transform.setPosition(position.x, position.y, position.z);
+
+  // Add visual representation
+  const sphereMtl = new PBRMaterial(rootEntity.engine);
+  const sphereRenderer = sphereEntity.addComponent(MeshRenderer);
+  sphereMtl.baseColor.set(color.x, color.y, color.z, 1.0);
+  sphereMtl.metallic = 0.0;
+  sphereMtl.roughness = 0.5;
+  sphereRenderer.mesh = PrimitiveMesh.createSphere(rootEntity.engine, radius);
+  sphereRenderer.setMaterial(sphereMtl);
+
+  // Add physics
+  const physicsSphere = new SphereColliderShape();
+  physicsSphere.radius = radius;
+  physicsSphere.material.bounciness = 0.8;
+
+  const sphereCollider = sphereEntity.addComponent(DynamicCollider);
+  sphereCollider.collisionGroup = collisionGroup;
+  sphereEntity.addComponent(CheckScript);
+  sphereCollider.addShape(physicsSphere);
+
+  return sphereEntity;
+}
+
+WebGLEngine.create({ canvas: "canvas", physics: new PhysXPhysics() }).then((engine) => {
+  engine.canvas.resizeByClientSize();
+  const scene = engine.sceneManager.activeScene;
+  const rootEntity = scene.createRootEntity("root");
+
+  // Set up ambient lighting
+  scene.ambientLight.diffuseSolidColor.set(1, 1, 1, 1);
+  scene.ambientLight.diffuseIntensity = 1.2;
+
+  // Set up camera
+  const cameraEntity = rootEntity.createChild("camera");
+  const camera = cameraEntity.addComponent(Camera);
+  // 调整相机位置以便更好地观察穿透效果
+  cameraEntity.transform.setPosition(0, 3, 15);
+  cameraEntity.transform.lookAt(new Vector3(0, 0, 0));
+
+  // Add point light
+  const light = rootEntity.createChild("light");
+  light.transform.setPosition(0, 10, 0);
+  const pointLight = light.addComponent(PointLight);
+  pointLight.intensity = 1.5;
+
+  // 创建立方体作为地面
+  const groundEntity = rootEntity.createChild("ground");
+
+  // 设置立方体的位置和大小
+  groundEntity.transform.setPosition(0, 1, 0);
+
+  // Visual representation of the ground cube
+  const groundMtl = new PBRMaterial(engine);
+  groundMtl.baseColor.set(0.5, 0.5, 0.5, 1.0);
+  groundMtl.roughness = 0.7;
+  // 设置半透明以便能看到穿透的球体
+  groundMtl.baseColor.a = 0.5;
+
+  const cubeSize = new Vector3(10, 0.2, 10);
+  const groundRenderer = groundEntity.addComponent(MeshRenderer);
+  groundRenderer.mesh = PrimitiveMesh.createCuboid(engine, cubeSize.x, cubeSize.y, cubeSize.z);
+  groundRenderer.setMaterial(groundMtl);
+
+  // Physics for the ground cube
+  const groundCollider = groundEntity.addComponent(StaticCollider);
+  const groundShape = new BoxColliderShape();
+  groundShape.size = cubeSize;
+  groundCollider.addShape(groundShape);
+
+  groundCollider.collisionGroup = 3;
+
+  // 创建可以碰撞的红色球体
+  const sphere1 = createPhysicsSphere(rootEntity, "RedSphere", new Vector3(-2, 5, 0), 0.5, new Vector3(1, 0, 0), 1);
+
+  // 创建可以穿透的蓝色球体
+  const sphere2 = createPhysicsSphere(rootEntity, "BlueSphere", new Vector3(2, 5, 0), 0.5, new Vector3(0, 0, 1), 2);
+
+  scene.physics.setColliderGroupCollision(2, 3, false);
+
+  updateForE2E(engine, 110);
+  initScreenshot(engine, camera);
+});

e2e/config.ts

@@ -214,6 +214,16 @@
       category: "Physics",
       caseFileName: "physx-collision",
       threshold: 0.1
+    },
+    "LitePhysics Collision Group": {
+      category: "Physics",
+      caseFileName: "litePhysics-collision-group",
+      threshold: 0.1
+    },
+    "PhysXPhysics Collision Group": {
+      category: "Physics",
+      caseFileName: "physx-collision-group",
+      threshold: 0.1
     }
   },
   Particle: {

packages/core/src/physics/CharacterController.ts

@@ -81,7 +81,6 @@ export class CharacterController extends Collider {
   constructor(entity: Entity) {
     super(entity);
     (<ICharacterController>this._nativeCollider) = PhysicsScene._nativePhysics.createCharacterController();
-
     this._setUpDirection = this._setUpDirection.bind(this);
     //@ts-ignore
     this._upDirection._onValueChanged = this._setUpDirection;

packages/core/src/physics/Collider.ts

@@ -7,6 +7,8 @@
 import { deepClone, ignoreClone } from "../clone/CloneManager";
 import { ColliderShape } from "./shape/ColliderShape";
 import { ICustomClone } from "../clone/ComponentCloner";
+import { EntityModifyFlags } from "../enums/EntityModifyFlags";
+import { Layer } from "../Layer";
 
 /**
  * Base class for all colliders.
@@ -24,6 +26,7 @@
   protected _updateFlag: BoolUpdateFlag;
   @deepClone
   protected _shapes: ColliderShape[] = [];
+  protected _collisionGroup: number = 0;
 
   /**
    * The shapes of this collider.
@@ -32,6 +35,21 @@
     return this._shapes;
   }
 
+  /**
+   * The collision group of this collider, only support 0-31.
+   */
+  get collisionGroup(): number {
+    return this._collisionGroup;
+  }
+
+  set collisionGroup(value: number) {
+    if (value < 0 || value > 31) {
+      throw new Error("Collision group must be between 0 and 31");
+    }
+    this._collisionGroup = value;
+    this._nativeCollider.setCollisionGroup(value);
+  }
+
   /**
    * @internal
    */
@@ -129,12 +147,15 @@
   /**
    * @internal
    */
-  _handleShapesChanged(): void {}
+  _handleShapesChanged(): void {
+    this._setCollisionGroup();
+  }
 
   protected _syncNative(): void {
     for (let i = 0, n = this.shapes.length; i < n; i++) {
       this._addNativeShape(this.shapes[i]);
     }
+    this._setCollisionGroup();
   }
 
   /**
@@ -161,4 +182,8 @@
     shape._collider = null;
     this._nativeCollider.removeShape(shape._nativeShape);
   }
+
+  protected _setCollisionGroup(): void {
+    this._nativeCollider.setCollisionGroup(this._collisionGroup);
+  }
 }

packages/core/src/physics/DynamicCollider.ts

@@ -421,6 +421,8 @@ export class DynamicCollider extends Collider {
    * @internal
    */
   override _handleShapesChanged(): void {
+    super._handleShapesChanged();
+
     if (this._automaticCenterOfMass || this._automaticInertiaTensor) {
       this._setMassAndUpdateInertia();
     }

packages/core/src/physics/PhysicsScene.ts

@@ -231,6 +231,16 @@ export class PhysicsScene {
     }
   }
 
+  /**
+   * Set whether two colliders can collide with each other.
+   * @param group1 - The first collision group
+   * @param group2 - The second collision group
+   * @param collide - Whether the colliders should collide
+   */
+  setColliderGroupCollision(group1: number, group2: number, collide: boolean): void {
+    PhysicsScene._nativePhysics.setColliderGroupCollision(group1, group2, collide);
+  }
+
   /**
    * Casts a ray through the Scene and returns the first hit.
    * @param ray - The ray

packages/core/src/physics/shape/ColliderShape.ts

@@ -51,7 +51,7 @@ export abstract class ColliderShape implements ICustomClone {
   }
 
   /**
-   * Contact offset for this shape, the value must be greater than or equal to 0.
+   * Contact offset for this shape, the value must be greater than or equal to 0, default is 0.02.
    */
   get contactOffset(): number {
     return this._contactOffset;

packages/design/src/physics/ICollider.ts

@@ -16,6 +16,12 @@ export interface ICollider {
    */
   removeShape(shape: IColliderShape): void;
 
+  /**
+   * Set the collision group of the collider.
+   * @param layer - The layer of the entity which the collider belongs to
+   */
+  setCollisionGroup(layer: number): void;
+
   /**
    * Deletes the collider.
    */