Some solution for 3D interaction above UI click/drag issue (Mobile Touch / Mouse event )

I have faced for 3D interaction above UI issue. After that I got some solution. So here I am shareing my code.

var BlockMouseInput = pc.createScript('blockMouseInput');
// initialize code called once per entity
BlockMouseInput.prototype.initialize = function () {
    this.entity.element.on('mousedown', function (e) {
        e.stopPropagation();
    }, this);
    if (this.app.touch) {
        this.entity.element.on('touchstart', function (e) {
            console.log('touchstart');
             e.event.stopImmediatePropagation();
        }, this);
    
        this.entity.element.on('touchmove', function (e) {
            console.log('touchmove');
             e.event.stopImmediatePropagation();
        }, this);
    }
};

I hope this will help others.

5 Likes

Pretty cool! @Sweetan_Mariyappan1, I will keep this in mind for my own game(s).

1 Like