tinyflea Posted June 30, 2016 Share Posted June 30, 2016 Hi all, i'm only a few weeks into pixi having finally left flash and air...i'm having problems with the class structure of JS and sharing assets - I have a button class which takes in two images and switches between them. I want this to work with my loaded spritesheet animations however I can't figure out how to do it.: function Button(bg1,bg2,text) { PIXI.Container.call( this ); this.init = function (background1,background2, text) { /*var frameScreen = ["im.jpg"] var frameArray = []; var framePush = PIXI.Texture.fromImage(frameScreen[0]); frameArray.push(framePush);*/ this.myStat2 = text; buttonTexture1 = PIXI.Texture.fromImage(background1); buttonTexture2 = PIXI.Texture.fromImage(background2); this.button = new PIXI.Sprite(buttonTexture2); this.addChild(this.button); this.button.anchor.x = 0.5; this.button.anchor.y = 0.5; this.interactive = true; this.on('mousedown', this.buttonDown); this.on('touchstart', this.buttonDown); }; this.buttonDown = function(){ if(this.myStat==0){ //butPress('fook') //alert('0 - ' + this.myStat2) this.button.texture = buttonTexture2; //this.button.setTexture(texture02); this.myStat = 1; }else{ //butPress('kook') //alert('1 - ' + this.myStat2) this.button.texture = buttonTexture1; this.myStat = 0; } }; this.changeTexture = function(newTex){ this.button.texture = newTex; } this.init(bg1,bg2,text); } var buttonTexture1; var buttonTexture2; var myStat = 0; var myStat2 = 0; Button.prototype = Object.create(PIXI.Container.prototype); Button.prototype.constructor = Button; from my main class I can send preloaded images fine like so: var testButton = new Button(squareSymbols,'images/squareBGoff_0001.jpg', '1'); testButton.x=400; testButton.y=900; stage.addChild(testButton); but I want to send my sprite animations as button images instead - they are loaded loaded like this and display fine in the main class, problem is I just can't get the button class to get them. Can anyone tell me what I don't understand?: var stage = new PIXI.Container(); var loader = PIXI.loader .add('images/tp/assets.json') .add('images/squareBGon_0001.jpg') .add('images/squareBGoff_0001.jpg') .load(init); alert("images loaded yeah") for (var i = 1; i < 50; i++) { var val = i < 10 ? '0' + i : i; squareSymbols.push(PIXI.Texture.fromFrame('numberSquares_00' + val + '.png')); } } Quote Link to comment Share on other sites More sharing options...
ivan.popelyshev Posted June 30, 2016 Share Posted June 30, 2016 if you load "images/square.jpg" then fromFrame must load "images/square.jpg" too. Also you have to move all your operations inside init. loader.add('something', 'images/square.jpg'); loader.load(init); function init() { alert('images loaded yeah'); var tex2 = loader.resources['something'].texture; //that will work like intended var tex1 = PIXI.Texture.fromFrame('images/square.jpg'); // that will work too } Quote Link to comment Share on other sites More sharing options...
Recommended Posts
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.