Cran Posted January 2, 2020 Share Posted January 2, 2020 I'm really new to PIXI.js and programming in general, I want my programs to work well on multiple screen sizes, but it gets annoying to type out width/8 or width/3*2 as coordinate values. This is the only way I ever though pf to do something like this but I'm sure there has to be a more efficient way, i tried making a function to simplify things, but it doesn't help much, i didn't want to use straight up numbers for coordinates, so i made a function that would take a number from 0 to 1000 and turn it into a value for the screen size, (0 being 0 and 1000 being the width or height of the screen) but then 1 on the height setting is not 1 on the width, and I just got more confused, is there an easier way to do this sort of thing? ivan.popelyshev 1 Quote Link to comment Share on other sites More sharing options...
ivan.popelyshev Posted January 2, 2020 Share Posted January 2, 2020 (edited) Hi! Just set "app.stage.scale" to something like width/1080 - and whatever is inside will be 0 at the left and 1080 at the right. Its also good to decide what do you want to fix - width or height, and whether you want to change aspect ratio (non-uniform scale). How scale of parent - affects child elements, well, its good old mechanism from Adobe Flash - every node has a transform, transform is defined by position, rotation,scale, and maybe other things. Resulting matrices of parent and child are multiplied. Most common things that people do - either fix width or height, either make it always fit. PixiJS doesn't handle multiple screen sizes logic because there are actually many ways to do that and it can be coded by anyone. The fact that we dont have a solution pre-packaged inside the library, well, all solutions that people did were partial. If you make a universal one, you can make a plugin out of it and then it will go to the core. Edited January 2, 2020 by ivan.popelyshev Quote Link to comment Share on other sites More sharing options...
Cran Posted January 3, 2020 Author Share Posted January 3, 2020 You said setting app.stage.scale to width/1080, that would help with the issue, but wouldn’t that change the size of the application, Or would that stay the same? what I mean is will the program be smaller than the window, I think I understand but I want to check Quote Link to comment Share on other sites More sharing options...
ivan.popelyshev Posted January 3, 2020 Share Posted January 3, 2020 (edited) 11 hours ago, Cran said: You said setting app.stage.scale to width/1080, that would help with the issue, but wouldn’t that change the size of the application, Or would that stay the same? what I mean is will the program be smaller than the window, I think I understand but I want to check Not sure You can change scale, you can change it not-uniformly, and as a result you'll get FIT, x-fixed, y-fixed or another behaviour. PixiJS doesn't have those behavours pre-packaged, its up to you to discover how its done. Put different numbers in scale - get different results Treat it like an exercise, you wont get further without knowing how transform works. Edited January 3, 2020 by ivan.popelyshev 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.