Jump to content

How to proberly change Texture of a sprite?


Recommended Posts

Hey im struggling with changing a texture of a sprite.

do i need to update something or destroy the texture-reference first?

anyways my sprite wont update its texture and cant figure out why.

I used the code of Example 2:

	// create an array of assets to load	//var assetsToLoader = [ "assault.json"];	var assetsToLoader = [ "SpriteSheet.json"];			// create a new loader	var loader = new PIXI.AssetLoader(assetsToLoader);	// use callback	loader.onComplete = onAssetsLoaded		//begin load	loader.load();			// holder to store aliens	var aliens = [];	//var alienFrames = ["assault-0", "assault-1", "assault-2", "assault-3"];	var alienFrames = ["eggHead.png", "flowerTop.png", "helmlok.png", "skully.png"];		var count = 0;			// create an new instance of a pixi stage	var stage = new PIXI.Stage(0xFFFFFF);		// create a renderer instance.	var renderer = PIXI.autoDetectRenderer(800, 600);			// add the renderer view element to the DOM	document.body.appendChild(renderer.view);		// create an empty container	var alienContainer = new PIXI.DisplayObjectContainer();	alienContainer.position.x = 400;	alienContainer.position.y = 300;		stage.addChild(alienContainer);		function onAssetsLoaded()	{				// create a texture from an image path		// add a bunch of aliens		for (var i = 0; i < 100; i++) 		{			var frameName = alienFrames[i % 4];						// create an alien using the frame name..			var alien = PIXI.Sprite.fromFrame(frameName);						/*			 * fun fact for the day 			 * another way of doing the above would be			 * var texture = PIXI.Texture.fromFrame(frameName);			 * var alien = new PIXI.Sprite(texture);			 */			 						alien.position.x = Math.random() * 800-400;			alien.position.y = Math.random() * 600-300;			alien.anchor.x = 0.5;			alien.anchor.y = 0.5;			aliens.push(alien);			alienContainer.addChild(alien);		}				// start animating		requestAnimFrame( animate );					}			function animate() {		    requestAnimFrame( animate );		    // just for fun, lets rotate mr rabbit a little	    for (var i = 0; i < 100; i++) 		{			var alien = aliens[i];			//alien.rotation += 0.1;			var frameName = alienFrames[i % 4];						// create an alien using the frame name..			//alien.texture.frame = PIXI.Sprite.fromFrame(frameName);			//alien.frame = PIXI.Sprite.fromFrame(frameName);			//alien.texture = PIXI.Sprite.fromFrame(frameName);			 alien.setTexture (PIXI.Texture.fromFrame(frameName));			 			//alien.setTexture(new PIXI.Sprite.fromFrame(frameName));			//alien.setTexture(PIXI.Sprite.fromFrame(frameName));			//alien.update();			alien.updateCache ()		}						//alienContainer.scale.y = Math.sin(count)				//alienContainer.rotation += 0.01	    // render the stage   	    renderer.render(stage);	}

I tried using the commented lines as well.. any ideas?


thanks InsOp



EDIT: Sorry it was completely my lack of intelligence what caused this example to appear not working! the setTexture method does work, but i always

set the those textures which are already set on the given sprite. So itis not really possible to see any effects. with this tweak the effects are visible:

			var mod = Math.round(Math.random()*3)+1;			var frameName = alienFrames[i % mod];

therefore the topic may be closed and declared "answered"

Link to comment
Share on other sites

Join the conversation

You can post now and register later. If you have an account, sign in now to post with your account.
Note: Your post will require moderator approval before it will be visible.

Reply to this topic...

×   Pasted as rich text.   Paste as plain text instead

  Only 75 emoji are allowed.

×   Your link has been automatically embedded.   Display as a link instead

×   Your previous content has been restored.   Clear editor

×   You cannot paste images directly. Upload or insert images from URL.


  • Recently Browsing   0 members

    • No registered users viewing this page.
  • Create New...