TImage behavior

[Birger52]

Creating a control to show picture tumbnails and som data.
Seem to have some problems understanding TImage properties.
TImage is created programmatically like this:

Code: Pascal  [Select][+][-]

1. constructor TPlayImage.Create(aInfo:TPlayInfo; aHeight:integer);
2. begin
3.   inherited Create(aInfo);
4.   Parent := aInfo;
5.   FCont := AInfo.FCont;
6.   Name := 'Image_'+IntToStr(aInfo.FIndex);
7.   Autosize := true;
8.   Constraints.MaxHeight := aHeight;
9.   Constraints.MinHeight := aHeight;
10.   Constraints.MaxWidth := aHeight;
11.   Proportional := true;
12.   StretchInEnabled := true;
13.   AnchorSide[akLeft].Side := asrLeft;
14.   AnchorSide[akLeft].Control := aInfo;
15.   AnchorSide[akTop].Side := asrTop;
16.   AnchorSide[akTop].Control := aInfo;
17.   AnchorSide[akBottom].Side := asrBottom;
18.   AnchorSide[akBottom].Control := aInfo;
19.   BorderSpacing.Left := 4;
20.   BorderSpacing.Around := 1;
21.   Anchors := [akLeft, akTop, akBottom];
22.   DragMode := dmManual;
23.   DragKind := dkDrag;
24. end;

The expected behavior, is an image that is max 120 pix in any dimension - if original is higher than 120px, the width of the TImage should be adjusted accordingly
If the width becomes higher than 120, the width is set to 120px and the hight of TImage is still 120, but not filled out.
This is not what happens.
Testing with images 160 X 240 (w X h), the height of the image is 120 - but the width is also 120; autosize and proportional settings are ignored?
If I remove the

Code: Pascal  [Select][+][-]

1.   Constraints.MaxWidth := aHeight;

the TImage gets the same size as the original image - again autosize and propertional is ignored.

Any solution to this?

[lucamar]

Don't set Autosize to True; that makes the TImage as wide and as as high as the loaded image. Instead, just make your TImage 120x120 and set Stretch, Proportional and (maybe) Center to True. You could even set:

Code: Pascal  [Select][+][-]

1. Image1.Stretch := (Original.Width > 120) or (Original.Height > 120);

to have it not expand small images.

[Birger52]

Description of the AutoSize property:
"Allows to automatically adjust the size of the control, according to its content."
This should IMHO mean, that a TImage assumes the size of the image drawn on screen.
What it actually does, seems to be a mix - the height is set according to constraints, image scaled to fit, and width is set to the original, and not the scaled image.
Constraints: "The minimal and maximal Width and Height of this control."

Not setting AutoSize to true, makes the width of the TImage a default size - the size a TImage gets, if it is just dropped at designtime, if it is not limited by the constraint width.
I tried setting a smaller width - but that apparently overwrites Constraints!


Changed programming, so scaling is done manually.
Image created like this:

Code: Pascal  [Select][+][-]

1. constructor TPlayImage.Create(aInfo:TPlayInfo; aHeight:integer);
2. begin
3.   inherited Create(aInfo);
4.   Parent := aInfo;
5.   FCont := AInfo.FCont;
6.   Color := clNone;
7.   Width := aHeight;
8.   Height := aHeight;
9.   Name := 'Image_'+IntToStr(aInfo.FIndex);
10.   StretchInEnabled := true;
11.   Proportional := true;
12.   AnchorSide[akLeft].Side := asrLeft;
13.   AnchorSide[akLeft].Control := aInfo;
14.   AnchorSide[akTop].Side := asrCenter;
15.   AnchorSide[akTop].Control := aInfo;
16.   BorderSpacing.Left := 4;
17.   BorderSpacing.Around := 1;
18.   Anchors := [akLeft, akTop];
19.   DragMode := dmManual;
20.   DragKind := dkDrag;
21. end;

Then loading and scaling the image like this

Code: Pascal  [Select][+][-]

1. procedure TPlayInfo.SetInfo(aImg, aTxt:string);
2. var
3.   fWidth, fHeight : integer;
4.   psc, hsc : real;
5. begin
6.   FImage.Picture.LoadFromFile(aImg);
7.   fWidth := FImage.Picture.Bitmap.Width;
8.   fHeight := FImage.Picture.Bitmap.Height;
9.   psc := FMaxImgSize/fWidth;
10.   hsc := FMaxImgSize/fHeight;
11.   if (psc > hsc) then psc := hsc;
12.   if psc > 1 then psc := 1;
13.   fWidth := round(fWidth*psc);  // Billeddimension i pixels
14.   fHeight := round(fHeight*psc);
15.   FImage.Width := fWidth;  // Billeddimension i pixels
16.   FImage.Height := fHeight;
17.   FInfoLabel.Caption := aTxt;
18.   Refresh;
19. end;

It may not be optimal - but in contrast to what would be logical (from documentation) this has the advantage, of actually producing the desired results.

[wp]

You have some conflicting requirements in your code of the first post: you set the Height, but you anchor top and bottom borders to another control; anchoring I think is the most dominating size requirement and it certainly makes the LCL ignore the specified height. So, you must decide: if the specified height is more important, then you should remove the (bottom) anchor.

Moreover, but not related to your issue, I absolutely do not recommend to specifiy the Name of a run-time created component, leave it empty instead. The Name is needed by the Form Designer which is not involved here. And you will run into problems once the same Name is re-used because the IDE requires unique names.

There are some thumbnail components out there:
- TJvImagesViewer or TJvThumbView in package JvCustom of JVCL (install by OPM or from https://sourceforge.net/p/lazarus-ccr/svn/HEAD/tree/components/jvcllaz/).
- theo's ThumbNailViewer (https://github.com/theo222/lazarus-thumbviewer).

[Birger52]

I thank you for your comments - they are appreciated.

Anchoring to top and bottom, was to make sure, that Parent would wrap itself around it - Parent has AutoSize set to true.
But I do see the problem; if The data in the accompanying TLabel makes the label higher than the image, it will be an impossible situation.
So in the new version, the TImage is centered horizontally in the parent.

I think I previously had some problems identifying programmatically created controls, which is why, I usually gives them a name.
Nut I think you are right about that too -  - I never use the name for anything anyway...

I will look at the thumbnail links provided;

Thx again.