koobas.hobune.stream
Crop Texture2D from center
I have a script which handles pictures taken from smartphone camera. These pictures are either portrait or landscape but I want them to be square!
I have this script below which makes them square, but it goes from the bottom and up. How do I make this crop from center of the image?
Hope someone can help me on this and thanks in advance :-)
Texture2D texture;
float originalWidth = texture.width;
float originalHeight = texture.height;
float imageRatio = (originalHeight / originalWidth);
scaledWidth = 150;
scaledHeight = (scaledWidth * imageRatio);
scaledHeight = Mathf.Round(scaledHeight);
TextureScale.Bilinear (texture, (int)scaledWidth, (int)scaledHeight);
portrait = true;
wwwimage = texture;
wwwimage.wrapMode = TextureWrapMode.Clamp;
newpic = new Texture2D(128, 128, TextureFormat.ARGB32, false);
for (int y = 0; y < newpic.height; ++y) {
for (int x = 0; x < newpic.width; ++x) {
pix = wwwimage.GetPixel(x,y);
defaultPix = DefaultImage.GetPixel(x,y);
pix.a = defaultPix.a;
newpic.SetPixel (x, y, pix);
}
}
newpic.Apply();
newpic.wrapMode = TextureWrapMode.Clamp;
data = newpic.EncodeToPNG();
I quickly created an image "resampler" that always crops around the center. It does a simple bilinear interpolation:
edit
Oh that was unexpected! I just "inlined" all those method calls inside the for loops to improve the performance. The inlined version runs 8 times faster ^^. In my tests i used an 1338x2000 image and let it upscale to 5000x5000. It took about 16 seconds while the optimised version only took about 2 seconds. Well it's 25 million pixels. To process one pixel it took (on average) 80 nano seconds ^^
I've placed the optimised version on my dropbox over here: TextureTools.cs. I keep the unoptimised one here as it's shorter and easier to understand / follow.
public class TextureTools
{
public static Texture2D ResampleAndCrop(Texture2D source, int targetWidth, int targetHeight)
{
int sourceWidth = source.width;
int sourceHeight = source.height;
float sourceAspect = (float)sourceWidth / sourceHeight;
float targetAspect = (float)targetWidth / targetHeight;
int xOffset = 0;
int yOffset = 0;
float factor = 1;
if (sourceAspect > targetAspect)
{ // crop width
factor = (float)targetHeight / sourceHeight;
xOffset = (int)((sourceWidth - sourceHeight * targetAspect) * 0.5f);
}
else
{ // crop height
factor = (float)targetWidth / sourceWidth;
yOffset = (int)((sourceHeight - sourceWidth / targetAspect) * 0.5f);
}
Color32[] data = source.GetPixels32();
Color32[] data2 = new Color32[targetWidth * targetHeight];
for (int y = 0; y < targetHeight; y++)
{
for (int x = 0; x < targetWidth; x++)
{
var p = new Vector2(Mathf.Clamp(xOffset + x / factor, 0, sourceWidth - 1), Mathf.Clamp(yOffset + y / factor, 0, sourceHeight - 1));
// bilinear filtering
var c11 = data[Mathf.FloorToInt(p.x) + sourceWidth * (Mathf.FloorToInt(p.y))];
var c12 = data[Mathf.FloorToInt(p.x) + sourceWidth * (Mathf.CeilToInt(p.y))];
var c21 = data[Mathf.CeilToInt(p.x) + sourceWidth * (Mathf.FloorToInt(p.y))];
var c22 = data[Mathf.CeilToInt(p.x) + sourceWidth * (Mathf.CeilToInt(p.y))];
var f = new Vector2(Mathf.Repeat(p.x, 1f), Mathf.Repeat(p.y, 1f));
data2[x + y * targetWidth] = Color.Lerp(Color.Lerp(c11, c12, p.y), Color.Lerp(c21, c22, p.y), p.x);
}
}
var tex = new Texture2D(targetWidth, targetHeight);
tex.SetPixels32(data2);
tex.Apply(true);
return tex;
}
}
The important part is the xOffset and yOffset which is half the difference between the original height (or width) and the cropped height (or width). "factor" is the actual "zooming" factor. This method can down scale as well as upscale. You can specify anything as targetsize it simply scales the image so it fits into the target area. Everything that is too large is cropped equally on both ends (either top and bottom or left and right).
$$anonymous$$ind of funny how bilinear upscaling seem to improve an image ^^ Example
@Bunny83 - well, I have noticed that this does not seem to crop, but it just "press" the image into a square loosing its constrains? Any idea what that is?
Sorry for the late response, but you posted your comment as answer and i wasn't watching my answer anymore (well i write about 3 answers every day so after 17 days i usually don't check all my old answers).
I'm not sure what you mean. It doesn't "press" it into a square it always keep the aspect ratio. It only crops the side which are too long, equally on both ends.
For example an image that is 1024x768. If you use this method with a target size if 256x256, it will grab the pixels from 128,0 to 896,768 (which is a square section of the image, centered on the x axis) and then downsample it from the original 768x768 to 256x256.
Now if you have a portrait like 768x1024 It would crop at the top and bottom ins$$anonymous$$d and use the full width of the image with is then scaled down.
The image is never stretched or distorted, it will always keep the propotions of the original image. If you see some stretching it's something you do with the image. Are you sure you actually display it as a square?
Hello, I tried cropping a Texture2D using your optimized TextureTools.cs . However it does not seem to work.
public Texture2D pickedImage;
rawImage.GetComponent<RawImage>().texture = pickedImage;
The above script places the texture in the raw image distorting the picture. The following script is what i tried but the raw image returns blank.
Texture2D cropedImage = TextureTools.ResampleAndCrop(pickedImage, maxSize, maxSize);
rawImage.GetComponent<RawImage>().texture = cropedImage;
Can you check if I am missing something?
Are you sure you marked your original texture as readable? (Read / Write Enable).
Also keep in $$anonymous$$d the target size of the texture would be a square texture with your current parameters. So the rawimage need to be a square as well in order to have no distortions.
I created the following script for square Texture:
private Texture2D GetSquareCenteredTexture(Texture2D sourceTexture)
{
int squareSize;
int xPos = 0;
int yPos = 0;
if (sourceTexture.height < sourceTexture.width)
{
squareSize = sourceTexture.height;
xPos = (sourceTexture.width - sourceTexture.height) / 2;
}
else
{
squareSize = sourceTexture.width;
yPos = (sourceTexture.height - sourceTexture.width) / 2;
}
Color[] c = ((Texture2D) sourceTexture).GetPixels(xPos, yPos, squareSize, squareSize);
Texture2D croppedTexture = new Texture2D(squareSize, squareSize);
croppedTexture.SetPixels(c);
croppedTexture.Apply();
return croppedTexture;
}
