Ant0n Posted April 13, 2022 Share Posted April 13, 2022 Hello. I'm new to HTML5 games development. I'm trying to use a texture from spritesheet.json in order to fill a rounded rectangle, it's a progress bar. The texture original size is 2x86, but all elements on the screen has been scaled down to 0.26 First problem is that texture from spritesheet is not repeating, and I've found out why on the forum, so I loaded this image file separately(Is it possible to use a spritesheet?), then the second problem appeared: I wasn't able to find out how to scale it correctly to make it look like it should. Here is this part of code: const progressBarMatrix = new Matrix(scaleX, 0, 0, scaleY, tx, ty); this.progressBar.beginTextureFill({ texture: progressBarTexture, matrix: progressBarMatrix, }); this.progressBar.drawRoundedRect(x, y, width, height, radius); this.progressBar.endFill(); Thank you Quote Link to comment Share on other sites More sharing options...
Ant0n Posted April 14, 2022 Author Share Posted April 14, 2022 Looks like I solved the issue with scaling, by applying a translate on Y axis (still don't get how to properly calculate this value, so I used a value found by manually changing and comparing the result of look) 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.