Crop a Canvas Background Image to Square


In previous howtos: here and here, we have learned how we can set the dimensions of a canvas to the image being loaded as a background, and then how we can set the background image to pixels in the foreground to make it editable. Now we can apply both of these methods and start doing something with the output! As a start we will look at how we can now crop a background image on a canvas to a square image. This method also shows how to save some time by only fetching the pixels that are needed for the cropped image. With a bit more hard work on the blocks code, it is possible to crop any part of the image to any dimensions.