I want to scale any image uploaded into this canvas to fit within a space but whenever the image isn't a perfect square the image seems to get squished in one direction or another, is there a solution for this?
you need to get the original ratio of height / width of the background image, then set the canvas' height and width with same ratio, then set the bg image for canvas.
search 'canvas ratio' or other key word in this community to find more solutions.
The problem is that the user can take a photo/upload an image and change the background image. I want to make sure that the image fits within say 55%(height) x 100% (width) of the screen and doesn't get cropped/squished oddly and gets scales down properly
I want to find the ratio of the image taken by the camera, then change the canvas size to the image scaled down to fit the screen and not be massive
Perhaps this ?
Do you know any extensions that can do this instead of using a HTML file? I don't think this works because it needs the media to be already in the media/assets but I want to have the image from taking a photo, but thanks for the reply!
You can simply supply the full file path to the html file. This is usually generated by the TakePicture method.
If you feel you must have an extension, you can use this:
which also provides a rotate function if the camera image is out by 90 degrees.
An alternative is to have a fixed canvas height and width, and to set an imageSprite with the image and appropriate dimensions to fit inside the canvas.
So basically, I can follow the tutorial and there should be no problem? ill try it out, and thanks for your help!
Edit: It seems to work very well, thanks!