【Babylon小技巧04】进阶双开门事件绑定同时触发

鼠标点击其中一扇门时,另外一扇也同时开启或关闭

效果如图

双开门playground地址:

Babylon.js Playgroundhttps://playground.babylonjs.com/#5F7R3K

主要思路为使用combineAction绑定了多个模型的鼠标事件,顺便多绑定一个箱子做放大缩小测试

let combineOpenDoorAction  = new BABYLON.CombineAction(
        BABYLON.ActionManager.OnPickTrigger,
        [
            new BABYLON.InterpolateValueAction(BABYLON.ActionManager.OnPickTrigger, _leftDoorMesh, "rotation.y",-Math.PI/2 , 1500),
            new BABYLON.InterpolateValueAction(BABYLON.ActionManager.OnPickTrigger, _rightDoorMesh, "rotation.y",Math.PI/2 , 1500),
            new BABYLON.ExecuteCodeAction(BABYLON.ActionManager.OnPickTrigger, function (e) {
                // alert(e.source.id +"combineOpenDoorAction");
                _triggerMesh.scaling = new BABYLON.Vector3(1.5,1.5,1.5);
                _triggerMesh.position.y = 2;

            })
        ]);

Playground代码如下

var createScene = function () {
    var scene = new BABYLON.Scene(engine);

    // Lights
    var light0 = new BABYLON.DirectionalLight("Omni", new BABYLON.Vector3(-2, 2, 2), scene);
    var light1 = new BABYLON.PointLight("Omni", new BABYLON.Vector3(2, 12, -15), scene);

    // Need a free camera for collisions
    var camera = new BABYLON.FreeCamera("FreeCamera", new BABYLON.Vector3(0, 2.2, -16), scene);
    camera.setTarget(new BABYLON.Vector3(0, 0, 0));
    camera.attachControl(canvas, true);
            camera.keysUp.push(87);
            camera.keysDown.push(83);
            camera.keysLeft.push(65);
            camera.keysRight.push(68);
            camera.speed=0.5;
            camera.inertia =0.8;
            camera.minZ=0.05;
    //limit
    scene.registerBeforeRender(function () {    
        console.log(camera.rotation.x);
        if(camera.rotation.x>0.5  ){//look down
            camera.rotation.x = 0.5;
        }else if(camera.rotation.x<-0.3){//look up
             camera.rotation.x = -0.3;
        }
        
    })
       //Simple crate
    var box = BABYLON.Mesh.CreateBox("crate", 2, scene);
    box.material = new BABYLON.StandardMaterial("Mat", scene);
    box.material.diffuseTexture = new BABYLON.Texture("textures/crate.png", scene);
    box.material.diffuseTexture.hasAlpha = true;
    box.position = new BABYLON.Vector3(5, 1, 0);


    var doorMeshLeft = BABYLON.MeshBuilder.CreateBox("doorMeshLeft", {height: 4, width: 2, depth: 0.25});
    doorMeshLeft.position = new BABYLON.Vector3(-1, 2, 0);
    doorMeshLeft.setPivotPoint(new BABYLON.Vector3(-1, 0, 0), BABYLON.Space.LOCAL);// pivot offset x  



    var doorMeshRight = BABYLON.MeshBuilder.CreateBox("doorMeshRight", {height: 4, width: 2, depth: 0.25});
    doorMeshRight.position = new BABYLON.Vector3(1, 2, 0);
    doorMeshRight.setPivotPoint(new BABYLON.Vector3(2, 2, 0), BABYLON.Space.WORLD);// pivot offset x  
 

    openDoubleDoorRegAction(doorMeshLeft,doorMeshRight,box);


/**
 * open double doors
 * */
function openDoubleDoorRegAction(_leftDoorMesh,_rightDoorMesh,_triggerMesh){

    _leftDoorMesh.rotationQuaternion = null;
    _rightDoorMesh.rotationQuaternion = null;
    _leftDoorMesh.checkCollisions = false;
    _rightDoorMesh.checkCollisions = false;
    let combineOpenDoorAction  = new BABYLON.CombineAction(
        BABYLON.ActionManager.OnPickTrigger,
        [
            new BABYLON.InterpolateValueAction(BABYLON.ActionManager.OnPickTrigger, _leftDoorMesh, "rotation.y",-Math.PI/2 , 1500),
            new BABYLON.InterpolateValueAction(BABYLON.ActionManager.OnPickTrigger, _rightDoorMesh, "rotation.y",Math.PI/2 , 1500),
            new BABYLON.ExecuteCodeAction(BABYLON.ActionManager.OnPickTrigger, function (e) {
                // alert(e.source.id +"combineOpenDoorAction");
                _triggerMesh.scaling = new BABYLON.Vector3(1.5,1.5,1.5);
                _triggerMesh.position.y = 2;

            })
        ]);
    let combineCloseDoorAction  = new BABYLON.CombineAction(
        BABYLON.ActionManager.OnPickTrigger,
        [
            new BABYLON.InterpolateValueAction(BABYLON.ActionManager.OnPickTrigger, _leftDoorMesh, "rotation.y",0 , 1500),
            new BABYLON.InterpolateValueAction(BABYLON.ActionManager.OnPickTrigger, _rightDoorMesh, "rotation.y",0 , 1500),
            new BABYLON.ExecuteCodeAction(BABYLON.ActionManager.OnPickTrigger, function (e) {
                // alert(e.source.id +"combineCloseDoorAction");
                _triggerMesh.scaling = new BABYLON.Vector3(1,1,1);
                _triggerMesh.position.y = 1;
            })
        ]);


    let doorActionManager = new BABYLON.ActionManager(scene);
    doorActionManager.registerAction(
        combineOpenDoorAction)
        .then(combineCloseDoorAction);

    _leftDoorMesh.openDoubleDoorAction = combineOpenDoorAction;
    _leftDoorMesh.closeDoubleDoorAction = combineCloseDoorAction;


    _leftDoorMesh.actionManager = doorActionManager;
    _rightDoorMesh.actionManager = doorActionManager;
    // return doorActionManager;

}



    // add guide line
    var showAxis = function (size) {
        var makeTextPlane = function (text, color, size) {
            var dynamicTexture = new BABYLON.DynamicTexture("DynamicTexture", 50, scene, true);
            dynamicTexture.hasAlpha = true;
            dynamicTexture.drawText(text, 5, 40, "bold 36px Arial", color, "transparent", true);
            var plane =  BABYLON.Mesh.CreatePlane("TextPlane", size, scene, true);
            plane.material = new BABYLON.StandardMaterial("TextPlaneMaterial", scene);
            plane.material.backFaceCulling = false;
            plane.material.specularColor = new BABYLON.Color3(0, 0, 0);
            plane.material.diffuseTexture = dynamicTexture;
            return plane;
        };

        var axisX = BABYLON.Mesh.CreateLines("axisX", [
            new BABYLON.Vector3(0,0,0), new BABYLON.Vector3(size, 0, 0), new BABYLON.Vector3(size * 0.95, 0.05 * size, 0),
            new BABYLON.Vector3(size, 0, 0), new BABYLON.Vector3(size * 0.95, -0.05 * size, 0)
        ], scene);
        axisX.color = new BABYLON.Color3(1, 0, 0);
        var xChar = makeTextPlane("X", "red", size / 10);
        xChar.position = new BABYLON.Vector3(0.9 * size, -0.05 * size, 0);
        var axisY = BABYLON.Mesh.CreateLines("axisY", [
            new BABYLON.Vector3(0,0,0), new BABYLON.Vector3(0, size, 0), new BABYLON.Vector3(-0.05 * size, size * 0.95, 0),
            new BABYLON.Vector3(0, size, 0), new BABYLON.Vector3(0.05 * size, size * 0.95, 0)
        ], scene);
        axisY.color = new BABYLON.Color3(0, 1, 0);
        var yChar = makeTextPlane("Y", "green", size / 10);
        yChar.position = new BABYLON.Vector3(0, 0.9 * size, -0.05 * size);
        var axisZ = BABYLON.Mesh.CreateLines("axisZ", [
            new BABYLON.Vector3(0,0,0), new BABYLON.Vector3(0, 0, size), new BABYLON.Vector3(0, -0.05 * size, size * 0.95),
            new BABYLON.Vector3(0, 0, size), new BABYLON.Vector3(0, 0.05 * size, size * 0.95)
        ], scene);
        axisZ.color = new BABYLON.Color3(0, 0, 1);
        var zChar = makeTextPlane("Z", "blue", size / 10);
        zChar.position = new BABYLON.Vector3(0, 0.05 * size, 0.9 * size);
    };

    showAxis(10);

       




    //Ground
    var ground = BABYLON.Mesh.CreatePlane("ground", 80.0, scene);
    ground.material = new BABYLON.StandardMaterial("groundMat", scene);
    ground.material.diffuseColor = new BABYLON.Color3(1, 1, 1);
    ground.material.backFaceCulling = false;
    ground.position = new BABYLON.Vector3(0, 0, 0);
    ground.rotation = new BABYLON.Vector3(Math.PI / 2, 0, 0);



    //Set gravity for the scene (G force like, on Y-axis)
    scene.gravity = new BABYLON.Vector3(0, -0.9, 0);

    // Enable Collisions
    scene.collisionsEnabled = true;

    //Then apply collisions and gravity to the active camera
    camera.checkCollisions = true;
    // camera.applyGravity = true;

    //Set the ellipsoid around the camera (e.g. your player's size)
    camera.ellipsoid = new BABYLON.Vector3(1, 1.1, 1);// Y*2 is character Height

    //finally, say which mesh will be collisionable
    ground.checkCollisions = true;
    box.checkCollisions = true;

    return scene;
}

  • 0
    点赞
  • 2
    收藏
    觉得还不错? 一键收藏
  • 1
    评论
评论 1
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值