Checking image width/height and determine what picturebox to place it in

Question

Hey all I have the following pictureboxes' size's on my WPF form:

 Box |Width |Height
 ----|------|------
 1   |357   |272
 ----|------|------
 2   |357   |272
 ----|------|------
 3   |365   |460
 ----|------|------
 4   |365   |265
 ----|------|------
 5   |715   |455
 ----|------|------
 6   |360   |465
 ----|------|------
 7   |360   |465
 ----|------|------
 8   |360   |465
 ----|------|------
 9   |540   |290
 ----|------|------
 10  |540   |290

So visually it would look something like this:

 --------------------------
 |       |        |       |
 |   1   |    2   |       |
 |----------------|   3   |
 |                |       |
 |                |-------|
 |       5        |       |
 |                |   4   |
 |------------------------|
 |        |       |       |
 |   6    |   7   |   8   |
 |        |       |       |
 |------------------------|
 |            |           |
 |     9      |     10    |
 --------------------------

So what my goal is is to get the current image I am wanting to place into a box and get its width and height and from that determine the best box to place it in so that it will show the image:

1. Without black borders on either the left/right or top/bottom (or both).
2. Not chop off the important areas of the image (mostly the middle section moving out).

I have decided to use Magick.NET in order to ease the pain of doing something like this from scratch. So when I determine what box I will be placing the image into then I can use the Magick.NET to crop it using:

Resize with something like this:

imgStream.Crop(width, height, Gravity.Center);

or

MagickGeometry size = new MagickGeometry(width, height);
size.IgnoreAspectRatio = maintainAspectRatio;
// Adjust geometry offset to center of image (same as `-gravity Center`)
size.Y = imgStream.Height / 2 - height / 2;
size.X = imgStream.Width / 2 - width / 2;
imgStream.Crop(size);

So to sum up the above - I am in need of finding the best box to place the image into before I go and use Magick.NET on it.

Answer 1

The best box for an image is the box with minimum value of the difference between BoxWidth / ImageWidth and BoxHeight / ImageHeight.

This will make sure that there will be minimum empty space when you fill the box with resized image (along with maintaining the aspect ratio). You can use the value MIN(BoxWidth / ImageWidth, BoxHeight / ImageHeight) to resize your image.

C# code:

foreach(ImageStream imgStream in Images)
{
    double MinRatioDifference = -1.0,
        Ratio = 1.0;
    Box SelectedBox = null;
    foreach(Box UnfilledBox in UnfilledBoxes)
    {
        double WidthRatio = BoxWidth / ImageWidth,
            HeightRatio = BoxHeight / ImageHeight,
            RatioDifference = WidthRatio - HeightRatio;
        if(RatioDifference < 0)
        {
            RatioDifference = -RatioDifference;
        }
        if(MinRatioDifference == -1.0 || RatioDifference < MinRatioDifference)
        {
            MinRatioDifference = RatioDifference;
            SelectedBox = UnfilledBox;
            Ratio = Math.Min(WidthRatio, HeightRatio);
        }
    }
    if(MinRatioDifference != -1.0 && SelectedBox != null)
    {
        // Fill SelectedBox with imgStream using Ratio
        UnfilledBoxes.Remove(SelectedBox);
    }
}