Handzo Posted December 7, 2020 Share Posted December 7, 2020 Hello! I have a questions about compressed textures. Questions: 1) Default extension chooser pick @*x multiply depends on window.devicePixelRatio. It works well for mobile, iPhoneX has window.devicePixelRatio = 3. But desktop chrome browser has window.devicePixelRatio = 1. So by default I will get the lowest resolution for desktop browser. Solution is to check userAgent and if it is desktop, force to pick the highest resolution. Are there any others fancy solutions? 2) I have source textures for 1920x1080 resolution, I am generating textures @3x(1920x1080), @2x(1280x720) and @1x(640x360). After texture loaded (doesn't matter for which resolution) I'm getting texture with size 640x360. At the end I have 640x360 coordinate system which is not precise, because all source textures was designed for 1920x1080. And if certain source texture has to be in position { x: 1000, y: 1000 } it means that after load on scene it position has to be { x: 333.333, y: 333.333 } but the image can be blurred because of that. If i will not switch off round pixels, position will be { x: 333, y: 333 } and the image will be shifted from original position. Solution is to make @1x(1920x1080), @.67x(1280x720) and @.33x(640, 360) textures or make original textures coordinates to be x%3 == 0 && y%3 == 0. Need some advice. thanks Quote Link to comment Share on other sites More sharing options...
ivan.popelyshev Posted December 7, 2020 Share Posted December 7, 2020 Welcome to resolution hell, sponsored by everyone who killed runtime vector formats (Adobe, Apple). 1) No, there are only production solution, for evrey game its different 2) > but the image can be blurred because of that Use CLAMPing for objects that are not scaled. Scaled objects will be blurred anyway > If i will not switch off round pixels, position will be { x: 333, y: 333 } and the image will be shifted from original position That's not intended behaviour, roundPixels cares about texture resolution. Please make a minimal reproduce example. Quote Link to comment Share on other sites More sharing options...
Handzo Posted December 7, 2020 Author Share Posted December 7, 2020 Quote That's not intended behaviour, roundPixels cares about texture resolution. Please make a minimal reproduce example. For example I have source texture 100x100 and by design they must be tiled horizontally, after loaded it will scale down by 3 const myTexture100x100 = resources['spot']; for (let i = 0; i < 10; ++i) { const spot = new PIXI.Sprite(myTexture100x100); // rounded position = 33, 66, 100, 133, 166, 200, 233, 266, 300 // offsets = 33, 33, 34, 33, 33, 34, 33, 33, 34 spot.position.set(100/33 * i, 0); app.stage.addChild(spot); } 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.