Page 1 of 2

How to fit image sizes correctly

Posted: 2019-05-23T08:59:00-07:00
by GoncaloM
I'm using Magick.NET to generate some images for a splash screen for Android and iOS(https://cordova.apache.org/docs/en/late ... ard-images).
But I'm having some issues with the resize.
We can have a square or rectangle image and portrait or landscape but when I convert it stretches:

Image

Can anyone help me with this?
Thank you in advance

Re: How to fit image sizes correctly

Posted: 2019-05-23T09:20:58-07:00
by fmw42
Post your original image to some free hosting service and put the URL here. Also post your code.

You may be specifying in your code to resize to an exact fit. If the resize arguments are not square, then your square image will be resized and distorted. You want to resize and preserve aspect ratio. I do not use Magick.NET but you can see the command line flags for resizing at https://imagemagick.org/script/command- ... p#geometry

Re: How to fit image sizes correctly

Posted: 2019-05-23T09:38:36-07:00
by snibgo
GoncaloM wrote:But I'm having some issues with the resize.

I want this! Or this!
Your first "want" has added pixels at the top and bottom. Use "-extent", not resize.

Your second "want" has cropped pixels from both sides. Use "-crop", not resize.

Re: How to fit image sizes correctly

Posted: 2019-05-23T15:43:17-07:00
by GoncaloM
Hi and thank you for your answer.
Do you have a sample of this working using Magick.NET?
It's the first time I'm dealing with this API to work with images and I'm not getting there.
Really appreciate your help.
Cheers

Re: How to fit image sizes correctly

Posted: 2019-05-23T15:46:48-07:00
by GoncaloM
Here's my code:

Code: Select all

using (MagickImage image = new MagickImage(ssimageBinary))
{
    image.Density = new Density(sstargetDensity);
    MagickGeometry size = new MagickGeometry(sstargetWidth, sstargetHeight);

    // This will resize the image to a fixed size without maintaining the aspect ratio.
    // Normally an image will be resized to fit inside the specified size.
    size.IgnoreAspectRatio = ssIgnoreAspectRatio;

    image.Resize(size);

    MemoryStream mStream = new MemoryStream();

    // Save the result
    image.Write(mStream, MagickFormat.Png);

    ssnewImage = mStream.ToArray();
}
And here's the link to the original image (just a sample by the way): https://pic.001all.com/Wallpaper/iPad%2 ... 202732.jpg

Also, here are the sizes I need to convert to:

Image


Hope you can help.
Cheers

Re: How to fit image sizes correctly

Posted: 2019-05-23T16:26:12-07:00
by fmw42
Sorry, I do not know Magick.NET.

But in command line, you have two choices if you do not want to distort your image and the aspect ratios of the input and desired size are not the same: 1) resize to the larger dimension and pad or 2) resize to the smaller dimension and crop. With the former you would need to specify a desired background color to fill the pad area

1)

Code: Select all

convert YourFather.jpg -resize 240x360 -gravity center -background black -extent 240x360 YourFather1.jpg
Image


2)

Code: Select all

convert YourFather.jpg -resize 240x360^ -gravity center -crop 240x360+0+0 +repage YourFather2.jpg
Image


Note the ^ on the resize dimension in method 2). See https://imagemagick.org/script/command- ... p#geometry

Re: How to fit image sizes correctly

Posted: 2019-05-24T00:59:08-07:00
by GoncaloM
Hi fmw42.
First of all, thank you for your answer.
I'll try to map those operations into Magick.NET and if I'm able to do it I'll post the result in here.
Cheers

Re: How to fit image sizes correctly

Posted: 2019-05-24T13:54:32-07:00
by GoncaloM
fmw42 wrote: 2019-05-23T16:26:12-07:00

Code: Select all

convert YourFather.jpg -resize 240x360^ -gravity center -crop 240x360+0+0 +repage YourFather2.jpg
Image


Note the ^ on the resize dimension in method 2). See https://imagemagick.org/script/command- ... p#geometry
This second approach ignores the rectangular form of my inputted width x height. For instance, using 1280x1920 I'm getting an image with 1280x1280.
What can I be missing?
I have this:

Code: Select all

image.Density = new Density(sstargetDensity);
MagickGeometry size = new MagickGeometry(sstargetWidth, sstargetHeight);

// This will resize the image to a fixed size without maintaining the aspect ratio.
// Normally an image will be resized to fit inside the specified size.
//size.IgnoreAspectRatio = ssIgnoreAspectRatio;

 image.Resize(size);
 image.Crop(sstargetWidth, sstargetHeight, Gravity.Center);
  image.RePage();

Can't understand the equivalent in Magick.NET :/

Re: How to fit image sizes correctly

Posted: 2019-05-24T16:14:54-07:00
by fmw42
This second approach ignores the rectangular form of my inputted width x height. For instance, using 1280x1920 I'm getting an image with 1280x1280.
Both approaches will create the exact size you specify in the resize. Is that not what you want. If you specify 1280x1920 both approaches will make an image of 1280x1920 no matter what the input dimensions are. Is that not what you want?

If not that, then what do you expect for the output size?

You only have two other choices: 1) preserver the aspect ratio of the input 2) force the output to that specified size without cropping and without padding and have the image be distorted.

Re: How to fit image sizes correctly

Posted: 2019-05-25T06:05:57-07:00
by GoncaloM
fmw42 wrote: 2019-05-24T16:14:54-07:00 Both approaches will create the exact size you specify in the resize. Is that not what you want. If you specify 1280x1920 both approaches will make an image of 1280x1920 no matter what the input dimensions are. Is that not what you want?

If not that, then what do you expect for the output size?
Hello fmw42.
Yes that is the size I want.
The thing is that my output is coming with 1280x1280.
I might be missing something on that approach.
Here's my code:
using (MagickImage image = new MagickImage(ssimageBinary))
{
image.Density = new Density(sstargetDensity);
MagickGeometry size = new MagickGeometry(sstargetWidth, sstargetHeight);

image.Resize(size);

image.Crop(sstargetWidth, sstargetHeight, Gravity.Center);
image.RePage();

MemoryStream mStream = new MemoryStream();

image.Write(mStream, MagickFormat.Png);

ssnewImage = mStream.ToArray();
}
I also can't find the equivalent in Magick.NET for the "^"?!

Cheers

Re: How to fit image sizes correctly

Posted: 2019-05-25T10:18:04-07:00
by fmw42
Sorry, I cannot help with Magick.NET code. Do my commands do what you want using the command line? If so, then the Magick.NET developer will likely be able to help you further.

Re: How to fit image sizes correctly

Posted: 2019-05-25T15:28:39-07:00
by GoncaloM
I tried in the command-line but I'm also getting a 1280x1280 image, so not my final goal
The command I used was the following:

Code: Select all

magick convert C:\Users\gm\Desktop\Vader.jpg -resize 1280x1920^ -gravity center -crop 1280x1920+0+0 +repage C:\Users\gm\Desktop\Vader.jpg

Re: How to fit image sizes correctly

Posted: 2019-05-25T15:51:17-07:00
by fmw42
You are on Windows. The syntax is slightly different. The ^ symbol is an escape and so needs to be doubled. In ImageMagick 7, use magick, not magick convert. So your command should be the following if you want your output to be exactly 1280x1920.

Code: Select all

magick C:\Users\gm\Desktop\Vader.jpg -resize 1280x1920^^ -gravity center -crop 1280x1920+0+0 +repage C:\Users\gm\Desktop\Vader.jpg

Re: How to fit image sizes correctly

Posted: 2019-05-26T07:55:37-07:00
by GoncaloM
Ok, so that was the issue, great!
Now I just need to understand how can I map it to Magick.NET. What's the meaning of that symbol "^" and in the crop what means the "+0+0 " after the Crop operation? Maybe by knowing the meaning it is easier.

Re: How to fit image sizes correctly

Posted: 2019-05-26T10:24:38-07:00
by fmw42
With regard to the +0+0 in crop, you have to specify an offset where to start the crop (relative to whatever gravity you use, which defaults to gravity=northwest). Without that, you will get many non-overlapping crops. See https://imagemagick.org/Usage/crop/#crop and https://imagemagick.org/script/command- ... s.php#crop.