Sign in to follow this  
Alain

Adjust texture size in pixi.js v5

Recommended Posts

You could scale the sprite.

//Calculate scale to cover whole screen area. Use min to make it so that whole image shows and covers as much as it can.
var scale = Math.max( window.innerWidth / sprite.texture.width, window.innerHeight / sprite.texture.height);
sprite.scale.set(scale,scale);
//Center the sprite
sprite.x = Math.round( ( window.innerWidth - sprite.width ) / 2);
sprite.y = Math.round( ( window.innerHeight - sprite.height ) / 2);
 

Share this post


Link to post
Share on other sites
19 hours ago, Exca said:

You could scale the sprite.

//Calculate scale to cover whole screen area. Use min to make it so that whole image shows and covers as much as it can.
var scale = Math.max( window.innerWidth / sprite.texture.width, window.innerHeight / sprite.texture.height);
sprite.scale.set(scale,scale);
//Center the sprite
sprite.x = Math.round( ( window.innerWidth - sprite.width ) / 2);
sprite.y = Math.round( ( window.innerHeight - sprite.height ) / 2);
 

 

I've done it as you say, but the image is very stretched.

Share this post


Link to post
Share on other sites

Hmm, if the x & y scale are the same, then the aspect should be identical to the basetexture.

There seems to be two problems that cause the issue in the example. You need to use the texture.width instead of sprite.width as the sprite.width has scale calculated into it. Second problem is with filter. Having it on makes the image strected, taking if off makes the image look proper. Not really sure what goes wrong in the shader.

Share this post


Link to post
Share on other sites
On 5/23/2019 at 2:59 AM, Exca said:

Hmm, if the x & y scale are the same, then the aspect should be identical to the basetexture.

There seems to be two problems that cause the issue in the example. You need to use the texture.width instead of sprite.width as the sprite.width has scale calculated into it. Second problem is with filter. Having it on makes the image strected, taking if off makes the image look proper. Not really sure what goes wrong in the shader.

I have already solved

 

 

 
 
 
 

Share this post


Link to post
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.

Guest
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.

Loading...
Sign in to follow this  

  • Recently Browsing   0 members

    No registered users viewing this page.