Need Help Tapping Object to Change Color of Material

Hi VortexHero,

Here's a script that changes the color of a sprite's material:

// Bind this to the 'Initialized' event
//@input Component.SpriteVisual visual
//@input vec4 color = {1.0,1.0,1.0,1.0}

// Enable full screen touches
global.touchSystem.touchBlocking = true;

// Add a reaction to Tapping
script.createEvent("TapEvent").bind(function(){
    // Change the 'baseColor' property on the visual's material
    script.visual.mainPass.baseColor = script.color;
});

If you want to change a mesh's material instead, you can change //@input Component.SpriteVisual to //@input Component.MeshVisual

Martin, here's a script that sets a Sprite's texture to the next item in a list each time the screen is tapped:

// Bind this to the 'Initialized' event
//@input Component.SpriteVisual sprite
//@input Asset.Texture[] textures

var textureIndex = -1;

// Enable full screen touches
global.touchSystem.touchBlocking = true;

// Add a reaction to Tapping
script.createEvent("TapEvent").bind(function(){
    if(script.textures.length > 0){
        textureIndex = (textureIndex + 1) % script.textures.length;
        var newTex = script.textures[textureIndex];

        // Change the 'baseTex' property on the sprite's material
        script.sprite.mainPass.baseTex = newTex;
    }
});

Hope this helps!

Sure, here's a version that switches between the original color and new color with every tap:

// Bind this to the 'Initialized' event
//@input Component.SpriteVisual visual
//@input vec4 color = {1.0,1.0,1.0,1.0}

var toggle = false;
var originalColor = script.visual.mainPass.baseColor;

// Enable full screen touches
global.touchSystem.touchBlocking = true;

// Add a reaction to Tapping
script.createEvent("TapEvent").bind(function(){
 toggle = !toggle;
 
 // Choose either the original color or the input color
 var newColor = toggle ? script.color : originalColor;

 // Change the 'baseColor' property on the visual's material
 script.visual.mainPass.baseColor = newColor;
});

Hi Barry,

Here's a script that cycles through as many colors as you want. Just add them to the colors list.

// Bind this to the 'Initialized' event
//@input Component.MeshVisual meshVisual
//@input vec4[] colors

var ind = -1;

// Add a reaction to Tapping
script.createEvent("TapEvent").bind(function(){
    if(script.colors.length > 0){
        ind = (ind + 1) % script.colors.length;
        var newColor= script.colors[ind];

        // Change the 'baseColor' property on the mesh visual's material
        script.meshVisual.mainPass.baseColor = newColor;
    }
});

You'll have to enter the colors as R,G,B,A values unfortunately since arrays don't support the color widget. Let me know if you need any more help with this!

Jacob