How to Scale a image propotionally?
lazarus / 39-Graphics

----------------------------------------------------------------------
asdlinux · 2019-02-11 10:31

Hi Everyone,

I am making a small(so far) filemanager to learn Lazarus/FPC. In my
fileManager I want to have a simple Image viewer, I managed to get
that to work but when the image is bigger than the screen I want it to
scale down to about 85% of the screen resolution. My current problem
is how to scale the Image propotionally, I got it to scale to 85% of
current screen resolution but when i do this it is not propotional.

At the moment I got this:
Code: Pascal  [Select][+][-]window.onload = function(){var x1 =
document.getElementById("main_content_section"); if (x1) { var x =
document.getElementsByClassName("geshi");for (var i = 0; i      if
(ImageFile.Width>Screen.Width) or (ImageFile.Height>Screen.Height)
then     begin       WProc:=round(Screen.Width div 100);     
 HProc:=round(Screen.Height div 100);       WScale:=Screen.Width div
WProc;       HScale:=Screen.Height div HProc;     
 WScale:=WScale-75;       HScale:=HScale-90;     
 WScale:=WScale*WProc;       HScale:=HScale*HProc;     
 SW:=Round(Screen.Width-WScale);       SH:=Round(Screen.Height-
HScale);       R.Right:=SW;       R.Bottom:=SH;     
 ImageViewer.Image.Canvas.StretchDraw(R, ImageFile.Graphic);      end;

How can I calculate the resolution of the image to be propotional?
(Sorry for the beginner code )

Thank you !

----------------------------------------------------------------------
Handoko · 2019-02-11 10:36

To be able to scale image proportionally, you need to calculate the
aspect ratio first.

You can learn from this post:
https://forum.lazarus.freepascal.org/index.php/topic,43823.msg307918.h
tml#msg307918

Try it yourself. If you still can't understand, I'm willing to help.

----------------------------------------------------------------------
asdlinux · 2019-02-11 10:41

Thank you for the hint, I will try myself first so I will learn. If I
run into trouble I will ask you

----------------------------------------------------------------------
wp · 2019-02-11 10:47

What is ImageViewer.Image? A TImage? In this case you can get
proportional scaling done automatically by setting property
"Proportional" to true.

Another comment on your code: Which procedure is calling this? If you
are doing this outside a Paint routine you will have trouble because
painting on a Canvas is not persistent in such a case (the OS may
request your application to redraw the image but your routine will not
notice it).

----------------------------------------------------------------------
asdlinux · 2019-02-11 13:16

ImageViewer.Image is a TImage, I set the propotional Property But
Can't see any difference. Using The link from Handoko, I managed to
get a better result but still Something is missing. Now I got this:
Code: Pascal  [Select][+][-]window.onload = function(){var x1 =
document.getElementById("main_content_section"); if (x1) { var x =
document.getElementsByClassName("geshi");for (var i = 0; i      if
(ImageFile.Width>Screen.Width) or (ImageFile.Height>Screen.Height)
then     begin       AspectImage:=ImageFile.Width div
ImageFile.Height;       WProc:=round(Screen.Width div 100);     
 HProc:=round(Screen.Height div 100);       WScale:=Screen.Width div
WProc;       HScale:=Screen.Height div HProc;     
 WScale:=WScale-85;       HScale:=HScale-87;     
 WScale:=WScale*WProc;       HScale:=HScale*HProc;     
 SW:=Round(Screen.Width-WScale);       SH:=Round(Screen.Height-
HScale);       if ImageFile.Width>ImageFile.Height then       begin  
      SH:=Round(SH*AspectImage);       end else       Begin       
 SW:=Round(SW/AspectImage);       end;       R.Right:=SW;     
 R.Bottom:=SH;       ImageViewer.Width:=SW+6;     
 ImageViewer.Height:=SH+6;       ImageViewer.Image.Width:=SW;     
 ImageViewer.Image.Height:=SH;     
 ImageViewer.Image.Canvas.StretchDraw(R, ImageFile.Graphic);      
 end; 
Any Hints on where i mess up? Maybe I have wrong logic in my thinking.

----------------------------------------------------------------------
wp · 2019-02-11 14:11

I don't know why you do all this, subtracting constant values, etc.
See at the attached demo to learn how scaled drawing works. It also
shows that setting the Image's Proportional to true automatically
scales the image without any lines of code. i don't know why it is not
working for you.

----------------------------------------------------------------------
asdlinux · 2019-02-11 14:44

Thank you Very much, With the example I was able to solve it. Now the
next problem is Look in the exif to see if it is landscape/Portrait
mode and then rotate it to show correct. Is there any unit I can use
to extract What mode it was taken with ? Or should I put that in a new
question?

----------------------------------------------------------------------
Handoko · 2019-02-11 14:48

You should start a new thread. Because I don't know how and I am
interested too.